Playwright C# 如何正确等待输入框文本内容变为空状态

问题原因 #

你之前写的WaitForSelectorAsync("#Number >> text=")无法生效是因为：text=匹配规则仅检测DOM元素的innerText文本内容，而输入框的用户输入内容存储在value属性中，不属于元素文本节点，因此永远匹配不到空值状态。

推荐解决方案 #

Playwright 内置的断言工具默认带自动等待能力，会自动重试直到条件符合或超时，是最优实现方式：

// 需要先引入断言命名空间
using Microsoft.Playwright.Assertions;

// 执行add操作后添加如下等待逻辑
await Expect(page.Locator("#Number")).ToBeEmptyAsync();
await Expect(page.Locator("#Name")).ToBeEmptyAsync();

其他可选实现 #

如果不想使用断言工具，也可以选择如下两种写法实现同等效果：

• 基于属性选择器匹配空value

await page.WaitForSelectorAsync("#Number[value='']");
await page.WaitForSelectorAsync("#Name[value='']");

• 自定义JS条件等待

await page.Locator("#Number").WaitForAsync(new LocatorWaitForOptions
{
    State = WaitForSelectorState.Visible,
    WaitFor = "() => document.getElementById('Number').value === ''"
});
await page.Locator("#Name").WaitForAsync(new LocatorWaitForOptions
{
    State = WaitForSelectorState.Visible,
    WaitFor = "() => document.getElementById('Name').value === ''"
});

注意：如果是Vue、React等前端框架控制的输入框绑定值，优先使用断言的ToBeEmptyAsync方案，兼容框架异步更新逻辑，不会出现属性同步不及时的误判。

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