Locator
定位器(Locator)是 Playwright 自动等待和重试能力的核心部分。简而言之,定位器代表了一种在任何时刻都能在页面上查找元素的方法。可以通过 page.locator() 方法创建定位器。
方法
all
添加于: v1.29当定位器指向一组元素时,此方法返回一个定位器数组,分别指向各个元素。
:::注意
locator.all() 不会等待元素匹配定位器,而是立即返回页面中当前存在的任何元素。
当元素列表动态变化时,locator.all() 会产生不可预测且不稳定的结果。
当元素列表稳定但动态加载时,请等待完整列表加载完成后再调用 locator.all()。 :::
用法
for (const li of await page.getByRole('listitem').all())
await li.click();
返回值
allInnerTexts
Added in: v1.14返回所有匹配节点的 node.innerText
值数组。
如果需要对页面文本进行断言,推荐使用 expect(locator).toHaveText() 并配合 useInnerText 选项以避免不稳定性。更多细节请参阅断言指南。
用法
const texts = await page.getByRole('link').allInnerTexts();
返回值
allTextContents
Added in: v1.14返回所有匹配节点的 node.textContent
值数组。
如果需要对页面文本进行断言,推荐使用 expect(locator).toHaveText() 以避免不稳定性。更多细节请参阅断言指南。
用法
const texts = await page.getByRole('link').allTextContents();
返回值
and
添加于: v1.34创建一个匹配当前定位器和参数定位器的组合定位器。
用法
以下示例查找具有特定标题的按钮:
const button = page.getByRole('button').and(page.getByTitle('Subscribe'));
参数
返回值
ariaSnapshot
添加于: v1.49捕获给定元素的 ARIA 快照。了解更多关于 ARIA 快照 和对应断言方法 expect(locator).toMatchAriaSnapshot() 的信息。
用法
await page.getByRole('link').ariaSnapshot();
参数
options
Object (可选)-
最大等待时间(毫秒)。默认为
0
- 无超时限制。默认值可以通过配置中的actionTimeout
选项修改,或使用 browserContext.setDefaultTimeout() 和 page.setDefaultTimeout() 方法调整。
-
返回值
详细说明
此方法捕获给定元素的 ARIA 快照。快照是一个字符串,表示元素及其子元素的状态。该快照可用于测试中断言元素状态,或与未来的状态进行比较。
ARIA 快照使用 YAML 标记语言表示:
- 对象的键是元素的角色和可选的访问名称
- 值可以是文本内容或子元素数组
- 通用静态文本可以用
text
键表示
以下是 HTML 标记和对应的 ARIA 快照示例:
<ul aria-label="Links">
<li><a href="/">Home</a></li>
<li><a href="/about">About</a></li>
<ul>
- list "Links":
- listitem:
- link "Home"
- listitem:
- link "About"
blur
添加于: v1.28在元素上调用 blur 方法。
用法
await locator.blur();
await locator.blur(options);
参数
options
Object (可选)-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置文件中的actionTimeout
选项修改,或者使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法修改。
-
返回值
boundingBox
添加于: v1.14此方法返回与定位器匹配的元素的边界框,如果元素不可见则返回 null
。边界框是相对于主框架视口计算的 - 通常与浏览器窗口相同。
用法
const box = await page.getByRole('button').boundingBox();
await page.mouse.click(box.x + box.width / 2, box.y + box.height / 2);
参数
options
Object (可选)-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置中的actionTimeout
选项修改,或使用 browserContext.setDefaultTimeout() 和 page.setDefaultTimeout() 方法修改。
-
返回值
详细说明
滚动会影响返回的边界框,类似于 Element.getBoundingClientRect。这意味着 x
和/或 y
可能为负值。
来自子框架的元素返回相对于主框架的边界框,这与 Element.getBoundingClientRect 不同。
假设页面是静态的,使用边界框坐标执行输入操作是安全的。例如,以下代码片段应该会点击元素的中心位置。
check
新增于: v1.14确保复选框或单选按钮元素被选中。
用法
await page.getByRole('checkbox').check();
参数
options
Object (可选)-
是否跳过可操作性检查。默认为
false
。 -
已弃用
此选项无效。
此选项无效。
-
相对于元素内边距(padding)框左上角的坐标点。如果未指定,则使用元素的某个可见点。
-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置中的actionTimeout
选项修改,或者使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法。 -
当设置时,此方法仅执行可操作性检查而不执行操作。默认为
false
。适用于等待元素准备好执行操作但不需要实际执行的情况。
-
返回值
详细说明
执行以下步骤:
- 确保元素是复选框或单选输入框。如果不是,此方法会抛出错误。如果元素已被选中,此方法立即返回。
- 等待元素的可操作性检查,除非设置了 force 选项。
- 如果需要,将元素滚动到视图中。
- 使用 page.mouse 点击元素的中心点。
- 确保元素现在已被选中。如果没有,此方法会抛出错误。
如果在操作过程中元素从 DOM 中分离,此方法会抛出错误。
当所有步骤在指定的超时时间内未完成时,此方法会抛出 TimeoutError。传递零超时时间会禁用此功能。
clear
添加于: v1.28清空输入框内容。
用法
await page.getByRole('textbox').clear();
参数
options
Object (可选)-
是否绕过可操作性检查。默认为
false
。 -
已弃用
此选项无效。
此选项无效。
-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置中的actionTimeout
选项修改,或者使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法设置。
-
返回
详细说明
该方法会等待可操作性检查,聚焦元素,清空内容并在清空后触发 input
事件。
如果目标元素不是 <input>
、<textarea>
或 [contenteditable]
元素,该方法会抛出错误。但是,如果元素位于具有关联控件的 <label>
元素内,则会清空该控件。
click
添加于: v1.14点击一个元素。
用法
点击按钮:
await page.getByRole('button').click();
在画布特定位置按住Shift键右键点击:
await page.locator('canvas').click({
button: 'right',
modifiers: ['Shift'],
position: { x: 23, y: 32 },
});
参数
options
Object (可选)-
button
"left" | "right" | "middle" (可选)#默认为
left
。 -
默认为1。参见 UIEvent.detail。
-
mousedown
和mouseup
之间的等待时间(毫秒)。默认为0。 -
是否绕过可操作性检查。默认为
false
。 -
modifiers
Array<"Alt" | "Control" | "ControlOrMeta" | "Meta" | "Shift"> (可选)#需要按下的修饰键。确保操作期间只按下这些修饰键,之后恢复当前修饰键状态。如果未指定,则使用当前按下的修饰键。"ControlOrMeta"在Windows和Linux上解析为"Control",在macOS上解析为"Meta"。
-
已弃用
未来版本将默认设为
true
。触发导航的操作会等待导航完成和页面开始加载。通过设置此标志可以跳过等待。仅在特殊情况下需要此选项,例如导航到不可访问的页面。默认为
false
。 -
相对于元素内边距(padding)框左上角的点击位置。如果未指定,则使用元素的某个可见点。
-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置中的actionTimeout
选项修改,或使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法。 -
设置时,此方法仅执行可操作性检查而不执行实际点击。默认为
false
。可用于等待元素准备好执行操作而不实际执行。注意键盘modifiers
仍会被按下(不论trial
设置),以测试仅在按下这些键时才可见的元素。
-
返回
详细说明
此方法通过以下步骤点击元素:
- 等待元素的可操作性检查,除非设置了 force 选项。
- 如果需要,将元素滚动到视图中。
- 使用 page.mouse 点击元素中心或指定的 position。
- 等待触发的导航成功或失败,除非设置了 noWaitAfter 选项。
如果在操作过程中元素从DOM中分离,此方法会抛出错误。
当所有步骤在指定的 timeout 内未完成时,此方法会抛出 TimeoutError。设置超时为0则禁用此功能。
contentFrame
Added in: v1.43返回一个指向相同 iframe
的 FrameLocator 对象。
当你从某处获取了一个 Locator 对象后,若需要与该框架内的内容进行交互,此方法非常有用。
如需反向操作,请使用 frameLocator.owner()。
用法
const locator = page.locator('iframe[name="embedded"]');
// ...
const frameLocator = locator.contentFrame();
await frameLocator.getByRole('button').click();
返回值
count
Added in: v1.14返回匹配定位器的元素数量。
如需断言页面上的元素数量,推荐使用 expect(locator).toHaveCount() 以避免不稳定性。详见 断言指南。
用法
const count = await page.getByRole('listitem').count();
返回值
dblclick
添加于: v1.14双击元素。
用法
await locator.dblclick();
await locator.dblclick(options);
参数
options
Object (可选)-
button
"left" | "right" | "middle" (可选)#默认为
left
。 -
mousedown
和mouseup
之间的等待时间(毫秒)。默认为 0。 -
是否绕过可操作性检查。默认为
false
。 -
modifiers
Array<"Alt" | "Control" | "ControlOrMeta" | "Meta" | "Shift"> (可选)#需要按下的修饰键。确保操作期间只按下这些修饰键,之后恢复当前修饰键状态。如果未指定,则使用当前按下的修饰键。"ControlOrMeta" 在 Windows 和 Linux 上解析为 "Control",在 macOS 上解析为 "Meta"。
-
已弃用
此选项无效。
此选项无效。
-
相对于元素内边距(padding)框左上角的点击位置。如果未指定,则使用元素的某个可见点。
-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置中的actionTimeout
选项修改,或者使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法设置。 -
当设置此选项时,该方法仅执行可操作性检查而不执行实际点击操作。默认为
false
。可用于等待元素准备好执行操作而不实际执行。注意键盘modifiers
仍会被按下(即使trial
为 true),以便测试那些仅在按下修饰键时才可见的元素。
-
返回
详细说明
该方法通过以下步骤双击元素:
- 等待元素的可操作性检查,除非设置了 force 选项。
- 如果需要,将元素滚动到视图中。
- 使用 page.mouse 在元素中心或指定的 position 位置双击。
如果在操作过程中元素从 DOM 中分离,该方法会抛出错误。
如果所有步骤在指定的 timeout 内未完成,该方法会抛出 TimeoutError。设置超时为 0 则禁用此功能。
:::注意
element.dblclick()
会触发两次 click
事件和一次 dblclick
事件。
:::
dispatchEvent
添加于: v1.14以编程方式在匹配元素上触发事件。
用法
await locator.dispatchEvent('click');
参数
-
DOM 事件类型:如
"click"
、"dragstart"
等。 -
eventInit
EvaluationArgument (可选)#可选的事件特定初始化属性。
-
options
Object (可选)-
最大等待时间(毫秒)。默认为
0
(无超时)。默认值可以通过配置中的actionTimeout
选项修改,或使用 browserContext.setDefaultTimeout() 和 page.setDefaultTimeout() 方法。
-
返回值
详细说明
上面的代码片段会在元素上触发 click
事件。无论元素的可见状态如何,都会触发 click
事件。这相当于调用 element.click()。
在底层,它会根据给定的 type 创建一个事件实例,使用 eventInit 属性初始化该事件,并在元素上触发它。默认情况下,事件是 composed
(可组合的)、cancelable
(可取消的)且会冒泡。
由于 eventInit 是事件特定的,请参考以下事件文档以获取初始化属性列表:
- DeviceMotionEvent
- DeviceOrientationEvent
- DragEvent
- Event
- FocusEvent
- KeyboardEvent
- MouseEvent
- PointerEvent
- TouchEvent
- WheelEvent
如果需要将动态对象传递到事件中,也可以将 JSHandle 指定为属性值:
const dataTransfer = await page.evaluateHandle(() => new DataTransfer());
await locator.dispatchEvent('dragstart', { dataTransfer });
dragTo
添加于: v1.18将源元素拖拽至目标元素并释放。
用法
const source = page.locator('#source');
const target = page.locator('#target');
await source.dragTo(target);
// 或者指定相对于元素左上角的精确位置:
await source.dragTo(target, {
sourcePosition: { x: 34, y: 7 },
targetPosition: { x: 10, y: 20 },
});
参数
-
要拖拽至的目标元素定位器。
-
options
Object (可选)-
是否绕过可操作性检查。默认为
false
。 -
已弃用
此选项无效。
此选项无效。
-
在源元素的此位置(相对于元素内边距框的左上角)进行点击。如未指定,则使用元素的某个可见点。
-
在目标元素的此位置(相对于元素内边距框的左上角)释放。如未指定,则使用元素的某个可见点。
-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可通过配置中的actionTimeout
选项修改,或使用 browserContext.setDefaultTimeout() 和 page.setDefaultTimeout() 方法设置。 -
当设置为 true 时,此方法仅执行可操作性检查并跳过实际操作。默认为
false
。适用于等待元素准备好执行操作而不实际执行的情况。
-
返回值
详细说明
此方法将定位器拖拽至另一个目标定位器或目标位置。它会先移动到源元素,执行 mousedown
,然后移动到目标元素或位置并执行 mouseup
。
evaluate
添加于: v1.14在页面中执行 JavaScript 代码,将匹配的元素作为参数传入。
用法
向 pageFunction 传递参数:
const result = await page.getByTestId('myId').evaluate((element, [x, y]) => {
return element.textContent + ' ' + x * y;
}, [7, 8]);
console.log(result); // 输出 "myId text 56"
参数
-
pageFunction
function | string#需要在页面上下文中执行的函数。
-
arg
EvaluationArgument (可选)#传递给 pageFunction 的可选参数。
-
options
Object (可选)
返回值
详细说明
返回 pageFunction 的返回值,该函数以匹配元素作为第一个参数,arg 作为第二个参数调用。
如果 pageFunction 返回一个 Promise,该方法会等待 Promise 解析并返回其值。
如果 pageFunction 抛出异常或被拒绝,该方法会抛出异常。
evaluateAll
添加于: v1.14在页面中执行 JavaScript 代码,将所有匹配的元素作为参数传入。
用法
const locator = page.locator('div');
const moreThanTen = await locator.evaluateAll((divs, min) => divs.length > min, 10);
参数
-
pageFunction
function | string#需要在页面上下文中执行的函数。
-
arg
EvaluationArgument (可选)#传递给 pageFunction 的可选参数。
返回值
详细说明
返回 pageFunction 的返回值,该函数以所有匹配元素的数组作为第一个参数,arg 作为第二个参数调用。
如果 pageFunction 返回一个 Promise,该方法将等待 Promise 解析并返回其值。
如果 pageFunction 抛出异常或被拒绝,该方法会抛出错误。
evaluateHandle
添加于: v1.14在页面中执行 JavaScript 代码,将匹配的元素作为参数传入,并返回包含结果的 JSHandle。
用法
await locator.evaluateHandle(pageFunction);
await locator.evaluateHandle(pageFunction, arg, options);
参数
-
pageFunction
function | string#需要在页面上下文中执行的函数。
-
arg
EvaluationArgument (可选)#传递给 pageFunction 的可选参数。
-
options
Object (可选)
返回值
详细说明
将匹配的元素作为第一个参数,arg 作为第二个参数调用 pageFunction,并返回其返回值作为 JSHandle。
locator.evaluate() 和 locator.evaluateHandle() 的唯一区别在于 locator.evaluateHandle() 返回的是 JSHandle。
如果 pageFunction 返回一个 Promise,该方法会等待 Promise 解析并返回其值。
如果 pageFunction 抛出异常或被拒绝,该方法会抛出异常。
更多详情请参阅 page.evaluateHandle()。
fill
添加于: v1.14向输入字段设置值。
用法
await page.getByRole('textbox').fill('example value');
参数
-
要为
<input>
、<textarea>
或[contenteditable]
元素设置的值。 -
options
Object (可选)-
是否跳过可操作性检查。默认为
false
。 -
已弃用
此选项无效。
此选项无效。
-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置中的actionTimeout
选项修改,或者使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法设置。
-
返回值
详细说明
该方法会等待可操作性检查,聚焦元素,填充值并在填充后触发 input
事件。注意可以传递空字符串来清空输入字段。
如果目标元素不是 <input>
、<textarea>
或 [contenteditable]
元素,此方法会抛出错误。但如果元素位于具有关联控件的 <label>
元素内,则会填充该控件。
要发送细粒度的键盘事件,请使用 locator.pressSequentially()。
filter
v1.22 版本新增此方法根据选项缩小现有定位器的范围,例如通过文本过滤。可以链式调用进行多次过滤。
用法
const rowLocator = page.locator('tr');
// ...
await rowLocator
.filter({ hasText: 'text in column 1' })
.filter({ has: page.getByRole('button', { name: 'column 2 button' }) })
.screenshot();
参数
options
Object (可选)-
将方法结果缩小到包含匹配此相对定位器的元素。例如,
article
包含text=Playwright
会匹配<article><div>Playwright</div></article>
。内部定位器必须相对于外部定位器,并且从外部定位器匹配处开始查询,而不是文档根节点。例如,可以在
<article><content><div>Playwright</div></content></article>
中找到包含div
的content
。但是查找包含article div
的content
会失败,因为内部定位器必须是相对的,不应使用content
外部的元素。注意外部和内部定位器必须属于同一 frame。内部定位器不能包含 FrameLocator。
-
hasNot
Locator (可选) v1.33 版本新增#匹配不包含内部定位器元素的元素。内部定位器相对于外部定位器查询。例如,
article
不包含div
会匹配<article><span>Playwright</span></article>
。注意外部和内部定位器必须属于同一 frame。内部定位器不能包含 FrameLocator。
-
hasNotText
string | RegExp (可选) v1.33 版本新增#匹配不包含指定文本的元素(可能在子元素或后代元素中)。传入 string 时匹配不区分大小写并搜索子字符串。
-
匹配包含指定文本的元素(可能在子元素或后代元素中)。传入 string 时匹配不区分大小写并搜索子字符串。例如,
"Playwright"
会匹配<article><div>Playwright</div></article>
。 -
visible
boolean (可选) v1.51 版本新增#仅匹配可见或不可见的元素。
-
返回
first
Added in: v1.14返回定位器匹配的第一个元素。
用法
locator.first();
返回值
focus
Added in: v1.14在匹配元素上调用 focus 方法。
用法
await locator.focus();
await locator.focus(options);
参数
options
Object (可选)-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置文件中的actionTimeout
选项修改,或者使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法修改。
-
返回值
frameLocator
发布于: v1.17在处理 iframe 时,您可以创建一个 frame locator 来进入该 iframe 并定位其中的元素:
用法
const locator = page.frameLocator('iframe').getByText('Submit');
await locator.click();
参数
返回值
getAttribute
v1.14 版本新增返回匹配元素的属性值。
如果需要断言元素的属性,建议使用 expect(locator).toHaveAttribute() 以避免不稳定性。更多细节请参阅 断言指南。
用法
await locator.getAttribute(name);
await locator.getAttribute(name, options);
参数
-
要获取值的属性名称。
-
options
Object (可选)-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置中的actionTimeout
选项修改,或者使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法设置。
-
返回值
getByAltText
添加于: v1.27允许通过元素的 alt 文本定位元素。
用法
例如,这个方法会通过 alt 文本 "Playwright logo" 找到图片:
<img alt='Playwright logo'>
await page.getByAltText('Playwright logo').click();
参数
-
用于定位元素的文本。
-
options
Object (可选)
返回
getByLabel
新增于: v1.27允许通过关联的 <label>
元素文本、aria-labelledby
元素或 aria-label
属性来定位输入元素。
用法
例如,该方法可以在以下 DOM 结构中通过标签 "Username" 和 "Password" 找到输入框:
<input aria-label="Username">
<label for="password-input">Password:</label>
<input id="password-input">
await page.getByLabel('Username').fill('john');
await page.getByLabel('Password').fill('secret');
参数
-
用于定位元素的文本
-
options
Object (可选)
返回值
getByPlaceholder
添加于: v1.27允许通过占位符文本定位输入元素。
用法
例如,考虑以下 DOM 结构:
<input type="email" placeholder="name@example.com" />
您可以通过占位符文本定位输入框并填写内容:
await page
.getByPlaceholder('name@example.com')
.fill('playwright@microsoft.com');
参数
-
用于定位元素的文本。
-
options
Object (可选)
返回
getByRole
添加于: v1.27允许通过元素的 ARIA 角色、ARIA 属性 和 可访问名称 来定位元素。
用法
考虑以下 DOM 结构:
<h3>Sign up</h3>
<label>
<input type="checkbox" /> Subscribe
</label>
<br/>
<button>Submit</button>
您可以通过元素的隐式角色来定位每个元素:
await expect(page.getByRole('heading', { name: 'Sign up' })).toBeVisible();
await page.getByRole('checkbox', { name: 'Subscribe' }).check();
await page.getByRole('button', { name: /submit/i }).click();
参数
-
role
"alert" | "alertdialog" | "application" | "article" | "banner" | "blockquote" | "button" | "caption" | "cell" | "checkbox" | "code" | "columnheader" | "combobox" | "complementary" | "contentinfo" | "definition" | "deletion" | "dialog" | "directory" | "document" | "emphasis" | "feed" | "figure" | "form" | "generic" | "grid" | "gridcell" | "group" | "heading" | "img" | "insertion" | "link" | "list" | "listbox" | "listitem" | "log" | "main" | "marquee" | "math" | "meter" | "menu" | "menubar" | "menuitem" | "menuitemcheckbox" | "menuitemradio" | "navigation" | "none" | "note" | "option" | "paragraph" | "presentation" | "progressbar" | "radio" | "radiogroup" | "region" | "row" | "rowgroup" | "rowheader" | "scrollbar" | "search" | "searchbox" | "separator" | "slider" | "spinbutton" | "status" | "strong" | "subscript" | "superscript" | "switch" | "tab" | "table" | "tablist" | "tabpanel" | "term" | "textbox" | "time" | "timer" | "toolbar" | "tooltip" | "tree" | "treegrid" | "treeitem"#必需的 ARIA 角色。
-
options
Object (可选)-
通常由
aria-checked
或原生<input type=checkbox>
控件设置的属性。了解更多关于
aria-checked
。 -
通常由
aria-disabled
或disabled
设置的属性。:::注意
与大多数其他属性不同,
disabled
是通过 DOM 层次结构继承的。了解更多关于aria-disabled
。 ::: -
exact
boolean (可选) 添加于: v1.28#是否精确匹配 name:区分大小写且全字符串匹配。默认为 false。当 name 是正则表达式时忽略此选项。注意精确匹配仍会修剪空白字符。
-
通常由
aria-expanded
设置的属性。了解更多关于
aria-expanded
。 -
控制是否匹配隐藏元素的选项。默认情况下,角色选择器仅匹配非隐藏元素,如 ARIA 定义。
了解更多关于
aria-hidden
。 -
通常出现在
heading
、listitem
、row
、treeitem
角色中的数字属性,对于<h1>-<h6>
元素有默认值。了解更多关于
aria-level
。 -
匹配 可访问名称 的选项。默认情况下,匹配不区分大小写且搜索子字符串,使用 exact 来控制此行为。
了解更多关于 可访问名称。
-
通常由
aria-pressed
设置的属性。了解更多关于
aria-pressed
。 -
通常由
aria-selected
设置的属性。了解更多关于
aria-selected
。
-
返回
详情
角色选择器不能替代可访问性审计和一致性测试,而是提供关于 ARIA 指南的早期反馈。
许多 HTML 元素具有隐式定义的角色,角色选择器可以识别这些角色。您可以在这里找到所有支持的角色。ARIA 指南不建议通过设置 role
和/或 aria-*
属性来复制隐式角色和属性的默认值。
getByTestId
添加于: v1.27通过测试 ID 定位元素。
用法
考虑以下 DOM 结构:
<button data-testid="directions">Itinéraire</button>
您可以通过测试 ID 定位元素:
await page.getByTestId('directions').click();
参数
返回
详细信息
默认情况下,使用 data-testid
属性作为测试 ID。如果需要,可以使用 selectors.setTestIdAttribute() 配置不同的测试 ID 属性。
// 从 @playwright/test 配置中设置自定义测试 ID 属性:
import { defineConfig } from '@playwright/test';
export default defineConfig({
use: {
testIdAttribute: 'data-pw'
},
});
getByText
添加于: v1.27允许定位包含给定文本的元素。
另请参阅 locator.filter(),它允许通过其他条件(如无障碍角色)进行匹配,然后按文本内容过滤。
用法
考虑以下 DOM 结构:
<div>Hello <span>world</span></div>
<div>Hello</div>
您可以通过文本子串、精确字符串或正则表达式进行定位:
// 匹配 <span>
page.getByText('world');
// 匹配第一个 <div>
page.getByText('Hello world');
// 匹配第二个 <div>
page.getByText('Hello', { exact: true });
// 匹配两个 <div>
page.getByText(/Hello/);
// 匹配第二个 <div>
page.getByText(/^hello$/i);
参数
-
用于定位元素的文本。
-
options
Object (可选)
返回
详细信息
通过文本匹配时总是会规范化空白字符,即使是精确匹配。例如,它会将多个空格转换为一个,将换行符转换为空格,并忽略前导和尾随空白字符。
类型为 button
和 submit
的输入元素通过其 value
属性而非文本内容进行匹配。例如,通过文本 "Log in"
定位会匹配 <input type=button value="Log in">
。
getByTitle
添加于: v1.27允许通过元素的 title 属性定位元素。
用法
考虑以下 DOM 结构:
<span title='Issues count'>25 issues</span>
您可以通过标题文本定位后检查问题数量:
await expect(page.getByTitle('Issues count')).toHaveText('25 issues');
参数
-
用于定位元素的文本。
-
options
Object (可选)
返回值
highlight
添加于: v1.20在屏幕上高亮显示对应的元素。对调试很有用,但不要提交使用 locator.highlight() 的代码。
用法
await locator.highlight();
返回值
hover
添加于: v1.14悬停在匹配的元素上。
用法
await page.getByRole('link').hover();
参数
options
Object (可选)-
是否绕过可操作性检查。默认为
false
。 -
modifiers
Array<"Alt" | "Control" | "ControlOrMeta" | "Meta" | "Shift"> (可选)#需要按下的修饰键。确保在操作期间只按下这些修饰键,然后恢复当前修饰键状态。如果未指定,则使用当前按下的修饰键。"ControlOrMeta" 在 Windows 和 Linux 上解析为 "Control",在 macOS 上解析为 "Meta"。
-
noWaitAfter
boolean (可选) 添加于: v1.28#已弃用此选项无效。
此选项无效。
-
相对于元素内边距(padding box)左上角的点。如果未指定,则使用元素的某个可见点。
-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置中的actionTimeout
选项修改,或者使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法修改。 -
当设置时,此方法仅执行可操作性检查并跳过实际操作。默认为
false
。适用于等待元素准备好执行操作而不实际执行的情况。注意键盘modifiers
无论trial
如何都会被按下,以便测试只有在这些键按下时才可见的元素。
-
返回值
详细说明
此方法通过以下步骤悬停在元素上:
- 等待元素的可操作性检查,除非设置了 force 选项。
- 如果需要,将元素滚动到视图中。
- 使用 page.mouse 悬停在元素的中心位置,或指定的 position。
如果在操作过程中元素从 DOM 中分离,此方法会抛出错误。
当所有步骤在指定的 timeout 内未完成时,此方法会抛出 TimeoutError。传递零超时将禁用此功能。
innerHTML
添加于: v1.14返回元素的 element.innerHTML
。
用法
await locator.innerHTML();
await locator.innerHTML(options);
参数
options
Object (可选)-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置文件中的actionTimeout
选项修改,或者使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法设置。
-
返回值
innerText
添加于: v1.14返回元素的 element.innerText
。
如果需要断言页面上的文本,推荐使用 expect(locator).toHaveText() 并配合 useInnerText 选项以避免不稳定性。更多细节请参考断言指南。
用法
await locator.innerText();
await locator.innerText(options);
参数
options
Object (可选)-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置文件中的actionTimeout
选项修改,或者使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法设置。
-
返回值
inputValue
添加于: v1.14返回匹配的 <input>
、<textarea>
或 <select>
元素的值。
如果需要断言输入值,建议使用 expect(locator).toHaveValue() 以避免不稳定性。更多详情请参阅断言指南。
用法
const value = await page.getByRole('textbox').inputValue();
参数
options
Object (可选)-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置文件中的actionTimeout
选项修改,或者使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法。
-
返回值
详情
对于非 input、textarea 或 select 元素会抛出异常。但如果元素位于 <label>
标签内且该标签有关联的控件,则返回该控件的值。
isChecked
添加于: v1.14返回元素是否被选中。如果元素不是复选框或单选输入框,则会抛出异常。
如果需要断言复选框是否被选中,推荐使用 expect(locator).toBeChecked() 以避免不稳定性。更多详情请参阅 断言指南。
用法
const checked = await page.getByRole('checkbox').isChecked();
参数
options
Object (可选)-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置文件中的actionTimeout
选项修改,或者使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法设置。
-
返回值
isDisabled
添加于: v1.14返回元素是否处于禁用状态,与 enabled 状态相反。
如果需要断言元素处于禁用状态,推荐使用 expect(locator).toBeDisabled() 以避免不稳定性。更多细节请参阅 断言指南。
用法
const disabled = await page.getByRole('button').isDisabled();
参数
options
Object (可选)-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置中的actionTimeout
选项修改,或者使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法进行设置。
-
返回值
isEditable
添加于: v1.14返回元素是否处于可编辑状态。如果目标元素不是 <input>
、<textarea>
、<select>
、[contenteditable]
或不支持 [aria-readonly]
的角色,此方法会抛出错误。
如果需要断言元素可编辑,推荐使用 expect(locator).toBeEditable() 以避免不稳定性。更多细节请参考断言指南。
用法
const editable = await page.getByRole('textbox').isEditable();
参数
options
Object (可选)-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置中的actionTimeout
选项修改,或者使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法设置。
-
返回值
isEnabled
添加于: v1.14返回元素是否处于可操作状态。
如果需要断言元素处于启用状态,推荐使用 expect(locator).toBeEnabled() 以避免不稳定性。更多细节请参阅断言指南。
用法
const enabled = await page.getByRole('button').isEnabled();
参数
options
Object (可选)-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置中的actionTimeout
选项修改,或者使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法设置。
-
返回值
isHidden
添加于: v1.14返回元素是否隐藏,与 visible 状态相反。
如果需要断言元素处于隐藏状态,推荐使用 expect(locator).toBeHidden() 以避免不稳定性。更多细节请参阅 断言指南。
用法
const hidden = await page.getByRole('button').isHidden();
参数
options
Object (可选)-
已弃用
此选项已被忽略。locator.isHidden() 不会等待元素变为隐藏状态,而是立即返回结果。
-
返回值
isVisible
Added in: v1.14返回元素是否可见。
如果需要断言元素可见,推荐使用 expect(locator).toBeVisible() 以避免不稳定性。更多细节请参考断言指南。
用法
const visible = await page.getByRole('button').isVisible();
参数
options
Object (可选)-
已弃用
此选项已被忽略。locator.isVisible() 不会等待元素变为可见状态,而是立即返回结果。
-
返回值
last
Added in: v1.14返回指向最后一个匹配元素的定位器。
用法
const banana = await page.getByRole('listitem').last();
返回值
locator
添加于: v1.14该方法在定位器的子树中查找与指定选择器匹配的元素。它也接受过滤选项,类似于 locator.filter() 方法。
用法
locator.locator(selectorOrLocator);
locator.locator(selectorOrLocator, options);
参数
-
selectorOrLocator
string | Locator#用于解析 DOM 元素的选择器或定位器。
-
options
Object (可选)-
将方法的返回结果限定为包含匹配此相对定位器的元素。例如,
article
包含text=Playwright
会匹配<article><div>Playwright</div></article>
。内部定位器必须相对于外部定位器,并且从外部定位器匹配处开始查询,而不是文档根节点。例如,你可以在
<article><content><div>Playwright</div></content></article>
中找到包含div
的content
。但是查找包含article div
的content
会失败,因为内部定位器必须是相对的,不应使用content
外部的元素。注意外部和内部定位器必须属于同一个 frame。内部定位器不能包含 FrameLocator。
-
hasNot
Locator (可选) 添加于: v1.33#匹配不包含内部定位器匹配元素的元素。内部定位器相对于外部定位器查询。例如,
article
不包含div
会匹配<article><span>Playwright</span></article>
。注意外部和内部定位器必须属于同一个 frame。内部定位器不能包含 FrameLocator。
-
hasNotText
string | RegExp (可选) 添加于: v1.33#匹配不包含指定文本的元素(可能在子元素或后代元素中)。当传入 string 时,匹配不区分大小写并搜索子字符串。
-
匹配包含指定文本的元素(可能在子元素或后代元素中)。当传入 string 时,匹配不区分大小写并搜索子字符串。例如,
"Playwright"
会匹配<article><div>Playwright</div></article>
。
-
返回
nth
添加于: v1.14返回匹配元素中第 n 个元素的定位器。索引从零开始,nth(0)
表示选择第一个元素。
用法
const banana = await page.getByRole('listitem').nth(2);
参数
返回值
or
Added in: v1.33创建一个定位器,匹配符合两个定位器中任意一个或多个的所有元素。
注意:当两个定位器都匹配到元素时,结果定位器将会有多个匹配项,可能会导致定位器严格性违规。
使用场景
假设你需要点击"新建邮件"按钮,但有时会弹出安全设置对话框。这种情况下,你可以等待"新建邮件"按钮或对话框出现,并相应处理。
如果"新建邮件"按钮和安全对话框同时出现在屏幕上,"or"定位器会同时匹配两者,可能抛出"严格模式违规"错误。此时可以使用 locator.first() 来只匹配其中一个元素。
const newEmail = page.getByRole('button', { name: 'New' });
const dialog = page.getByText('Confirm security settings');
await expect(newEmail.or(dialog).first()).toBeVisible();
if (await dialog.isVisible())
await page.getByRole('button', { name: 'Dismiss' }).click();
await newEmail.click();
参数
返回值
page
添加于: v1.19该定位器所属的页面。
用法
locator.page();
返回值
press
添加于: v1.14聚焦匹配的元素并按下组合键。
用法
await page.getByRole('textbox').press('Backspace');
参数
-
要按下的键名或要生成的字符,例如
ArrowLeft
或a
。 -
options
Object (可选)-
keydown
和keyup
之间的等待时间(毫秒)。默认为 0。 -
已弃用
此选项在未来将默认设为
true
。触发导航的操作会等待这些导航完成并等待页面开始加载。您可以通过设置此标志来跳过等待。仅在特殊情况下(例如导航到不可访问的页面)才需要此选项。默认为
false
。 -
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置中的actionTimeout
选项修改,或使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法修改。
-
返回
详细说明
聚焦元素后,使用 keyboard.down() 和 keyboard.up()。
key 可以指定预期的 keyboardEvent.key 值或要生成的单个字符。完整的键值列表可参考此处。示例键包括:
F1
- F12
, Digit0
- Digit9
, KeyA
- KeyZ
, Backquote
, Minus
, Equal
, Backslash
, Backspace
, Tab
, Delete
, Escape
, ArrowDown
, End
, Enter
, Home
, Insert
, PageDown
, PageUp
, ArrowRight
, ArrowUp
等。
还支持以下修饰快捷键:Shift
, Control
, Alt
, Meta
, ShiftLeft
, ControlOrMeta
。ControlOrMeta
在 Windows 和 Linux 上解析为 Control
,在 macOS 上解析为 Meta
。
按住 Shift
键会生成对应 key 的大写文本。
如果 key 是单个字符,则区分大小写,因此值 a
和 A
会生成不同的文本。
也支持诸如 key: "Control+o"
, key: "Control++
或 key: "Control+Shift+T"
等快捷键。当指定修饰键时,修饰键会被按下并保持,同时按下后续的键。
pressSequentially
添加于: v1.38在大多数情况下,你应该使用 locator.fill() 替代。只有当页面有特殊键盘处理时,才需要逐个按键输入。
聚焦元素,然后为文本中的每个字符发送 keydown
、keypress
/input
和 keyup
事件。
要按下特殊键,如 Control
或 ArrowDown
,请使用 locator.press()。
用法
await locator.pressSequentially('Hello'); // 立即输入
await locator.pressSequentially('World', { delay: 100 }); // 较慢输入,模拟用户操作
在文本框中输入内容然后提交表单的示例:
const locator = page.getByLabel('Password');
await locator.pressSequentially('my password');
await locator.press('Enter');
参数
-
要逐个按键输入到聚焦元素中的字符串。
-
options
Object (可选)-
按键之间的等待时间(毫秒)。默认为 0。
-
已弃用
此选项无效。
此选项无效。
-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置中的actionTimeout
选项修改,或者使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法设置。
-
返回值
screenshot
添加于: v1.14对匹配定位器的元素进行截图。
用法
await page.getByRole('link').screenshot();
禁用动画并将截图保存到文件:
await page.getByRole('link').screenshot({ animations: 'disabled', path: 'link.png' });
参数
options
Object (可选)-
animations
"disabled" | "allow" (可选)#设置为
"disabled"
时,会停止 CSS 动画、CSS 过渡和 Web 动画。动画根据其持续时间有不同的处理方式:- 有限动画会快进到完成状态,因此会触发
transitionend
事件。 - 无限动画会取消到初始状态,然后在截图后重新播放。
默认为
"allow"
,保持动画不变。 - 有限动画会快进到完成状态,因此会触发
-
caret
"hide" | "initial" (可选)#设置为
"hide"
时,截图会隐藏文本光标。设置为"initial"
时,文本光标行为不会改变。默认为"hide"
。 -
指定截图时应被遮罩的定位器。被遮罩的元素会用粉色盒子
#FF00FF
(可通过 maskColor 自定义)完全覆盖其边界框。遮罩也会应用于不可见元素,参见 仅匹配可见元素 来禁用此行为。 -
maskColor
string (可选) 添加于: v1.35#指定被遮罩元素的覆盖框颜色,使用 CSS 颜色格式。默认颜色为粉色
#FF00FF
。 -
隐藏默认的白色背景,允许捕获带透明度的截图。不适用于
jpeg
图片。默认为false
。 -
保存图片的文件路径。截图类型将从文件扩展名推断。如果 path 是相对路径,则相对于当前工作目录解析。如果未提供路径,图片不会保存到磁盘。
-
图片质量,介于 0-100 之间。不适用于
png
图片。 -
scale
"css" | "device" (可选)#设置为
"css"
时,截图将针对页面上的每个 CSS 像素生成一个像素。对于高 DPI 设备,这将保持截图较小。使用"device"
选项将为每个设备像素生成一个像素,因此高 DPI 设备的截图会是两倍或更大。默认为
"device"
。 -
截图时应用的样式表文本。这里可以隐藏动态元素、使元素不可见或更改其属性,以帮助创建可重复的截图。此样式表穿透 Shadow DOM 并应用于内部框架。
-
最大超时时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置中的actionTimeout
选项,或使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法更改。 -
type
"png" | "jpeg" (可选)#指定截图类型,默认为
png
。
-
返回
详情
此方法捕获页面的截图,裁剪为匹配定位器的特定元素的大小和位置。如果该元素被其他元素覆盖,则在截图中实际上不可见。如果该元素是可滚动容器,则仅当前滚动的内容会在截图中可见。
此方法在截图前会等待 可操作性 检查,然后将元素滚动到视图中。如果元素已从 DOM 中分离,则方法会抛出错误。
返回包含捕获截图的缓冲区。
scrollIntoViewIfNeeded
添加于: v1.14该方法会等待可操作性检查,然后尝试将元素滚动到视图中,除非该元素已经完全可见(由IntersectionObserver的ratio
定义)。
查看滚动了解其他滚动方式。
用法
await locator.scrollIntoViewIfNeeded();
await locator.scrollIntoViewIfNeeded(options);
参数
options
Object (可选)-
最大等待时间(毫秒)。默认为
0
-无超时。默认值可以通过配置文件中的actionTimeout
选项修改,或者使用browserContext.setDefaultTimeout()或page.setDefaultTimeout()方法设置。
-
返回值
selectOption
添加于: v1.14在 <select>
元素中选择一个或多个选项。
用法
<select multiple>
<option value="red">红色</option>
<option value="green">绿色</option>
<option value="blue">蓝色</option>
</select>
// 通过值或标签匹配进行单选
element.selectOption('blue');
// 通过标签匹配进行单选
element.selectOption({ label: 'Blue' });
// 多选红色、绿色和蓝色选项
element.selectOption(['red', 'green', 'blue']);
参数
values
null | string | ElementHandle | Array<string> | Object | Array<ElementHandle> | Array<Object>#-
value
string (可选)通过
option.value
匹配。可选。 -
label
string (可选)通过
option.label
匹配。可选。 -
index
number (可选)通过索引匹配。可选。
<select>
具有multiple
属性,则所有匹配的选项都会被选中,否则只选中第一个匹配的选项。字符串值会同时匹配值和标签。当所有指定属性都匹配时,选项才会被视为匹配。-
options
Object (可选)-
是否绕过可操作性检查。默认为
false
。 -
已弃用
此选项无效。
此选项无效。
-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置中的actionTimeout
选项修改,或者使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法修改。
-
返回值
详细信息
此方法会等待可操作性检查,等待所有指定选项出现在 <select>
元素中,然后选择这些选项。
如果目标元素不是 <select>
元素,此方法会抛出错误。但如果元素位于具有关联控件的 <label>
元素内,则会使用该控件代替。
返回已成功选中的选项值数组。
在所有提供的选项都被选中后,会触发 change
和 input
事件。
selectText
添加于: v1.14该方法会等待可操作性检查,然后聚焦元素并选中其所有文本内容。
如果元素位于具有关联控件的<label>
元素内,则会聚焦并选中该控件中的文本。
用法
await locator.selectText();
await locator.selectText(options);
参数
options
Object (可选)-
是否绕过可操作性检查。默认为
false
。 -
最大等待时间(毫秒)。默认为
0
-无超时。默认值可以通过配置文件中的actionTimeout
选项修改,或者使用browserContext.setDefaultTimeout()或page.setDefaultTimeout()方法修改。
-
返回值
setChecked
添加于: v1.15设置复选框或单选元素的选中状态。
用法
await page.getByRole('checkbox').setChecked(true);
参数
-
是否选中复选框。
-
options
Object (可选)-
是否绕过可操作性检查。默认为
false
。 -
已弃用
此选项无效。
此选项无效。
-
相对于元素内边距框左上角的坐标点。如果未指定,则使用元素的某个可见点。
-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置中的actionTimeout
选项修改,或使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法修改。 -
当设置为 true 时,此方法仅执行可操作性检查而不执行操作。默认为
false
。适用于等待元素准备好执行操作而不实际执行的情况。
-
返回值
详细说明
此方法通过以下步骤选中或取消选中元素:
- 确保匹配的元素是复选框或单选输入。如果不是,则抛出异常。
- 如果元素已处于正确的选中状态,则立即返回。
- 除非设置了 force 选项,否则等待匹配元素的可操作性检查。如果在检查期间元素被分离,则重试整个操作。
- 如果需要,将元素滚动到视图中。
- 使用 page.mouse 点击元素的中心点。
- 确保元素现在处于选中或未选中状态。如果不是,则抛出异常。
当所有步骤在指定的超时时间内未完成时,此方法会抛出 TimeoutError。传递零超时时间可禁用此功能。
setInputFiles
添加于: v1.14将单个或多个文件上传到 <input type=file>
元素。对于带有 [webkitdirectory]
属性的输入框,仅支持单个目录路径。
用法
// 选择单个文件
await page.getByLabel('Upload file').setInputFiles(path.join(__dirname, 'myfile.pdf'));
// 选择多个文件
await page.getByLabel('Upload files').setInputFiles([
path.join(__dirname, 'file1.txt'),
path.join(__dirname, 'file2.txt'),
]);
// 选择目录
await page.getByLabel('Upload directory').setInputFiles(path.join(__dirname, 'mydir'));
// 移除所有已选文件
await page.getByLabel('Upload file').setInputFiles([]);
// 从内存上传缓冲区
await page.getByLabel('Upload file').setInputFiles({
name: 'file.txt',
mimeType: 'text/plain',
buffer: Buffer.from('this is test')
});
参数
files
string | Array<string> | Object | Array<Object>#options
Object (可选)-
已弃用
此选项无效。
此选项无效。
-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置中的actionTimeout
选项修改,或者使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法修改。
-
返回
详情
将文件输入框的值设置为这些文件路径或文件对象。如果某些 filePaths
是相对路径,则会相对于当前工作目录解析。对于空数组,会清除已选文件。
此方法期望 Locator 指向一个 input 元素。但如果元素位于 <label>
元素内且该标签有关联的 control,则会定位到该控件。
tap
添加于: v1.14在匹配定位器的元素上执行轻触手势。有关通过手动派发触摸事件来模拟其他手势的示例,请参阅模拟传统触摸事件页面。
用法
await locator.tap();
await locator.tap(options);
参数
options
Object (可选)-
是否绕过可操作性检查。默认为
false
。 -
modifiers
Array<"Alt" | "Control" | "ControlOrMeta" | "Meta" | "Shift"> (可选)#要按下的修饰键。确保在操作期间仅按下这些修饰键,然后恢复当前修饰键状态。如果未指定,则使用当前按下的修饰键。"ControlOrMeta" 在 Windows 和 Linux 上解析为 "Control",在 macOS 上解析为 "Meta"。
-
已弃用
此选项无效。
此选项无效。
-
相对于元素内边距(padding)框左上角的点。如果未指定,则使用元素的某个可见点。
-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置中的actionTimeout
选项更改,或使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法设置。 -
设置时,此方法仅执行可操作性检查并跳过实际操作。默认为
false
。可用于等待元素准备好执行操作而不实际执行它。注意,无论trial
如何,键盘modifiers
都会被按下,以便测试仅在按下这些键时才可见的元素。
-
返回
详情
此方法通过以下步骤轻触元素:
- 等待元素的可操作性检查,除非设置了 force 选项。
- 如果需要,将元素滚动到视图中。
- 使用 page.touchscreen 轻触元素的中心点或指定的 position。
如果在操作过程中元素从 DOM 中分离,此方法会抛出错误。
当所有步骤在指定的 timeout 内未完成时,此方法会抛出 TimeoutError。传递零超时将禁用此功能。
element.tap()
要求浏览器上下文的 hasTouch
选项设置为 true。
textContent
添加于: v1.14返回元素的 node.textContent
。
如果需要断言页面上的文本内容,推荐使用 expect(locator).toHaveText() 以避免不稳定性。更多详情请参阅 断言指南。
用法
await locator.textContent();
await locator.textContent(options);
参数
options
Object (可选)-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置文件中的actionTimeout
选项修改,或者使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法设置。
-
返回值
uncheck
添加于: v1.14确保复选框或单选元素处于未选中状态。
用法
await page.getByRole('checkbox').uncheck();
参数
options
Object (可选)-
是否绕过可操作性检查。默认为
false
。 -
已弃用
此选项无效。
此选项无效。
-
相对于元素内边距(padding)框左上角的坐标点。如果未指定,则使用元素的某个可见点。
-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置中的actionTimeout
选项修改,或者使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法设置。 -
当设置时,此方法仅执行可操作性检查而不执行实际操作。默认为
false
。可用于等待元素准备好执行操作而不实际执行它。
-
返回
详细说明
此方法通过以下步骤取消选中元素:
- 确保元素是复选框或单选输入框。如果不是,此方法会抛出错误。如果元素已经处于未选中状态,此方法立即返回。
- 等待元素的可操作性检查,除非设置了 force 选项。
- 如果需要,将元素滚动到视图中。
- 使用 page.mouse 点击元素的中心点。
- 确保元素现在处于未选中状态。如果没有,此方法会抛出错误。
如果在操作过程中元素从 DOM 中分离,此方法会抛出错误。
当所有步骤在指定的超时时间内未完成时,此方法会抛出 TimeoutError。传递零超时将禁用此功能。
waitFor
添加于: v1.16当定位器指定的元素满足 state 选项时返回。
如果目标元素已满足条件,则该方法立即返回。否则,最多等待 timeout 毫秒直到条件满足。
用法
const orderSent = page.locator('#order-sent');
await orderSent.waitFor();
参数
options
Object (可选)-
state
"attached" | "detached" | "visible" | "hidden" (可选)#默认为
'visible'
。可选值包括:'attached'
- 等待元素存在于 DOM 中。'detached'
- 等待元素不存在于 DOM 中。'visible'
- 等待元素具有非空边界框且没有visibility:hidden
样式。注意:没有内容或设置了display:none
的元素具有空边界框,不被视为可见。'hidden'
- 等待元素从 DOM 中分离,或具有空边界框或visibility:hidden
样式。这是'visible'
选项的反向操作。
-
最大等待时间(毫秒)。默认为
0
- 无超时限制。默认值可以通过配置文件中的actionTimeout
选项修改,或使用 browserContext.setDefaultTimeout() 和 page.setDefaultTimeout() 方法设置。
-
返回值
已弃用
elementHandle
添加于: v1.14始终建议优先使用 Locator 和 web 断言而非 ElementHandle,因为后者本质上存在竞态条件问题。
将给定的定位器解析为第一个匹配的 DOM 元素。如果没有匹配的元素,则会等待直到出现一个。如果多个元素匹配定位器,则会抛出错误。
用法
await locator.elementHandle();
await locator.elementHandle(options);
参数
options
Object (可选)-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置文件中的actionTimeout
选项修改,或者使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法设置。
-
返回值
elementHandles
添加于: v1.14始终优先使用 Locator 和 web 断言而非 ElementHandle,因为后者本质上存在竞态条件问题。
将给定的定位器解析为所有匹配的 DOM 元素。如果没有匹配的元素,则返回空列表。
用法
await locator.elementHandles();
返回值
type
添加于: v1.14在大多数情况下,你应该使用 locator.fill() 替代。只有当页面有特殊键盘处理逻辑时才需要逐个按键输入 - 这种情况下请使用 locator.pressSequentially()。
聚焦元素,然后为文本中的每个字符发送 keydown
、keypress
/input
和 keyup
事件。
要按下特殊键(如 Control
或 ArrowDown
),请使用 locator.press()。
用法
参数
-
要输入到聚焦元素中的文本。
-
options
Object (可选)-
按键之间的等待时间(毫秒)。默认为 0。
-
已弃用
此选项无效。
此选项无效。
-
最大等待时间(毫秒)。默认为
0
- 无超时。默认值可以通过配置中的actionTimeout
选项修改,或者使用 browserContext.setDefaultTimeout() 或 page.setDefaultTimeout() 方法设置。
-
返回值