美文网首页小强测试技术与人生杂谈
Playwright自动化测试工具之元素定位实战

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

作者: 测试帮日记 | 来源:发表于2021-03-30 21:40 被阅读0次

    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)

    相关文章

      网友评论

        本文标题:Playwright自动化测试工具之元素定位实战

        本文链接:https://www.haomeiwen.com/subject/rgcnhltx.html