Question

我的测试用例是点击复选框＆amp;在检查后不久，显示了一个微调器进度动画，如果显示我想断言。使用isDisplayed（）方法总是在单击复选框后返回false并且我的测试用例失败，尽管我可以看到在UI上加载微调器动画。

尝试了以下失败的代码：

var checkbox = element(by.id("crucial-one"));
browser.wait(EC.presenceOf(checkbox),5000);
checkbox.click();
var spinner = element(by.id("loading-spinner"));
spinner.isDisplayed().then(function(text){
        console.log(text);
    });
expect(spinner.isDisplayed()).toBe(true);

在点击复选框之前，微调器的HTML代码：

<body class="searches">
<div id="loading-spinner" class="wda-overlay" style="display: none;">
    <div class="progress-box" role="region">
        <div class="loader-container large">
            <svg class="loader" viewBox="25 25 50 50">
        </div>
    <div class="msg">Loading...</div>
    </div>
</div>

点击复选框后微调器的HTML代码：

<body class="searches">
<div id="loading-spinner" class="wda-overlay" style="display: block;">
    <div class="progress-box" role="region">
        <div class="loader-container large">
            <svg class="loader" viewBox="25 25 50 50">
        </div>
    <div class="msg">Loading...</div>
    </div>
</div>

Answer 1

您不需要在此使用Expect作为“ browser.wait（EC.visibilityOf（element））”将失败您的测试用例在给定时间内没有加载微调器可见时。

注意我已将presenceOf更改为 visibilityOf 。

it('should show loading-spinner', () => {
  var checkbox = element(by.id("crucial-one"));
  var spinner = element(by.id("loading-spinner"));

  browser.wait(EC.presenceOf(checkbox), 5000);
  checkbox.click();
  browser.wait(EC.visibilityOf(spinner), 5000);
});

您还可以创建函数以使代码更清晰：

export function waitFor(elm: ElementFinder, waitTime: number): promise.Promise < boolean > {
  return browser.wait(EC.visibilityOf(elm), waitTime);
}

// And use it like that:

waitFor(element, 3000);

Answer 2

我遇到了同样的问题。 Marcin的回答是正确的，您必须在条件browser.wait()下使用visibility.Of()

如果微调框显示短，请同时使用browser.waitForAngularEnabled(false);

使用isDisplay方法-Protrctor获取加载微调器的可见性

2 个答案: