【python自动化】Playwright基础教程定位操作

news2024/12/25 12:39:15

上文我们已经能够成功进行登录操作了。对于里面的一些定位方式，输入，点击等操作，在这一节，我们直接进行一个大汇总。以后遇到直接来这里搜。

定位操作

定位操作都在Page类下。养成看源码的习惯，结合官方文档，源码还写了例子，真的是很详细了。

按alt文本定位元素-get_by_alt_text()

使用频率：★☆☆☆☆

释义：按alt属性的文本进行定位元素。

网页代码：

<img alt='Playwright logo'>

定位用法：

page.get_by_alt_text("Playwright logo").click()

参数：

text：str，输入要查找元素的文本。
exact：bool，是否找到完全匹配项：区分大小写和全字符串。默认为 false。

按标签定位元素-get_by_label()

使用频率：★☆☆☆☆

释义：允许按关联 <label> or aria-labelledby 元素的文本或 aria-label 属性查找输入元素。

网页代码：

<input aria-label="Username">   <label for="password-input">Password:</label>   <input id="password-input">

定位用法：

page.get_by_label("Username").fill("john")   page.get_by_label("Password").fill("secret")

参数：

text：str，输入要查找元素的文本。
exact：bool，是否找到完全匹配项：区分大小写和全字符串。默认为 false。

占位符定位-get_by_placeholder()

使用频率：★★★★☆

释义：按占位符文本定位

网页代码：

<input type="email" placeholder="请输入邮箱" />

定位用法：

page.get_by_placeholder("请输入邮箱").fill("8888888@qq.com")

参数：

text：str，输入要查找元素的文本。
exact：bool，是否找到完全匹配项：区分大小写和全字符串。默认为 false。

角色属性定位-get_by_role()

使用频率：★★☆☆☆

释义：通过ARIA角色、ARIA属性和可访问名称定位元素

网页代码：

<h3>Sign up</h3>   <label>     <input type="checkbox" /> Subscribe   </label>   <br/>   <button>Submit</button>

定位用法：

# 这个是pytest-playwright进行断言的方式，后续我们会讲   expect(page.get_by_role("heading", name="Sign up")).to_be_visible()      page.get_by_role("checkbox", name="Subscribe").check()      page.get_by_role("button", name=re.compile("submit", re.IGNORECASE)).click()

参数：太多了，看源码吧，其中role参数比较重要，比如alert就可以用来点击弹窗。

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"

name：str，匹配辅助名称的选项。默认情况下，匹配不区分大小写，并搜索子字符串，用于 exact 控制此行为。

测试ID定位-get_by_test_id()

使用频率：★★★★☆

释义：通过测试ID定位元素

注意事项：默认情况下， data-testid 属性用作测试 ID。如有必要，请使用selectors.set_test_id_attribute() 配置不同的测试 ID 属性。

网页代码：

<button data-testid="directions">我是一个带有特殊id的按钮</button>

定位用法：

page.get_by_test_id("directions").click()

参数：

test_id: str，元素的ID

文本定位-get_by_text()

使用频率：★★★★☆

释义：通过给定的文本进行元素匹配。

网页代码：

<div>梦无矶 <span>小仔</span></div>   <div>梦无矶</div>

注意我第一个梦无矶后面是有一个空格的。

定位用法：

# 匹配 <span>   page.get_by_text("小仔")      # 匹配第一个 <div>    page.get_by_text("梦无矶")      # 匹配第二个 <div>   page.get_by_text("梦无矶", exact=True) # 开启了精准匹配      # 匹配多个 <div>   page.get_by_text(re.compile("梦无矶"))      #匹配第二个 <div>   page.get_by_text(re.compile("^梦无矶$", re.IGNORECASE))

参数：

text：str ，要查找元素的文本。
exact：bool，是否找到完全匹配项：区分大小写和全字符串。默认为 false。

标题定位-get_by_title()

使用频率：★★★☆☆

释义：通过标题文本进行定位元素

网页代码：

<span title='Issues count'>25 issues</span>

定位用法：

page.get_by_title("Issues count")

参数：

text：str，标题文本
exact，bool，是否找到完全匹配项：区分大小写和全字符串。默认为 false。

定位器定位-locator()

使用频率：★★★★★

释义：该方法返回可用于在此页面/框架上执行操作的元素定位器。定位器在执行操作之前立即解析为元素，因此实际上可以在不同的 DOM 元素上对同一定位器执行一系列操作。

这里面我们可以理解为selenium中的css selector,xpath selector定位，用xpath更多。

定位用法：

page.locator(selector)   page.locator(selector, **kwargs)

参数：

selector：str，解析DOM元素时要用的选择器，如标签选择器。
has_text: 匹配包含指定文本的元素，这些元素可能包含在子元素或后代元素中。传递 [string] 时，匹配不区分大小写并搜索子字符串。例如， "Playwright" 匹配 <article><div>Playwright</div></article> .
has_not_text: 匹配不包含指定文本的元素，这些元素可能包含子元素或后代元素。传递 [string] 时，匹配不区分大小写并搜索子字符串。
has：匹配包含与内部定位器匹配的元素的元素。根据外部定位器查询内部定位器。例如， article has text=Playwright 匹配 <article><div>Playwright</div></article> 项。
has_not：匹配不包含与内部定位器匹配的元素的元素。根据外部定位器查询内部定位器。例如，article has_not div 匹配 <article><span>Playwright</span></article> 项。