基于 AngularJS 的 Web 应用程序的 Web UI 回归测试

Web UI regression testing for AngularJS-based web applications

在最近一次基于 AngularJS 的求职面试中,客户讨论了对 Web UI 回归测试的需求。

客户简要介绍了他们在最后一分钟对生产环境进行 DOM 更改的场景,但事实证明他们添加的新按钮在页面上引起了一些问题(我相信确切的问题是新按钮被隐藏了,但没有人提前发现问题)。

谈话的主要内容是,如果我能想出一个 Web UI 回归测试来比较旧的 UI 和新的,那就太好了UI.

我自己不是回归测试专家,我寻求一些关于最好的 UI 测试工具的建议。

有一些 AngularJS 经验,我的第一个方法是使用 Protractor - 我知道它基于 Selenium WebDriver.

我也遇到过一些视觉 UI 回归工具,例如 https://github.com/garris/BackstopJS, http://screenster.io/ , and https://www.parasoft.com/capability/web-ui-testing/

所以我的主要问题是 AngularJS 测试人员:测试应用程序中 DOM 更改的最佳解决方案是什么?

如果这个问题太模糊,我提前道歉,但我正在寻求有关 UI 回归测试的最佳方法的建议。

提前谢谢你...

鲍勃

我会投票赞成使用量角器。您可以拥有包括控制状态测试的测试用例,因此在您提到的示例中,如果您有一个测试验证按钮何时应该启用而另一个测试何时禁用(或 displayed/not 显示),它将失败.

我花了一些时间来回答这个问题,因为我觉得这很重要,而且您客户的场景非常有效并且是实时发生的。我希望这会澄清一些关于网络 UI 测试和自动化的概念。

我假设您知道 DOM changes.It 的原因和方式主要是由于 javascript 函数或 ajax 快速发生的调用的变化我们试图定位 Web 元素的测试脚本可能无法在那个特定时间 window 捕获它们,从而导致著名的 Stale Element Exceptions。现在让我们关注一下这是如何在后台发生的 -

正如您在上面看到的 DOM 结构,每次创建 webdriver instance/session 时,都会存储 web 元素的引用,然后将其存储为 JSON ref 并传递给 selenium webdriver 和 Protractor正如我们在浏览器测试和自动化中看到的那样,它建立在 it.This 之上驱动浏览器。

当浏览器刷新、导航或重新加载时,DOM 树会被销毁并重新创建,因此对该 DOM 元素的所有引用都将无效。元素引用可能会在该特定时间范围内丢失或损坏,因此我们会得到陈旧的元素异常。

老实说,避免这些情况是不可能的,最糟糕的是它可能不会经常发生,那么我们如何应对这种烦人的情况呢?有一些安静的变通方法可以有效地捕获它们-

  • 在 catch 块中重新创建整个引用层次结构并递归调用相同的方法直到最大尝试次数或解除绑定直到出现另一个异常。
  • 将元素定位器作为字符串引用,而不是使用 WebElement 引用它们,因为字符串不会过时。

以上两种方法都在以下链接中进行了详细讨论,请仔细阅读它们,因为我不想将代码放在这里 post 只是为了简单理解概念。

http://darrellgrainger.blogspot.in/2012/06/staleelementexception.html http://www.assertselenium.com/java/what-is-staleelementexception-in-webdriver/ http://softtechlabs.com/2015/09/deal-with-staleelementreferenceexception/

我希望这能为您解决很多问题!