框架定位器
FrameLocator 表示页面上 iframe
的视图。 它捕获了足够检索 iframe
并定位该 iframe 中元素的逻辑。 FrameLocator 可以通过以下方式创建: Locator.contentFrame(),Page.frameLocator() 或 Locator.frameLocator() 方法。
Locator locator = page.locator("#my-frame").contentFrame().getByText("Submit");
locator.click();
严格性
框架定位器是严格的。 这意味着如果多个元素匹配给定的选择器,则框架定位器上的所有操作都会抛出异常。
// Throws if there are several frames in DOM:
page.locator(".result-frame").contentFrame().getByRole(AriaRole.BUTTON).click();
// Works because we explicitly tell locator to pick the first frame:
page.locator(".result-frame").first().contentFrame().getByRole(AriaRole.BUTTON).click();
将定位器转换为 FrameLocator
如果你有一个指向 iframe
的 Locator 对象,可以使用 Locator.contentFrame() 将其转换为 FrameLocator。
将 FrameLocator 转换为定位器
如果你有一个 FrameLocator 对象,可以使用 FrameLocator.owner() 将其转换为指向相同 iframe
的 Locator。
方法
frameLocator
添加时间:v1.17在处理 iframe 时,你可以创建一个框架定位器,它将进入 iframe 并允许你在该 iframe 中选择元素。
用法
FrameLocator.frameLocator(selector);
参数
返回
getByAltText
添加时间:v1.27允许通过 alt 文本定位元素。
用法
例如,此方法将通过 alt 文本“Playwright logo”查找图像
<img alt='Playwright logo'>
page.getByAltText("Playwright logo").click();
参数
-
要定位的元素的文本。
-
options
FrameLocator.GetByAltTextOptions
(可选)
返回
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">
page.getByLabel("Username").fill("john");
page.getByLabel("Password").fill("secret");
参数
-
要定位的元素的文本。
-
options
FrameLocator.GetByLabelOptions
(可选)
返回
getByPlaceholder
添加时间:v1.27允许通过占位符文本定位输入元素。
用法
例如,考虑以下 DOM 结构。
<input type="email" placeholder="[email protected]" />
你可以在通过占位符文本定位后填写输入
page.getByPlaceholder("[email protected]").fill("[email protected]");
参数
-
要定位的元素的文本。
-
options
FrameLocator.GetByPlaceholderOptions
(可选)
返回
getByRole
添加时间:v1.27允许通过其 ARIA 角色、ARIA 属性 和 可访问名称 定位元素。
用法
考虑以下 DOM 结构。
<h3>Sign up</h3>
<label>
<input type="checkbox" /> Subscribe
</label>
<br/>
<button>Submit</button>
你可以通过其隐式角色定位每个元素
assertThat(page
.getByRole(AriaRole.HEADING,
new Page.GetByRoleOptions().setName("Sign up")))
.isVisible();
page.getByRole(AriaRole.CHECKBOX,
new Page.GetByRoleOptions().setName("Subscribe"))
.check();
page.getByRole(AriaRole.BUTTON,
new Page.GetByRoleOptions().setName(
Pattern.compile("submit", Pattern.CASE_INSENSITIVE)))
.click();
参数
-
role
enum AriaRole { 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
FrameLocator.GetByRoleOptions
(可选)-
通常由
aria-checked
或原生<input type=checkbox>
控件设置的属性。了解有关
aria-checked
的更多信息。 -
通常由
aria-disabled
或disabled
设置的属性。注意与大多数其他属性不同,
disabled
会通过 DOM 层次结构继承。 了解有关aria-disabled
的更多信息。 -
setExact
boolean (可选)添加时间:v1.28#是否 setName 是精确匹配:区分大小写且为完整字符串。 默认为 false。 在 setName 为正则表达式时忽略。 请注意,完全匹配仍然会修剪空格。
-
通常由
aria-expanded
设置的属性。了解有关
aria-expanded
的更多信息。 -
setIncludeHidden
boolean (可选)#控制是否匹配隐藏元素的选项。 默认情况下,只有非隐藏元素(如 ARIA 所定义)才会被角色选择器匹配。
了解有关
aria-hidden
的更多信息。 -
通常用于
heading
、listitem
、row
、treeitem
角色的数字属性,<h1>-<h6>
元素具有默认值。了解更多关于
aria-level
。 -
setName
String | Pattern (可选)#用于匹配 可访问名称 的选项。默认情况下,匹配不区分大小写并搜索子字符串,使用 setExact 控制此行为。
了解更多关于 可访问名称。
-
通常由
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 定位元素。
page.getByTestId("directions").click();
参数
返回
详情
默认情况下,data-testid
属性用作测试 ID。如有必要,使用 Selectors.setTestIdAttribute() 配置不同的测试 ID 属性。
getByText
添加时间:v1.27允许定位包含给定文本的元素。
另请参阅 Locator.filter(),它允许按其他条件匹配,例如可访问角色,然后按文本内容过滤。
用法
考虑以下 DOM 结构
<div>Hello <span>world</span></div>
<div>Hello</div>
您可以通过文本子字符串、完整字符串或正则表达式定位
// Matches <span>
page.getByText("world")
// Matches first <div>
page.getByText("Hello world")
// Matches second <div>
page.getByText("Hello", new Page.GetByTextOptions().setExact(true))
// Matches both <div>s
page.getByText(Pattern.compile("Hello"))
// Matches second <div>
page.getByText(Pattern.compile("^hello$", Pattern.CASE_INSENSITIVE))
参数
-
要定位的元素的文本。
-
options
FrameLocator.GetByTextOptions
(可选)
返回
详情
按文本匹配始终规范化空白,即使是精确匹配。例如,它将多个空格转换为一个空格,将换行符转换为空格,并忽略前导和尾随空格。
类型为 button
和 submit
的输入元素通过它们的 value
而不是文本内容进行匹配。例如,通过文本 "Log in"
定位匹配 <input type=button value="Log in">
。
getByTitle
添加时间:v1.27允许通过其 title 属性定位元素。
用法
考虑以下 DOM 结构。
<span title='Issues count'>25 issues</span>
您可以通过标题文本定位它后检查问题计数。
assertThat(page.getByTitle("Issues count")).hasText("25 issues");
参数
-
要定位的元素的文本。
-
options
FrameLocator.GetByTitleOptions
(可选)
返回
locator
添加时间:v1.17此方法在定位器的子树中查找与指定选择器匹配的元素。它还接受过滤器选项,类似于 Locator.filter() 方法。
用法
FrameLocator.locator(selectorOrLocator);
FrameLocator.locator(selectorOrLocator, options);
参数
-
selectorOrLocator
String | Locator#解析 DOM 元素时要使用的选择器或定位器。
-
options
FrameLocator.LocatorOptions
(可选)-
将方法的结果缩小到包含与该相对定位器匹配的元素的结果。例如,具有
text=Playwright
的article
匹配<article><div>Playwright</div></article>
。内部定位器必须相对于外部定位器,并从外部定位器匹配开始查询,而不是从文档根目录开始查询。例如,您可以找到在
<article><content><div>Playwright</div></content></article>
中具有div
的content
。但是,查找具有article div
的content
将失败,因为内部定位器必须是相对的,不应使用content
之外的任何元素。请注意,外部和内部定位器必须属于同一个框架。内部定位器不得包含 FrameLocator。
-
setHasNot
Locator (可选)添加于:v1.33#匹配不包含与内部定位器匹配的元素的元素。内部定位器针对外部定位器进行查询。例如,不包含
div
的article
匹配<article><span>Playwright</span></article>
。请注意,外部和内部定位器必须属于同一个框架。内部定位器不得包含 FrameLocator。
-
setHasNotText
String | Pattern (可选)添加于:v1.33#匹配内部或子孙元素中不包含指定文本的元素。当传递 字符串 时,匹配不区分大小写并搜索子字符串。
-
setHasText
String | Pattern (可选)#匹配内部或子孙元素中包含指定文本的元素。当传递 字符串 时,匹配不区分大小写并搜索子字符串。例如,
"Playwright"
匹配<article><div>Playwright</div></article>
。
-
返回
owner
添加于:v1.43返回一个指向与该框架定位器相同的 iframe
的 Locator 对象。
当您从某个地方获得了一个 FrameLocator 对象,并且之后想与 iframe
元素进行交互时,这很有用。
对于逆向操作,请使用 Locator.contentFrame()。
用法
FrameLocator frameLocator = page.locator("iframe[name=\"embedded\"]").contentFrame();
// ...
Locator locator = frameLocator.owner();
assertThat(locator).isVisible();
返回
已弃用
first
添加时间:v1.17返回指向第一个匹配框架的定位器。
用法
FrameLocator.first();
返回
last
添加时间:v1.17返回指向最后一个匹配框架的定位器。
用法
FrameLocator.last();
返回
nth
添加时间:v1.17返回指向第 n 个匹配框架的定位器。它是从零开始的,nth(0)
选择第一个框架。
用法
FrameLocator.nth(index);
参数
返回