Playwright自动化测试工具之元素定位实战

3. 元素定位

官方文档:

https://playwright.dev/python/docs/api/class-elementhandle/#element_handleis_visible

3.1 元素定位

元素定位是元素交互的前提条件,也是自动化测试最重要的步骤之一。元素” 存在 “页面”中 ,要定位元素,就是调用“页面”的方法:

l querySelector(engine=body) # 选择单个元素

l querySelectorAll(engine=body) # 选择多个元素

l waitForSelector(engine=body) # 选择单个元素,并且自动等待到元素可见、可操作

代码见下:

目前支持的定位引擎有:css、xpath、text:

Playwright支持提供简写语法,根据内容自动判断选择器:

1. 以 // 或 / 或者 .. 开头的,判断为xpath

pp = page.querySelector("xpath=//h2")

pp = page.querySelector("//h2")

2. 以引号 "" 或者 ' 开头的,判断为text

ppp = page.querySelector("text=文本输入") \

ppp = page.querySelector("'文本输入'")

注意:双引号里有一个单引号,不然无法识别

3. 其他的,都判断为css

p = page.querySelector("css=h2")

p = page.querySelector("h2")

3.2 元素高级定位

# :has 表示包含某个元素的元素

page.click("article:has(div.prome)")

# :is 用来对自身做断言

page.click("button:is(:text('sign in'), :text('log in'))")

# :text 表示包含某个文本的元素

page.click("button:text('Sign in')") # 包含

page.click("button:text-is('Sign is')") # 严格匹配

page.click("button:text-matches('\w+')") # 正则

# 还可以根据方位匹配

page.click("button:right-of(#search)") # 右边

page.click("button:left-of(#search)") # 左边

page.click("button:above(#search)") # 上边

page.click("button:below(#search)") # 下边

page.click("button:near(#search)") # 50px 之内的元素

# 通过 XPath 选择

page.click("//button[@id='search'])")

链式选择器

选择器可以与>>组合使用,例如selector1 >> selector2 >> selectors3。当选择器被链接时,下一个选择器会相对于前一个选择器的结果进行查询。

例如:

page.querySelector("div[role=\"document\"] >> text=\"确定\"")

备注:

1. 定位建议直接用录制的方式,把流程中的定位都录下来,录制命令为:

python -m playwright codegen --target python -o formgetcookie.py -b chromium f.wps.cn/form-list --load-storage formTest134

2. 因为录制大部分都是text定位方式,建议有id的修改id定位

3.3 元素操作

3.3.1 页面操作

page.goto("https://example.com") # 前往页面

page.go_back(**kwargs) #前进

page.go_forward(**kwargs) # 后退

page.screenshot(path="screenshot.png") 截图

print(page.title()) # 打印当前页标题

print(page.url()) # 打印当前页URL

3.3.2 等待元素

page.wait_for_selector("text=\"查看数据汇总表\"")

可以自定义超时时间,state有四种状态:“attached”, “detached”, “hidden”, “visible”:

attached:等待元素出现在DOM树中

detached:等待元素消失在DOM树中

hidden:等待元素从DOM中分离出来,或者有一个空的边界框或visibility:hidden

visible:有非空的边界框和非visibility:hidden

见下方代码示例:

# state="attached", "detached", "hidden", "visible"

page.waitForSelector('#browsers', state='visible', timeout=30000)

3.3.2 操作元素

元素点击

page.click(selector)

填充元素

page.fill(selector, value) # 在 input 中填充值

获取某元素内的所有文本

print(page.evalOnSelector('.headerLogo', """e => e.textContent"""))

print(page.querySelector('.headerLogo').textContent())

3.4 frame处理

处理frame,查找frame有三种方法:

1. frame的name属性

2. frame的URL

3. 通过其他的任何的selector

示例:wps的登录页,登录窗口是在iframe下

代码:

login_frame

= page.query_selector("#smsWrap>iframe").content_frame()

login_frame.fill("input[id=\"phone\"]", "15675632561")

login_frame.click("div[id=\"rectBottom\"]")

3.5 选项框

Checkbox 和 radio buttons直接可以用check和uncheck方法来进行勾选和去勾选,当然其实也可以直接用click方法来通过点击来进行勾选和去勾选

page.click("#currentaccount")

3.5 下拉框

Select options可以单选或者多选,但是只针对元素标签有效果

# 一、通过value值选择

page.selectOption("#cars", "saab")

# 二、通过标签选择

# page.selectOption("#cars", {"label": "Saab"})

# 三、还可以通过元素handle处理

# page.querySelector("#cars").selectOption("saab")

# 多选

# page.selectOption('select#colors', ['red', 'green', 'blue'])

代码示例:

# 选择分支

page.select_option("select[id=\"select\"]", "develop")

3.5 页面切换

问题:我在A页面点击target="_blank"的链接后,浏览器打开了B页面 ,我要怎么定位到B页面?

代码见下:

page.goto("...") # 主页面

with page.expect_popup() as popup_info:

page.click("...") # 此处点击A页面跳转链接

page1 = popup_info.value

page1.goto("...") # B页面的其他操作

3.6 常用断言

# element_handle.is_checked()

element_handle.is_disabled()

element_handle.is_editable()

element_handle.is_enabled()

element_handle.is_hidden()

element_handle.is_visible()

page.is_checked(selector)

page.is_disabled(selector)

page.is_editable(selector)

page.is_enabled(selector)

page.is_hidden(selector)

page.is_visible(selector)

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 158,425评论 4 361
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,058评论 1 291
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 108,186评论 0 243
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,848评论 0 204
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,249评论 3 286
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,554评论 1 216
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,830评论 2 312
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,536评论 0 197
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,239评论 1 241
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,505评论 2 244
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,004评论 1 258
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,346评论 2 253
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 32,999评论 3 235
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,060评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,821评论 0 194
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,574评论 2 271
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,480评论 2 267

推荐阅读更多精彩内容