Angular 应用程序的 E2E 测试中的隐式等待答案

【问题标题】：Implicit waiting in E2E tests for Angular applicationAngular 应用程序的 E2E 测试中的隐式等待
【发布时间】：2018-05-21 09:16:23
【问题描述】：

我对 Angular 4/ASP.NET Core Web API 应用程序进行了 E2E 测试（使用 Selenium WebDriver）。

在某些测试中，我偶尔会遇到超时/等待问题。

E2E 框架有一个方法 WaitForAngular()，它使用一些 Javascript（取自 Protractor）等待 Angular 在继续之前表明它已加载所有“可测试性”（参见https://stackoverflow.com/a/39349865/95423）

然而，这似乎并不完全可靠，有时在运行中我们会出现无限期等待。

我们使用的另一种方法是隐式等待相关元素被渲染：

var url = "targetURL"
Driver.Instance.Navigate().GoToUrl(url);

var waitSeconds = 15;
var navWait = new WebDriverWait(Driver.Instance, TimeSpan.FromSeconds(waitSeconds))
{
    Message = $"The targetURL failed to load in {waitSeconds} seconds"
};

navWait.Until(x => x.FindElementById(targetUrlId) != null || x.FindElementById(forbiddenId) != null);

我看到第二种方法的结果更可靠，但是如果不仔细考虑隐式等待的条件，这意味着更多的代码和可能更脆弱的测试。

这里哪种方法更好，或者有替代方法吗？

【问题讨论】：

标签： angular selenium selenium-webdriver e2e-testing

【解决方案1】：

您使用的是哪个版本的 Angular？

如果您只需要等待一个元素被渲染，您可以尝试：

import { browser } from 'protractor';
const waitLimit = 15000;
browser.wait(() => {
  return myHtmlElement.isDisplayed();
}, waitLimit);

【讨论】：

谢谢，但是问题更多的是“哪个更好：等待特定元素被渲染或等待 Angular 发出完成信号”
量角器应该在每个 webdriver 操作之间自动应用 waitForAngular，你不需要手动触发它，但是有一些事件需要跟踪，在我的例子中是一些自定义动画或滚动事件没有被考虑在内，我认为这是等待特定元素呈现或出现在您期望它是有效方法的地方。希望有帮助！
我们使用 Selenium，而不是 Protractor 来驱动我们的测试。我们刚刚从 Protractor 中“借用”了一些代码来实现 WaitForAngular 方法。