选择元素

选择器是表示页面上特定 DOM 元素的字符串。在编写浏览器级测试时，建议使用健壮的选择器，以避免在 DOM 结构发生变化时导致测试不稳定。

目前，浏览器模块支持标准的 CSS 和 XPath 选择器。

注意
目前不支持基于文本的选择器。将来版本将支持此功能。

推荐实践

您选择的选择器不应与任何行为或样式更改紧密耦合。如果您的应用程序经常更改，建议使用面向用户的属性或自定义数据属性，因为这些属性与元素没有紧密耦合。

选择器	备注
面向用户的属性（如 ARIA 标签）很少更改，因此它们是很好的选择。	✅ `page.locator('[aria-label="Login"]')`
自定义数据属性与元素没有紧密耦合。	✅ `page.locator('[data-test="login"]')`
文本选择器也很棒，因为文本内容很少更改。虽然我们目前尚不支持基于文本的选择器，但可以使用 xpath 作为变通方法。	✅ `page.locator('//button[text()="Submit"]')`
如果 ID 不变，也建议通过 ID 选择元素。	⚠️ `page.locator('#login-btn')`
应尽量减少通过类名选择元素，因为类名可能会重复。	⚠️ `page.locator('.login-btn')`
不建议使用通用元素，因为它没有上下文。	❌ `page.locator('button')`
不建议使用绝对路径，因为它们与 DOM 结构紧密耦合。	❌ `page.locator('/html[1]/body[1]/main[1]`