在Puppeteer/Playwright中如何通过label文本选中对应input元素

方案1：使用Playwright原生内置的getByLabel定位器（最推荐） #

Playwright核心库原生就提供了遵循可访问性规范的getByLabel方法，不需要引入任何第三方Testing Library相关包，专门用于通过关联label的可见文本定位对应的输入控件，自动匹配带for属性关联的label、或是嵌套在label内部的输入框，完全符合你要的「用用户可见文本定位」的需求：

await page.getByLabel('Name').fill('你要填入的内容')

方案2：通用XPath/分步定位写法（兼容Puppeteer等其他框架） #

如果你需要跨框架使用，或者偏好手动写选择器，可以先定位到目标label，再通过它的for属性关联到对应输入框：

单选择器XPath写法：

await page.fill('//input[@id=//label[normalize-space(.)="Name"]/@for]', '你要填入的内容')

分步写法（可读性更高，容错性更强）：

// 先获取对应label的for属性值
const inputId = await page.locator('label', { hasText: 'Name' }).getAttribute('for')
// 定位对应input并填充
await page.fill(`#${inputId}`, '你要填入的内容')

你之前写法报错的原因 #

直接使用'"Name"'作为文本选择器时，默认会匹配到第一个包含该文本的元素，也就是<label>本身，自然会触发「元素不是input」的报错。

内容的提问来源于stack exchange，提问作者CaribouCode