微软出品自动化神器【Playwright+Java】系列(十)元素定位详解
一、写在前面
又有很久没更文了,真的是被催婚搞的整个人情绪特别不好,如果硬要形容的话,那就是没法跟人正常沟通,一点就着,做什么都没耐心,看什么都烦,简直没救了...
也是偶然发现的,自己居然没写关于Playwright
的元素定位,这不是自动化测试的重中之重,怎么可以忘,马上安排!
二、元素定位
主要支持定位方式有:css、xpath、text
。
示例代码如下:
//选择单个元素
page.querySelector("selector");
//选择多个元素
page.querySelectorAll("selector");
//选择单个元素,并且自动等待到元素可见、可操作
page.waitForSelector("selector");
三、CSS定位
1、css+定位值
可以理解为指定为:css方式定位+使用的定位方式(css选择器语法)
。
示例代码如下:
page.locator("css=[type='text']")
2、通过其文本内容匹配元素
元素标签+:has-text()
:has-text()
匹配任何包含指定文本的元素,在内部的某个地方,可能在子元素或后代元素中。匹配不区分大小写,理解为模糊匹配,应注意与其他CSS说明符一起使用,否则将匹配所有包含指定文本的元素,包括<body>
。
示例代码如下:
List<ElementHandle> elements = page.querySelectorAll("button:has-text("Button")");
System.out.println(elements.size());// 5
```html
#### 3、在指定元素中查找匹配文本的元素
`:text()`匹配包含指定文本的最小元素。匹配不区分大小写,还是模糊匹配,就是指定范围了。
**示例代码如下:**
```java
page.querySelector("article .ant-row :text("Open Modal")").click();
4、文本通过正则表达式匹配
匹配文本内容与类似JavaScript的正则表达式匹配的最小元素。
示例代码如下:
page.querySelector("article .ant-row :text-matches("Open M\o*dal", "i")")
5、仅匹配可见元素
示例dom:
<button style='display: none'>Invisible</button>
<button>Visible</button>
示例代码如下:
page.locator("button:visible").click();
注意:
文本匹配会规范化空格。例如,它将多个空格变成一个,将换行符变成空格,并忽略前后空格。
6、在给定范围内元素,匹配元素
给定元素的范围的参数传递的任何选择器至少匹配一个元素,它将返回一个元素,也是模糊匹配!
示例代码如下:
page.navigate("http://localhost:8080/wait.html");
page.querySelector("#wait").click();
String content = page.waitForSelector("div:has(p)").textContent();
System.out.println(content);
7、匹配条件之一的元素
以逗号分隔,从CSS选择器列表将匹配该列表中的选择器之一可以选择的所有元素,简单说就是从这么多列表中找到一个匹配的选择器去选择元素。
示例代码如下:
page.navigate("https://antdv.com/components/modal-cn");
page.waitForSelector("#components-modal-demo-basic .code-box-demo span").click();
page.locator("button:has-text("取 消"), button:has-text("确定")").click();
8、基于布局匹配定位元素
基于页面布局定位,上下左右之类的,会有当页面布局改变时,会出现找不到元素或者匹配其他元素的情况。
示例代码如下:
//在promo-card附近的元素
page.locator("button:near(.promo-card)").click();
//获取(promo-card2)元素右侧元素文本
String textContent3 = page.waitForSelector("button:right-of(#card2)").textContent();
System.out.println("textContent3: "+textContent3);
//获取(promo-card2)元素左侧元素文本
String textContent1 = page.waitForSelector("button:left-of(#card2)").textContent();
System.out.println("textContent1: "+textContent1);
//获取(promo-card2)元素上面元素属性
String above = page.waitForSelector("button:above(#card2)").getAttribute("id");
System.out.println("above: "+above);
//获取(promo-card2)元素下面元素属性
String below = page.waitForSelector("button:below(#card2)").getAttribute("id");
System.out.println("below: "+below);
9、从查询结果中选择第n个元素匹配
与: nth-child()不同,元素不必是兄弟姐妹,它们可以在页面上的任何位置元素。
示例代码如下:
page.waitForSelector(":nth-match(:text('promo-card'), 2)").click();
10、第N个元素定位器
选择索引的的方式定位。
示例代码如下:
//获取第一个元素的文本
String first = page.locator("button").locator("nth=0").textContent();
//获取最后一个元素的文本
String last = page.locator("button").locator("nth=-1").textContent();
System.out.println(first+"\n"+last);
11、仅定位可见元素
一个页面有两个按钮,第一个不可见,第二个可见,示例:
<button style='display: none'>Invisible</button>
<button>Visible</button>
示例代码如下:
page.locator("button").locator("visible=true").click();
三、XPath定位
任何以//或…开头的选择器被假定为xpath选择器。例如,Playwright将'//html/body'转换为'xpath=//html/body'。
1、XPath混合使用
特性就是管道符|
的使用,在XPath中可指定多个选择器。它将匹配该列表中的选择器之一可以选择的所有元素。
示例代码如下:
page.navigate("https://antdv.com/components/modal-cn");
page.querySelector("#components-modal-demo-basic .code-box-demo span").click();
page.locator("//div[@id='vcDialogTitle0']|//div[@role='documentcontent']").waitFor();
System.out.println();
2、常见XPath定位使用
完全支持XPath定位和CSS语法,这里没法可说的,个人感觉是完美兼容Selenium
的CSS 、XPath定位
定位方式的,参考学习CSS定位入门、XPATH定位入门这两篇。
四、使用文本定位
使用文本定位:以引号 "" 或者 ' 开头的,可以判定为文本定为文本定位。
1、包含
示例代码如下:
//包含
String content = page.textContent("button:text('card0')");
2、严格匹配
示例代码如下:
//严格匹配
String content1 = page.textContent("button:text-is('card0')");
3、正则表达式匹配
示例代码如下:
//正则
String content2 = page.textContent("button:text-matches("ca\r*d0")");
五、使用属性选择器定位
不是CSS选择器,因此不支持任何特定于CSS的选项。
示例代码如下:
page.fill("id=user","username1");
page.type("data-testid=testid","username2");
六、使用链式选择器定位
选择器被链接时,下一个选择器相对于前一个选择器的结果被查询,个人感觉就是按照层级去定位元素。
示例代码如下:
page.navigate("https://2x.antdv.com/components/modal-cn");
page.click("#components-modal-demo-basic .code-box-demo span");
page.click("div[role="dialog"] >> div[role="document"] >> text="取 消"");
System.out.println();
七、写在最后
在Playwright
系列的第九篇文中说,一个不留神就更新API了,请大家原谅我哈!
不但英文不好,而且眼神也不好,尴尬,这是第一次,也是最后一次!
我会在后面的文章中陆续把落下的补上,随着这几天的熟悉使用,有时帮我觉得它比selenium
更出色,不知道是不是我的幻觉?
微软出品自动化神器【Playwright+Java】系列(十)元素定位详解的更多相关文章
- 微软出品自动化神器Playwright,不用写一行代码(Playwright+Java)系列(一) 之 环境搭建及脚本录制
一.前言 半年前,偶然在视频号刷到某机构正在直播讲解Playwright框架的使用,就看了一会,感觉还不错,便被种草,就想着自己有时间也可以自己学一下,这一想着就半年多过去了. 读到这,你可能就去百度 ...
- 微软出品自动化神器Playwright(Playwright+Java)系列(四) 之 浏览器操作
写在前面 今天是国庆节的最后一天,明天又要上班了,真的是感觉好像才开始放假一样,还是因为失恋没缓过来吗? 我的国庆七天 第1天,当了近半天的司机,陪家人去各大超市去购物,下午在家躺····· 第2-5 ...
- 微软出品自动化神器【Playwright+Java】系列(六) 之 字符输入、单元素键盘事件操作、上传文件、聚焦、拖拽、悬浮操作
前言: 今天一早起床,就一直太阳穴疼,吃了四片去痛片已经无效,真的是疼的直恶心. 如果说学习或者写文章,能够或者头疼的话,那我想说,我还能坚持一会..... 很久没更新这系列的文章了,那么我们将Pla ...
- 腾讯出品小程序自动化测试框架【Minium】系列(三)元素定位详解
写在前面 昨天转发这篇文章时,看到群里有朋友这样说: 这么卷吗?这个框架官方已经不维护了. 姑且不说卷不卷的问题,要是能卷明白,别说还真不错: 不维护又怎样?我想学习,想会,分享给很期待这系列的文章的 ...
- 微软出品自动化神器【Playwright+Java】系列(七) 之 元素的可操作性验证
前言 昨天在某平台发表了一篇这系列的文章,结果不但提示说有违禁词(java也算?),然后文章审核通过后,文章还找不到,不到去哪了,表示很郁闷,去反应未果,确实有点尴尬了. 元素的可操作性验证 关于AP ...
- 微软出品自动化神器【Playwright+Java】系列(五) 之 常见点击事件操作
写在前面 明天就是周五了,这周有那么一两天心情特别不好,真的是做什么都没兴致,所以导致整个人都很丧,什么都不想做. 本打算周一就更新这篇文章的,但由于公司一直加班,每天到家很晚,都是挤时间去学,理解后 ...
- Java系列:JVM指令详解(下)(zz)
九.自增减指令 20:iconst_1 21:istore_1 22:return 指令码 助记符 ...
- Java系列:JVM指令详解(上)(zz)
一.未归类系列A 此系列暂未归类. 指令码 助记符 说明 59:iastore 60:lload 6 //因为str ...
- JAVA系列之类加载机制详解
类的加载机制 ? 双亲委派机制 ? 什么是类加载器 ? 自定义类加载器有哪些应用场景 ? 通常,在关于Java的类加载部分会遇到以上疑问,本文将对类加载重要部分做详细介绍,包括重要的基础概念和应用场景 ...
- 《手把手教你》系列技巧篇(十四)-java+ selenium自动化测试-元素定位大法之By xpath上卷(详细教程)
1.简介 按宏哥计划,本文继续介绍WebDriver关于元素定位大法,这篇介绍定位倒数二个方法:By xpath.xpath 的定位方法, 非常强大. 使用这种方法几乎可以定位到页面上的任意元素. ...
随机推荐
- USB转TTL串口 (CH340 G)
为什么USB要转TTL串口[1]? 单片机串口基本采用TTL电平. 家用电脑很少有串口,但是有USB接口 USB的电平与TTL电平不兼容. 所以需要将USB电平转化为TTL电平. USB是什么? 接口 ...
- AcWing340通信道路/ USACO2008 Telephone Line S
AcWing题目 洛谷题目 解题思路 首先可以得到一个很容易得到的贪心策略,将一条路径上最贵的(边权最大)的\(K\)条边删去,那么我们剩下的路径中最贵(边权最大)的路就是原本这条路径上帝\(K + ...
- 9、IDEA回退Git版本
转载自 在工作中有时候会要求我们将以前提交的代码新开一个分支,而把之前提交的分支回退到以前某个版本. 1.通过IDEA查看Git历史记录,复制当前版本号. 2.记录当前版本号后,再复制你要回退的版本号 ...
- [机器学习] sklearn支持向量机
支持向量机SVM(Support Vector Machine)是一种用来进行模式识别.分类.回归的机器学习模型. SVM原理描述 模型表示 以一个客户好坏分类为案例,客户信息如下所示: 客户信息数轴 ...
- [数据结构]深度优先搜索算法(Depth-First-Search,DFS)
深度优先搜索算法的概念 与广度优先搜索算法不同,深度优先搜索算法类似与树的先序遍历.这种搜索算法所遵循的搜索策略是尽可能"深"地搜索一个图.它的基本思想如下:首先访问图中某一个起始 ...
- 痞子衡嵌入式:盘点国内Cortex-M内核MCU厂商高主频产品(2023)
大家好,我是痞子衡,是正经搞技术的痞子.今天痞子衡给大家介绍的是国内Cortex-M内核MCU厂商高主频产品. 在 2021 年初痞子衡写了篇 <盘点国内Cortex-M内核MCU厂商高性能产品 ...
- ng-alain组件st表格,实现点击表格行变色,或者渲染变色
实现点击表格行变色 html文件 <st #st [data]="data" (change)="changeClick($event)" [column ...
- 反射概述-获取字节码Class对象的三种方式
反射概述 判定结果∶*红色:失败*绿色:成功*一般我们会使用断言操作来处理结果*Assert.assertEquals(期望的结果,运算的结果);补充∶*Before:*修饰的方法会在测试方法之前被自 ...
- Dubbo 中 Zookeeper 注册中心原理分析
vivo 互联网服务器团队- Li Wanghong 本文通过分析Dubbo中ZooKeeper注册中心的实现ZooKeeperResitry的继承体系结构,自顶向下分析了AbstractRegist ...
- c++ 递推算法
各位大佬不妨先点个赞再看文章! 递推法是一种重要的数学方法,在数学的各个领域中都有广泛的运用,也是计算机用于数值计算的一个重要算法.这种算法特点是:一个问题的求解需一系列的计算,在已知条件和所求问题之 ...