量角器从 dom 中删除元素答案

【问题标题】：Protractor removes element from the dom量角器从 dom 中删除元素
【发布时间】：2015-05-15 10:11:26
【问题描述】：

由于我们正在使用的模板的奇怪（而且不太酷）行为，我被困在量角器测试中。

在页面加载时，模板具有将在 1 秒后以这种方式隐藏的叠加层：

$(document).ready(function(config){
    setTimeout(function(){
       $('.page-loading-overlay').addClass('loaded');
       $('.load_circle_wrapper').addClass('loaded');
    },1000);
});

*这让我感觉很糟糕（不想对此发表评论）

无论如何，我的测试被破坏了，因为它们的运行速度超过一秒，并且抛出了这个错误：

UnknownError: unknown error: Element is not clickable at point (463, 625). Other element would receive the click: <div class="page-loading-overlay loaded">...</div>

因为显然是overlay接收点击。

我找到了一种在测试中设置超时的解决方法，但这确实会减慢我的套件和 CI/CD 进程。并且把测试代码弄得乱七八糟。

代码如下：

it('should test something', function(){
    setTimeout(function(){
        // test code
    }, 1000);
});

我想知道是否有任何方法可以在 beforeEach 语句中从 DOM 中删除一个元素，以完全删除覆盖，因为我不想测试它并且我不担心它是否损坏。

有什么建议吗？

【问题讨论】：

如果在继续之前先关闭/删除测试中的覆盖层会怎样？

标签： angularjs dom testing protractor e2e-testing

【解决方案1】：

您可以使用browser.executeScript 在浏览器上下文中执行一些代码：

beforeEach(function() {
  browser.executeScript("$('.page-loading-overlay').remove();");
});

【讨论】：

感谢您的建议，根据@alecxe 的建议，我避免删除该元素并简单地在 beforeEach 中添加类。我更喜欢采用这种方法，因为我希望尽可能快地进行测试。

【解决方案2】：

我不认为在测试期间删除 DOM 结构的一部分是一个好主意。不要使用超时，而是显式等待元素可点击：

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

browser.wait(EC.elementToBeClickable(elm), 5000);

【讨论】：