Playwright 如何检查元素的值
输入框值用 expect(locator).toHaveValue()（支持正则）；多选 select 用 toHaveValues()；非表单元素的文本用 toHaveText()。区分 value 与 textContent 是关键。
一句话回答：表单元素（input/textarea/select）的值用 await expect(locator).toHaveValue('期望值')——Playwright 1.20+ 内置，自动等待重试。普通元素的文本内容用 toHaveText()，属性用 toHaveAttribute()。分清"值（value）、文本（text）、属性（attribute）"三者就不会选错。
输入框的值
// 精确匹配
await expect(page.locator('#name-input')).toHaveValue('张三');
// 正则匹配
await expect(page.locator('#name-input')).toHaveValue(/\S+/); // 非空白，兼容中文
// 空值校验
await expect(page.locator('#name-input')).toHaveValue('');
多选 select 的值
await page.locator('#fruits').selectOption(['apple', 'banana']);
await expect(page.locator('#fruits')).toHaveValues(['apple', 'banana']);
取到代码里用（非断言）
const value = await page.locator('#name-input').inputValue(); // 表单元素的值
const text = await page.locator('.title').textContent(); // 元素的文本
inputValue() 只对表单元素有效；textContent() 返回原始文本（含隐藏部分），要"用户可见文本"用 innerText()。
inputValue() 读取当前 DOM value；getAttribute('value') 读取当前属性值，不一定随用户输入改变。多选 select 用 toHaveValues()；读取时可评估 selectedOptions。以下片段默认在已配置的 Playwright Test 项目中，导入 test/expect 并先导航到自己的测试页面。
三者区别
| 目标 | 断言 | 取值方法 |
|---|---|---|
| input/select 的 value | toHaveValue() |
inputValue() |
| 文本（默认 textContent） | toHaveText()；可见文本语义加 { useInnerText: true } |
innerText() |
| HTML 属性（href/class/data-*） | toHaveAttribute() |
getAttribute() |
常见问题（FAQ）
Q：toHaveValue 对 div/span 报错？
A：value 是表单元素的概念。div 的"值"是文本，用 toHaveText()。
Q：值为空但断言通过了？
A：input 的可见输入值不是子文本，toHaveText('') 不能校验输入值。用 toHaveValue('')；普通文本的字符串断言会归一化空白，正则断言则按其匹配语义处理。
Q：富文本编辑器（contenteditable）怎么校验？
A：contenteditable 不是表单元素，inputValue() 不适用。用 toHaveText()/textContent() 校验内容；复杂组件（如富文本库）看其是否暴露了隐藏的 textarea。
参考资料
本文依据官方资料核对，未进行现场运行测试；代码与配置示例需结合实际版本、权限和环境验证。
