nightwatch.js - 滚动直到元素可见

Question

我想滚动页面，直到所需的元素显示为可见。

我试过了：

    browser.execute(function () {
        window.scrollBy(0, 10000000);
    }, []);

和

browser.getLocationInView("<selector>", function(result) {
    this.assert.equal(typeof result, "object");
    this.assert.equal(result.status, 0);
    this.assert.equal(result.value.x, 200);
    this.assert.equal(result.value.y, 200);
});

首先不滚动页面，第二个失败，因为元素不可见。

如何解决这个问题？我想滚动，直到元素看起来可见。

Answer 1

如果您使用的是JQuery，可以这样做：

browser.execute(function () {
    $(window).scrollTop($('some-element').offset().top - ($(window).height() / 2));
}, []);

或使用纯JavaScript：

browser.execute(function () {
    document.getElementById("some-id").scrollIntoView();
}, []);

此外，在某些情况下，我建议使用Nightwatch's waitForElementVisible而不是断言，因为在使用断言时，您只在给定时刻检查元素是否可见但使用waitForElementVisible您可以指定等待它可见的时间。

如果先前隐藏了元素，则在运行断言之前可能看不到该元素，这导致断言即使元素实际可见也会失败。