javascript - 如何等到页面加载图像在非 Angular 页面上的 Protractor 中消失

Question

在非 Angular 站点上，当我单击某个单选按钮时，出现页面加载 gif。在 Protractor 测试中，我想等到这个加载器 gif 消失，然后检查另一个元素。

加载程序的 HTML(一直存在):

<div class="loader" style="display: none;">
    <div id="loader">
        <img src="/img/loading.gif">
    </div>
    <div class="totalMaskForLoader"></div>
</div>

我在测试中做了什么:

        ...
        //  click on balance dropdown
        page.sortByBalanceSelector.click();

        browser.wait(function() {
                    // return a boolean here. Wait for spinner to be gone.
                    return !browser.isElementPresent(by.css(".loader"));
                }, 20000);

        // compare to the starting player's username
        expect(page.hasText(page.usernameCellButton)).not.toContain(startingUsername);

问题是我总是得到

Wait timed out after 20009ms

如何等待加载器 gif 消失？

Answer 1

有一个内置的invisibilityOf此用例的预期条件:

page.sortByBalanceSelector.click();

var loader = element(by.id("loader"));
var EC = protractor.ExpectedConditions;

browser.wait(EC.invisibilityOf(loader), 5000);

您也可以使用 stalenessOf这基本上意味着“不存在”。

---

您当前方法的问题在于，您将“不”应用于 isElementPresent() 返回的 promise ，并且由于 promise 始终为真，由于等待条件，您总是会得到“假”，因此会出现超时错误。