javascript - 等待吐司在量角器中消失

Question

概括

使用 Protractor 测试 AngularJS webapp 时，如何等待所有 toast 消失？

更多细节

我有一个 AngularJS 应用程序，我正在使用 Protractor 进行测试。我正在使用 angular-toastr 在应用程序中发生事情时显示通知。

在测试中的某个时刻，我无法单击按钮，因为吐司当前阻塞了该按钮。我得到的错误是：

Element is not clickable at point (898, 712). Other element would receive the click: <div id="toast-container" {...}

所以我想等 toast 消失后再继续。由于 angular-toastr 不使用$timeout，我不能这样做browser.waitForAngular();

那么我该怎么做呢？

我不想做什么？

我不是想测试吐司的内容。现在，我根本不在乎吐司，我只想点击吐司遮住的按钮。

Answer 1

我在这篇博文中找到了一个起点：http: //docsplendid.com/archives/209

我对其进行了一些调整以与 toastr 一起使用，这就是它最终的结果：

var hasClicked = false;

browser.wait(function() {
    var deferred = protractor.promise.defer();

    var elements = element.all(by.className('toast'));
    var count = elements.count().then(function (result) {
        // If there are toasts active, click them to hide them faster.
        if (result > 0 && !hasClicked) {
            elements.click();
            hasClicked = true;
        }
        deferred.fulfill(result === 0);
    });

    return deferred.promise;
});

Answer 2

您可以等待元素不存在（或者不显示）：

browser.wait(function () {
    return $('#toast-container').isPresent().then(function (toastPresent) {
        return !toastPresent;
    });
}, 10000);

Answer 3

不是您的任务的答案，但您可以单击 Toastr 消息使其消失，然后再尝试单击被遮挡的按钮。

element(by.css(".toast-message")).click()