滚动在一个带有 Protractor 的 div 元素上。

huangapple go评论57阅读模式
英文:

Scrolling on a div element with protractor

问题

I need to scroll down an element in order to click a checkbox. Basically a user agreement that I have to accept. The checkbox is unclickable until I didn't scroll to the bottom of the div.

This is how my function that checks the checkbox looks like:

async privacyStatementEnableCheckbox(){
    await browser.sleep(3000);
    await this.privacyStatementTextContent.click();
    let privacyStatementCheckbox = element(by.xpath(AcceptNewInvitationPage.SELECTORS.privacyStatementCheckbox));
    await browser.actions().mouseMove(this.privacyStatementTextContent).perform();
    await browser.sleep(3000);
    await privacyStatementCheckbox.click();
}

I use browser.sleep() to see what's happening, and apparently, the div is not scrolling. The error I get is:

WebDriverError: element click intercepted: Element is not clickable at point xy... another element would be clicked instead

I assume this is because there is a "hider" element that is ON the checkbox until the user scrolls to the bottom of the div.

I also tried:

async privacyStatementEnableCheckbox(){
    await browser.sleep(3000);
    await this.privacyStatementTextContent.click();
    let privacyStatementCheckbox = element(by.xpath(AcceptNewInvitationPage.SELECTORS.privacyStatementCheckbox));
    await browser.executeScript('window.scrollTo(0,10000)').then(async function(){
       //check if the checkbox is checked or not
        if(await this.privacyStatementCheckboxValue.getAttribute("data-bv-result") !== "VALID"){
            await browser.sleep(3000);
            await privacyStatementCheckbox.click();
        }
    }
}

I know there are a lot of topics about scrolling a div here but I couldn't find a solution among them that works for me. Neither option performed the scroll on the div for me, and I couldn't find much information about how mouseMove(element) works. If anyone could point out what am I doing wrong, I would be grateful.

Additional info: I'm using Chrome, Protractor, and Cucumber.

英文:

I need to scroll down an element in order to click a checkbox. Basically a user agreement that i have to accept. The checkbox is unclickable until i didn't scroll to the bottom of the div.
This is how my function that checks the checkbox look like:

async privacyStatementEnableCheckbox(){
    await browser.sleep(3000);
    await this.privacyStatementTextContent.click();
    let privacyStatementCheckbox = element(by.xpath(AcceptNewInvitationPage.SELECTORS.privacyStatementCheckbox));
    await browser.actions().mouseMove(this.privacyStatementTextContent).perform();
            await browser.sleep(3000);
            await privacyStatementCheckbox.click();
        }
        
}

I use browser.sleep() to see whats happening, and appearently the div is not scrolling. The error i get is:

> WebDriverError: element click intercepted: Element is not clickable at point xy... another element would bew clicked instead

I assume this is because there is a "hider" element that is ON the checkbox until the user scrolled to the bottom of the div.

I also tried :

async privacyStatementEnableCheckbox(){
    await browser.sleep(3000);
    await this.privacyStatementTextContent.click();
    let privacyStatementCheckbox = element(by.xpath(AcceptNewInvitationPage.SELECTORS.privacyStatementCheckbox));
    await browser.executeScript('window.scrollTo(0,10000)').then(async function(){
       //check if the checkbox is checked or not
        if(await this.privacyStatementCheckboxValue.getAttribute("data-bv-result") !== "VALID"){
            await browser.sleep(3000);
            await privacyStatementCheckbox.click();
        }
}

I know there are a lot of topics about scrolling a div here but i couldn't find a solution among them that works for me.
Neither option performed the scroll on the div for me, and i couldnt find much information about how moseMove(element) works.
If anyone could point out what am i doing wrong i would be grateful.
Additional info: Im using chrome, protractor, cucumber.

答案1

得分: 1

我知道这与端到端测试概念相悖。

但如果您不打算对此协议和复选框进行任何断言,只需继续进行实际测试,您可以:

  1. 在您“阅读”协议之前检查复选框。
  2. 在之后检查,并找出哪个属性在改变并启用它。
  3. 使用browser.executeScript更改此属性。
英文:

I know this is going against E2E testing concept.

But if you are not going to do any assertion about this agreement and checkbox and you just need to move forward to start actual tests you can:

  1. Inspect the checkbox before your have 'read' the agreement
  2. Inspect it after and find out what property is changing and making it enabled.
  3. Change this property by using browser.executeScript

答案2

得分: 0

I eventually solved it telling protractor to press the end button

await this.privacyStatementTextContent.click();
await browser.actions().sendKeys(protractor.Key.END).perform();
await browser.sleep(1000);
await privacyStatementCheckbox.click();

英文:

I eventually solved it telling protractor to press the end button

await this.privacyStatementTextContent.click();
    await browser.actions().sendKeys(protractor.Key.END).perform();
    await browser.sleep(1000);
    await privacyStatementCheckbox.click();

huangapple
  • 本文由 发表于 2020年1月6日 17:41:17
  • 转载请务必保留本文链接:https://go.coder-hub.com/59609752.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定