使用元素名称/id 为使用量角器测试 AngularJS 的元素答案

【问题标题】：Using element name/id for elements for Testing AngularJS using Protractor使用元素名称/id 为使用量角器测试 AngularJS 的元素
【发布时间】：2016-06-07 12:31:10
【问题描述】：

我们的团队从 Angular JS 开发开始，我们使用 Jasmine-Karma-Protractor 进行测试。争论是我们应该使用 ID 来访问 DOM 元素还是使用 XPATH/CSS/Binding 来访问元素，因为 Angular 并没有真正强制使用 ID。

这是一个最佳实践问题，我想知道社区推荐什么。请分享您的团队遵循的策略。

谢谢。

更新

在浏览了您所有的答案和 cmets 之后，我意识到没有特别正确或错误的方法可以做到这一点。（我个人倾向于使用 ID！）我们将开会讨论我们想要的方法并决定是否使用 ID。非常感谢大家的帮助。

【问题讨论】：

我怀疑这个问题的答案可能是基于意见的。
还有一个部分相关的线程：stackoverflow.com/questions/37492803/….

标签： angularjs selenium testing protractor

【解决方案1】：

当然，您应该使用 ID。这将使您的测试更容易编写和阅读，更快，最重要的是，更健壮：每次页面上的标记因任何原因（样式、新布局等）发生更改时，测试都不必更改。

说“找到菜单项'客户'”比说“找到页面的第二个div 中包含的第三个ul 中包含的第4 个li”要清楚得多。

【讨论】：

有时 ID 不固定，并非所有元素都可以在提供的代码中具有 id 进行测试。
@Emna 那又怎样？这并不意味着您永远不应该使用 ID。在有意义时使用静态 ID。在有意义时使用动态 ID。在有意义时使用语义 CSS 类。

【解决方案2】：

由于我在 Protractor 上工作了 2 年，并且从头开始设计了良好的 POM 测试框架，我可以建议您按照以下顺序为 Angularjs 应用程序：

订单：

by.model()

通过.repeater()

by.css()

by.id()

by.name()

by.xpath() - 最不偏好

【讨论】：

【解决方案3】：

我还可以在现有答案中再添加 2 个选项。：

by.className();
by.tagName();
by.cssSelector();

如果您的 html 代码中没有修复 ID！

【讨论】：