1.简介
在我们日常工作中进行UI自动化测试时，保证测试的稳定性至关重要。其中一个关键方面是正确地定位和操作网页中的元素。在网页中，元素可能处于不同的状态，有些可能在页面加载完成之前不在DOM中，需要某些操作后才会出现，而其他元素可能一直存在于DOM中，但最初处于隐藏状态，需要通过操作才能使其出现进而处于可见状态。 因此如果在执行脚本时没有考虑到元素的状态，很可能导致脚本执行失败。为了保证自动化测试的稳定性，我们需要确保在执行操作之前，所需的元素已经达到了指定状态。
下面宏哥将介绍和分析讲解三种常用的元素等待方式：wait_for_timeout()，wait_for()，wait_for_selector() 和 wait_for_element_state()以及四者之间的优劣势。
2.强制等待
2.1wait_for_timeout()
wait_for_timeout() 方法会等待调用方法时指定的时间。
这个方法用于设置一个等待的超时时间，它允许程序在执行某些操作前等待指定的时间。如果在设定的时间内操作未完成，则可能会抛出超时错误。这种机制在编程中非常有用，尤其是在需要等待某个条件满足或资源可用时。例如，在使用playwright进行网页自动化测试时，wait_for_timeout()方法可以用来确保在继续执行操作之前，网页元素已经加载完成或处于可操作状态。如果元素未在给定的时间内加载完成，则可以通过捕获超时错误来处理这种情况，从而避免操作失败。官方定义的函数如下：
def wait_for_timeout(self, timeout: float) -> None:
"""Page.wait_for_timeout
Waits for the given `timeout` in milliseconds.
Note that `page.waitForTimeout()` should only be used for debugging. Tests using the timer in production are going
to be flaky. Use signals such as network events, selectors becoming visible and others instead.
**Usage**
```py
# wait for 1 second
await page.wait_for_timeout(1000)
```
```py
# wait for 1 second
page.wait_for_timeout(1000)
```
Parameters
----------
timeout : float
A timeout to wait for
"""
return mapping.from_maybe_impl(
self._sync(self._impl_obj.wait_for_timeout(timeout=timeout))
)
3.自动等待
3.1.wait_for()
wait_for() 是先定位元素，再等待元素满足指定状态。先定位元素，再使用wait_for() 方法也可以等待元素到达指定的状态。
如果元素已满足条件，则立即返回。否则，它会等待直到超时时间到达为止。
该方法接受两个关键字参数：
timeout：指定最大等待时间（以毫秒为单位）。默认为 30000（30秒），但可以更改。
state：指定要等待的状态。默认为 ‘visible’。可以是 ‘attached’、‘detached’、‘hidden’ 或 ‘visible’ 中的一个。
官方定义的函数如下：
def wait_for(
self,
*,
timeout: typing.Optional[float] = None,
state: typing.Optional[
Literal["attached", "detached", "hidden", "visible"]
] = None
) -> None:
"""Locator.wait_for
Returns when element specified by locator satisfies the `state` option.
If target element already satisfies the condition, the method returns immediately. Otherwise, waits for up to
`timeout` milliseconds until the condition is met.
**Usage**
```py
order_sent = page.locator(\"#order-sent\")
await order_sent.wait_for()
```
```py
order_sent = page.locator(\"#order-sent\")
order_sent.wait_for()
```
Parameters
----------
timeout : Union[float, None]
Maximum time in milliseconds. Defaults to `30000` (30 seconds). Pass `0` to disable timeout. The default value can
be changed by using the `browser_context.set_default_timeout()` or `page.set_default_timeout()` methods.
state : Union["attached", "detached", "hidden", "visible", None]
Defaults to `'visible'`. Can be either:
- `'attached'` - wait for element to be present in DOM.
- `'detached'` - wait for element to not be present in DOM.
- `'visible'` - wait for element to have non-empty bounding box and no `visibility:hidden`. Note that element
without any content or with `display:none` has an empty bounding box and is not considered visible.
- `'hidden'` - wait for element to be either detached from DOM, or have an empty bounding box or
`visibility:hidden`. This is opposite to the `'visible'` option.
"""
return mapping.from_maybe_impl(
self._sync(self._impl_obj.wait_for(timeout=timeout, state=state))
)
宏哥还是按之前toast的消息那个demo来演示，这里就不写demo的HTML代码，不知道的可以看宏哥之前的文章：传送门
3.1.1代码设计
3.1.2参考代码
# coding=utf-8 标签：playwright,timeout,selector,state,66,移除,小成,page,wait From： https://www.cnblogs.com/du-hong/p/18303190