HTML注释系统，以帮助Web UI测试自动化元素/属性引用？

Question

是否有一个用于注释HTML的系统，用于识别对Web用户界面测试自动化至关重要的元素/属性（由Selenium，HTMLUnit，Watir，Sahi等）？ 系统可能是标准或库。 例如，注释可以实现为HTML数据属性，其仅引用属性名称，XPath表达式或CSS选择器，其需要存在并且为了测试自动化目的而保持一致。 如果识别出的属性/元素发生变化，则测试自动化可能会中断，因此开发人员不应在不与负责自动化的人协调的情 因此，注释至少是开发人员的视觉提示。

但除此之外，系统中的“强制执行器”部分（持续集成插件，CLI或同一页面上的JavaScript库）可能会在某种程度上强制执行注释，如果不满足某些条件，则会快速而明确地失败。 也许标识的属性/ XPath / selector必须存在并引用定义注释的相同元素。 执行者还可以收集所有注释，并可能在Web应用程序的每个页面上报告它们的完整列表，以进行差异通知。

我可能有一些细节没有很好的解决，但希望我正在寻找的要点是有道理的。 免费许可证会很方便但不是绝对必要的。

这样的事情存在吗？

一个有用的答案也可能是：

• 有一种更好的方法来解决您的潜在需求（有解释）。
• 我们尝试实现这个并不值得; 这就是原因。

动机： Web用户界面测试可能对HTML元素和属性的更改敏感。 测试通常在集成测试工作或阶段中运行，这可能明显晚于构建或单元测试。 在构建或单元测试阶段更早地捕获UI元素和测试期望之间的一些潜在不匹配将是很好的，并且还为测试自动化工程师提供更多信息以指示测试中的错误可能与被测产品中的错误。

Answer 1

正如你所说：

例如，注释可以实现为HTML数据属性

这就是人们使用HTML5的方式，因为它使我们能够将控制权交给我们的QA自动化团队，并让开发团队忽略他们的顾虑（更改元素上的ID会影响他们的测试）。

因此，HTML元素可能看起来像（一个相对人为的例子）：

<div id="button" data-test-attribute="submit"></div>

这些库使用的大多数选择器都使用面向CSS的选择，选择上面的选择。 有许多文章已经开始解决这个问题。

一个非常简短的我喜欢的状态：

ID和css类名称的用途不同于UI自动化测试中的用法。 Css类主要用于样式元素，它们也可以在生产页面上进行修改。 ID也有另一个目的，有时也可能只是更改或者它们没有实现，因为它们会干扰页面上的其他功能。

看来您的问题的另一部分是关于执法 。 使用像Node.js和webpack这样的手工旋转的东西，可以相对简单地集成到你的构建过程中（可能会大大增加你的构建时间 - 但肯定是可能的）。