自动等待

简介

Playwright 在执行动作之前会对元素进行一系列可操作性检查,以确保这些操作按预期执行。它会自动等待所有相关检查通过,然后才会执行请求的操作。如果在给定的 timeout 内相关检查没有通过,操作会失败并抛出 TimeoutError

例如,对于 locator.click(),Playwright 会确保:

  • 定位符解析为准确的单一元素

  • 元素是【可见的】

  • 元素是【稳定的】,意味着它没有在动画中或动画完成

  • 元素能够【接收事件】,意味着它没有被其他元素遮挡

  • 元素是【启用的】

以下是每个操作所执行的完整可操作性检查列表:

操作 可见 稳定 接收事件 启用 可编辑

locator.check()

-

locator.click()

-

locator.dblclick()

-

locator.setChecked()

-

locator.tap()

-

locator.uncheck()

-

locator.hover()

-

-

locator.dragTo()

-

-

locator.screenshot()

-

-

-

locator.fill()

-

-

locator.clear()

-

-

locator.selectOption()

-

-

-

locator.selectText()

-

-

-

-

locator.scrollIntoViewIfNeeded()

-

-

-

-

locator.blur()

-

-

-

-

-

locator.dispatchEvent()

-

-

-

-

-

locator.focus()

-

-

-

-

-

locator.press()

-

-

-

-

-

locator.pressSequentially()

-

-

-

-

-

locator.setInputFiles()

-

-

-

-

-

强制执行操作

某些操作(如 locator.click())支持 force 参数,能够禁用非必要的可操作性检查。例如,传递一个真值的 force 参数给 locator.click() 方法,会跳过检查目标元素是否能接收点击事件。

断言

Playwright 包括自动重试的断言,可以通过等待直到条件满足,减少不稳定性,类似于操作之前的自动等待。

断言 描述

expect(locator).toBeAttached()

元素已附加

expect(locator).toBeChecked()

复选框已选中

expect(locator).toBeDisabled()

元素被禁用

expect(locator).toBeEditable()

元素可编辑

expect(locator).toBeEmpty()

容器为空

expect(locator).toBeEnabled()

元素启用

expect(locator).toBeFocused()

元素获得焦点

expect(locator).toBeHidden()

元素不可见

expect(locator).toBeInViewport()

元素与视口有交集

expect(locator).toBeVisible()

元素可见

expect(locator).toContainText()

元素包含指定文本

expect(locator).toHaveAttribute()

元素具有指定的 DOM 属性

expect(locator).toHaveClass()

元素具有指定的类属性

expect(locator).toHaveCount()

列表具有精确数量的子元素

expect(locator).toHaveCSS()

元素具有指定的 CSS 属性

expect(locator).toHaveId()

元素具有指定的 ID

expect(locator).toHaveJSProperty()

元素具有指定的 JavaScript 属性

expect(locator).toHaveText()

元素匹配指定的文本

expect(locator).toHaveValue()

输入框具有指定的值

expect(locator).toHaveValues()

选择框具有选中的选项

expect(page).toHaveTitle()

页面具有指定的标题

expect(page).toHaveURL()

页面具有指定的 URL

expect(response).toBeOK()

响应状态为 OK

更多内容请参阅 【断言指南】。

可见性

当元素具有非空的边界框,并且没有 visibility: hidden 的计算样式时,元素被认为是可见的。

根据这个定义:

  • 尺寸为零的元素不被认为是可见的。

  • display: none 的元素不被认为是可见的。

  • opacity: 0 的元素仍然被认为是可见的。

稳定性

当元素在至少两个连续的动画帧中保持相同的边界框时,元素被认为是稳定的。

启用状态

除非元素是 <button><select><input><textarea> 且具有 disabled 属性,否则元素被认为是启用的。

可编辑状态

元素在启用且没有设置 readonly 属性时,被认为是【可编辑的】。

接收事件

元素被认为正在接收指针事件,当它是操作点的命中目标。例如,当在 (10, 10) 点点击时,Playwright 会检查是否有其他元素(通常是一个遮罩层)捕获了该点击事件。

例如,考虑以下场景,Playwright 将会点击 "Sign Up" 按钮,无论何时调用 locator.click()

  • 页面检查用户名是否唯一,并禁用 "Sign Up" 按钮;

  • 在与服务器确认后,禁用的 "Sign Up" 按钮被替换为现在启用的按钮。