如何在UI自动化测试中创建稳定的定位器？

前言

• 在自动化测试中，创建稳定的定位器至关重要。脆弱的定位器经常导致测试失败，增加了维护难度，并可能引起不必要的错误；
• 为了确保自动化测试的稳定性和可维护性，测试人员需要避免一些常见的陷阱，并根据最佳实践设计更为可靠的定位器；
• 本文将探索如何通过一些策略，帮助你避免这些问题，并选择高效、稳定的定位器，从而提升测试的稳定性。

1. 避免使用绝对路径

在XPath或CSS选择器中，使用绝对路径定位元素是很常见的做法，然而，这种方法的稳定性较差。当页面布局发生变化时，绝对路径会频繁失效。这是因为它们依赖于元素的精确层级关系，一旦元素的层级发生调整，定位器就会失效。相反，使用相对路径能带来更多的好处：

• 保持稳定性：即使页面结构略有变化，相对定位器仍然有效，因为它们不依赖于元素的精确层级。
• 易于阅读和维护：如果页面上的元素发生位置变化，相对定位器不会受到影响。

示例：

不推荐的定位器：

XPath：/html/body/div[1]/div[2]/button
CSS：html > body > div:nth-child(2) > button

推荐的定位器：

XPath：//button[@data-qa='submit-button']
CSS：button[data-qa='submit-button']

2. 避免在定位器中使用索引

在XPath或CSS选择器中使用索引进行定位，容易导致测试的不稳定性。因为当页面上的元素被添加或删除时，索引位置会发生变化，导致定位器失效。此外，使用索引的定位器难以理解和调试，特别是在页面元素较多的情况下。

示例：

不推荐的定位器：

XPath：//div[2]/div[5]
CSS：div:nth-child(7)

推荐的定位器：

XPath：//div[contains(@class, 'input-large')]
CSS：div[class*="input-large"]

3. 避免多个类名的定位器

CSS类名经常变化，尤其是在响应式设计、框架更新和代码重构过程中。因此，依赖多个类名作为定位器的元素会增加维护难度。为了减少这种风险，可以优先选择使用单一、稳定的类名，或者更可靠的属性进行定位。

示例：

不推荐的定位器：

XPath：//div[@class='col-xs-1 col-sm-7 col-md-5 itemx ng-scope input-large']
CSS：div.col-xs-1.col-sm-7.col-md-5.itemx.ng-scope.input-large

推荐的定位器：

XPath：//div[contains(@class, 'input-large')]
CSS：div[class*="input-large"]

4. 避免动态和自动生成的ID

对于复杂或基于组件的应用程序，框架会为元素生成动态 ID。这些ID在每次页面加载、会话或组件顺序发生变化时都会改变，这使得自动化测试中很难通过ID来准确定位元素。如果可能的话，最好使用专门为测试设计的自定义属性，或者选择有意义且唯一的属性进行定位。

示例：

不推荐的定位器：

XPath：//button[@class='btn-primary-1850']
CSS：button.btn-primary-1850

推荐的定位器：

XPath：//button[@data-qa='submit-button']
CSS：button[data-qa="submit-button"]

5. 确保定位器唯一

非唯一的定位器会匹配页面上的多个元素，这可能导致测试失败。因为自动化脚本可能会选中错误的元素，或者与隐藏的或禁用的元素交互。确保每个定位器唯一，能精确地标识页面上的一个元素。

解决策略：

• 使用父子关系定位：通过元素之间的层级关系来定义元素。例如，在两个表单中，你可以通过表单ID来定位特定的输入框。

<!-- 第一个表单 -->
<form id="login-form">
    <input type="email" id="email" />
    <input type="password" id="password" />
    <button id="submit-button">登录</button>
</form>

<!-- 第二个表单 -->
<form id="signup-form">
    <input type="email" id="email" />
    <input type="password" id="password" />
    <button id="submit-button">注册</button>
</form>

通过定位父级元素，如//form[@id='login-form']//input[@id='email']，可以确保定位的是正确的元素。

6. 处理隐藏元素的策略

在自动化测试中，隐藏元素可能会干扰定位器的正确性。以下是一些处理隐藏元素的策略：

1. 检查元素属性：检查元素的aria-hidden属性、display属性等，判断其是否隐藏。
2. 创建基于可见性的定位器：利用唯一属性来选择可见元素。

<button class="submit-button hidden" data-qa="submit-button">提交</button>
<button class="submit-button" data-qa="submit-button">提交</button>

CSS选择器：
button.submit-button:not(.hidden)
这种方式可以确保只选择可见的按钮。

7. 谨慎使用基于文本的定位器

基于文本的定位器，如button[text()='提交']，可以在页面文本内容发生变化时变得不稳定。原因可能有很多，包括内容更新、页面本地化、多语言支持等。因此，文本内容的定位器应该谨慎使用。

解决方案：

可以考虑使用预加载的测试数据策略，提前知道页面上将出现哪些文本内容，从而创建可靠的定位器。

8. 使用AI创建稳定的定位器

AI技术已经被引入到自动化测试中，用来生成更加稳定和可靠的定位器。通过训练模型来自动识别页面元素和生成有效的定位器，AI能够帮助我们避免手动选择错误的元素，并提高定位器的稳定性。
示例：

总结

在自动化测试中，创建稳定、唯一且可靠的定位器就像在复杂的城市中寻找最合适的路线。通过准确使用定位器，我们能够确保测试脚本能够稳定运行，让测试脚本将变得更加可靠、易于维护，并且能够适应页面的变化。