无法让量角器等待现有元素可点击（condition.elementToBeClickable）答案

【问题标题】：Cant get protractor to wait for an existing element to be clickable (condition.elementToBeClickable)无法让量角器等待现有元素可点击（condition.elementToBeClickable）
【发布时间】：2017-05-18 12:13:17
【问题描述】：

我们有一个 Angular 1.5 应用程序，它有一个登录屏幕，应用程序代码和我们的测试都没有改变。我们使用量角器（带有 grunt-protractor 等）
版本：

  "dependencies": {
    "async": "^0.9.0",
    "chalk": "^1.1.1",
    "fs-extra": "^0.24.0",
    "grunt": "~0.4.5",
    "grunt-contrib-jshint": "^0.10.0",
    "grunt-protractor-runner": "^4.0.0",
    "grunt-protractor-webdriver": "^0.2.5",
    "jshint-stylish": "^1.0.0",
    "load-grunt-tasks": "~3.1.0",
    "lodash": "^2.4.1",
    "log4js": "^0.6.21",
    "protractor": "^4.0.11",
    "selenium-webdriver": "^3.0.1"
  }

我们所有的测试都采用以下格式：

登录应用程序并休眠

测试（它）。每个它都会从 browser.sleep('1000').then(done) promise (jasmine 语法) 获取测试结束时调用的 done() 函数。

describe('login', function () {
    browser.get('/');
    components.login.loginDefault();
    console.log('done login');
    browser.driver.manage().window().maximize(); // just in case the driver wont reach the '.add-new-type' button 
    browser.sleep(1000);
});

describe('post login', function () {
    it('just a test for after user loged in', function (done) {
        console.log('post login');
        const ec = protractor.ExpectedConditions;
        const getStarted = element(by.css('.add-new-type')); // just a button appears on the next page
        console.log('getStarted ' + JSON.stringify(getStarted));
        browser.wait(ec.elementToBeClickable(getStarted), 5000);
        console.log('post wait');
        browser.sleep(5000).then(done);
   })});

我们没有改变依赖版本或在我们的环境中什么都没有，突然没有任何效果，测试只通过了登录阶段，然后因为找不到元素而失败（我猜）并卡住直到 jasmine 抛出超时异常

Session created: count=1, browserName=chrome, chromeOptions={args=[--no-sandbox, --test-type=browser, --disable-extensions], prefs={download={default_directory=./e2e/tmp, prompt_for_download=false}}}
node path changed
done login
Started
post login
F

登录后测试只是一个例子，我们尝试了其他方法让驱动程序在等待“ExpectedConditions”之外等待。如果我要在控制台调试器（chrome）中查找元素，我会正确获取元素...... 我们还尝试调试并在 repl 模式下打印

element(by.css('.add-new-type')).getText()

并且行为是相同的 - 没有/没有响应

有什么帮助！

【问题讨论】：

标签： angularjs selenium protractor automated-tests

【解决方案1】：

你试过等待元素和网址吗？

'use strict';

var WaitUtils = function () {

    this.waitElement = function (element , timeout) {
        timeout = timeout || browser.params.time.long;
        var expected = protractor.ExpectedConditions;
        return browser.wait(expected.visibilityOf(element), timeout, "Element not found");
    };

    this.waitUrl = function (url, timeout) {
        timeout = timeout || browser.params.time.long;
        var expected = protractor.ExpectedConditions;
        return browser.wait(expected.urlContains(url), timeout, "URL has not contains "+url);
    };
};

module.exports = WaitUtils;

【讨论】：

如果你的 url 是指路线，那么是的，但是使用 browser.sleep(1000);而不是 browser.params.time.long，谢谢，我会尽快结帐！

【解决方案2】：

我认为这是因为您的测试运行速度快于浏览器加载元素的速度，看看这是否有效；

describe('post login', function () {
it('just a test for after user loged in', function (done) {
    console.log('post login');
    const ec = protractor.ExpectedConditions;
    const getStarted = element(by.css('.add-new-type'));

    browser.wait(ec.visibilityOf(getStarted), 5000);

    console.log('getStarted ' + JSON.stringify(getStarted));
    browser.wait(ec.elementToBeClickable(getStarted), 5000);
    console.log('post wait');
    browser.sleep(5000).then(done);
})});

希望对你有帮助！

【讨论】：

非常感谢您的回复，不幸的是这没有奏效，问题是这些测试之前运行完美，我们还怀疑测试没有等待页面加载并且目前没有'找不到让它工作的方法

【解决方案3】：

所以在调查之后，我发现了有问题的提交，我们没有更改应用程序中的任何 css，但我确实使用 $timeout 实现了自动保存机制。我认为我们的内部超时以某种方式导致与量角器的超时冲突...参考问题here（量角器的github repo）

他们建议使用 $interval 而不是 timeout - 这实际上解决了问题，但我不确定是否要使用此解决方法。

【讨论】：