Selenium 元素在javascript中的点（chrome）不可点击

Question

我是 Selenium 新手，我正在 Browserstack 上运行我的 selenium 脚本。

一切正常，直到我到达页面底部的 10%。

我收到以下错误：

未捕获的 WebDriverError：Appium 错误：未知错误：元素在点 (20, 324) 处不可点击。其他 元素会收到点击： ... （会话信息：chrome=58.0.3029.83） (驱动信息: chromedriver=2.29.461571 (8a88bbe0775e2a23afda0ceaf2ef7ee74e822cc5),platform=Linux 3.19.8-100.fc20.x86_64 x86_64)

这是我的代码：

describe.only(testTitle, function () {
    before(function () {
        driver = driverConfiguration.getDriverConfiguration(testTitle, 'chrome')
    })
    after(function (done) {
        driver.quit().then(done)
    })
    it('Sample tests', function (done) {
        driver.get('https://www.test.com').then(function(){
            driver.findElement(webdriver.By.name('cardNumber')).sendKeys('0000000000').then(function(){
                driver.findElement(webdriver.By.id('billingLine1')).sendKeys('test');
                driver.findElement(webdriver.By.id('billingLine2')).sendKeys('test');
                driver.findElement(webdriver.By.id('billingCity')).sendKeys('San Jose');
                driver.findElement(webdriver.By.id('agree')).click(); // ERROR!!!!!
            }).then(function() {
                driver.quit().then(done);
            })
        });
    })
})

当我执行以下操作时：

            // return driver.wait(function() {
            //     return driver.findElement(webdriver.By.id('agree')).isDisplayed();
            // }, 1000);

它说的是真的。该元素是可见的。

在三星 Galaxy S8 上使用 Chrome

我不知道如何解决这个问题。

Answer 1

您在问题中省略了错误消息中最重要的部分

其他元素会收到点击：...

... 部分中的元素是阻止点击的元素。正如您所发现的，Selenium 报告该元素已显示/可见。此错误消息只是说明当 Selenium 尝试单击元素时，另一个元素阻止了单击。如果您查看阻塞元素的 HTML 并在页面的 HTML 中搜索，您应该能够识别该元素。根据我的经验，它是一个对话框或页面底部的横幅等。有时您需要关闭它，有时您需要向下/向上滚动一点以从阻塞 UI 后面获取所需的元素.

Answer 2

上接 cmets ...

我也遇到了这个问题，当我需要点击一个按钮但它在屏幕上不可见时（但是，它被代码检测到了）。 为了解决这个问题，我使用 WebDriver 的 executeScript() 方法在页面上运行一些 JavaScript 以滚动直到我的按钮出现在视图中。

driver.executeScript(`
    var target = document.getElementById('agree');
    var tarTop = target.getBoundingClientRect().top;
    document.body.scrollTop = tarTop;
`);

如果您想为滚动添加超时，可以尝试driver.executeAsyncScript()，以确保页面首先到达其目的地。那时你将使用 async/await...

await driver.executeAsyncScript(`
    var callback = arguments[arguments.length - 1];
    var target = document.getElementById('agree');
    var tarTop = target.getBoundingClientRect().top;
    document.body.scrollTop = tarTop;
    setTimeout(()=>{ callback( true ); }, 1500);
`).then((data)=>{
    return data;
});