playwright-test：测试是否需要输入

Question

我有一个必需的登录表单输入：

<input
  autoComplete="email"
  defaultValue={email}
  disabled={state === 'submitting'}
  id="email"
  name="email"
  placeholder={t('user-authentication:email-placeholder')}
  required // HERE!
  type="email"
/>

如何测试 Playwright 是否需要输入？我在 Chromium 中的本机浏览器警告是：“请填写此字段。”

有没有办法在剧作家中检查/断言此警告？或者另一种方法来测试是否需要输入？

我尝试在输入中不写入任何内容，.fill('')然后按 Enter 键page.keyboard.press('Enter')，但这些并没有导致出现警告。

Answer 1

如果消息是由浏览器显示的，而不是添加到 DOM 中的内容，那么您将很难直接在 Playwright 中测试它。

您可以检查该required属性是否存在，并相信浏览器将显示警告。

await page.locator('input#email[required]')

您还可以应用约束验证

如果该元素是必需的并且该元素的值为空字符串，则该元素将遭受 valueMissing 的影响，并且该元素将与:invalid伪类匹配。

await page.locator('input#email[required]:invalid')