scrollIntoViewIfNeeded 脚本不适用于量角器

scrollIntoViewIfNeeded script not working with protractor

我正在使用量角器开发自动化网络测试。

有时,我想在单击某个元素之前将其滚动到视图中(这是有道理的),我使用“scrollIntoView”脚本执行此操作。

当我向下滚动时,这并不总是有效,因为当帐户未验证时底部会出现一个横幅,它会覆盖元素。

我在浏览器控制台中执行了 elmement.scrollIntoViewIfNeeded(true),无论是向上滚动还是向下滚动,它都非常有效。

问题是,当我在测试中使用它时,它不起作用。

这是一个代码片段。

         /**
         * Scrolls the element into view
         * */
        async scrollIntoView() {
            await browser.executeScript('arguments[0].scrollIntoViewIfNeeded(true)', this.webElement.getWebElement());
        }

我还制作了一个名为 class 的按钮来表示 DOM 中具有“按钮”标签的元素,这也是代码片段。

/**
 * A class that handles actions on buttons.
 * */
export class Button extends WebComponent {

    /**
     * @param webElementText Text that the web element contains.
     * @param locatorType Locator type of the web element to search for.
     * @param locator Locator of the web element to search for.
     * @param parentElement Parent Web Component if it exists.
     */
    constructor(webElementText, locatorType, locator, parentElement: WebComponent = null) {
        super(webElementText, locatorType, locator, parentElement);
    }

    /**
     * Clicks on the WebElement found
     * The click can be done with either JavaScript or with an interaction with the UI.
     * @param usingJavaScript {boolean} Boolean to decide whether to use JavaScript for the click or a UI interaction.
     */
    async click(usingJavaScript = false) {
        if (usingJavaScript) {
            await this.isPresent();
            await browser.executeScript("arguments[0].click();", await this.webElement.getWebElement());
        }

        else {
            await this.isPresent();
            await this.scrollIntoView();
            await this.isVisible();
            await this.isClickable();
            await this.webElement.click();
        }
    }
    
}

2 个假设为什么这行不通:

  • 你打电话给 click() 没有 await
  • this.webElement.getWebElement() - 定位器有问题

除此之外,我觉得一切都很好。

如果你做不到,试试我的方法,对我有用

    /**
     *  Scrolls to passed element and then Y pixels down by injecting js scroll() in the context of window
     *  @param      {ElementFinder}     $element        Locator of element
     *  @param      {number}            [offsetY=0]     Offset by Y axis (how much extra pixels to scroll)
     *  @param      {number}            [sleep=200]     wait after scroll to allow scrolling animation to complete
     *  @return     {Promise}
     */
    scroll: async ($element, offsetY = 0, sleep = 200) => {
        await browser.executeScript(`arguments[0].scrollIntoView({block: "center"});`, $element.getWebElement());
        await browser.sleep(sleep);
    }

请注意,{block: "center"} 使其滚动直到元素位于页面中间,并且确实解决了 footers/headers 与它重叠时的问题