Web GUI自动化-常用xpth定位方法分享-阿里云开发者社区

开发者社区> 平头哥芯片开放社区> 正文

Web GUI自动化-常用xpth定位方法分享

简介: 本文介绍 Web GUI自动化-常用xpth定位方法分享

元素定位是Web GUI自动化测试的核心问题之一,也是最难的问题之一,难点主要在于如何能稳定描述元素路径,本文主要总结下常用的xpath定位方法和我的一些经验。

​元素定位大致可以分两类,绝对路径定位和相对路径定位,前者即使走投无路也不推荐使用,因为绝对路径经常会发生变化,后者比较常用的。但是相对路径定位方式有很多,需要选一种最有利于脚本兼容性的方式。

1.绝对路径定位

​逐层输出元素的位置,如:

//*[@id="app"]/div/div[2]/section/div/div/div[1]/div/div/button/span

​绝对路径可直接从浏览器调试窗口获取,但此方式最不可取的,代码结构稍做调整就会不适用,因此即使找不到定位的方式,也不建议使用。​

2.相对路径定位

​相对路径定位,需要找到确定元素唯一性的特征,定位元素位置。在此分享10种方法,可依次尝试定位。

2.1 id属性定位

​最理想的方式,就是使用id属性定位,id一般在当前界面具有唯一性。

image.png
​图 2-1

​图2-1中代码id在当前界面唯一,因此我们最优先选择的定位方式是使用id,只需寻找id=“table-1”的元素即可,因此xpath代码可写为:

//div[@id="tab-1"]
//*[@id="tab-1"]

​//表示相对路径,@后跟属性,*表示任何匹配任何节点

2.2 name属性定位

当name属性唯一时,也可用来定位。

image.png
图 2-2

如图2-2中name也具有唯一性,也可以通过name来定位元素的位置:

//input[@name="wd"]

2.3 class属性定位

适用于class属性在当前界面具有唯一性的场景。
image.png
图 2-3

​class属性是比较常用的定位元素方式,图2-3中class具有唯一性,xpath定位如下:

//span[@class="el-pagination__total"]

2.4 标签名定位

​有时元素自身标签也可实现定位,常见如button、input、textarea等。

image.png
图 2-4

​如图2-4当前界面只有一个标签textarea,此时元素可以通过标签名定位。

//div/textarea

2.5 其他属性定位

​当以上属性都无法精准定位时,可以考虑placeholder、type、for属性定位,但方式不一定最优。
image.png
图 2-5

如图2-5,定位某个标签的位置,for属性具体唯一性,但是class不唯一,此时就可以用for属性定位元素。

//label[@for="name"]

image.png
图 2-6

如图2-6定位上传文件的位置,type可以精准定位到元素,路径可以写成:

//input[@type="file"]

image.png
图2-7

​placeholder也可以定位,但是不一定最优,若信息稍有变化就不适用,图2-7可使用placeholder定位。

//input[@placeholder="如1.0.1"]

​此外还有href、title、value等不常用的属性,此处就不一一详细说明了,总之只要具有唯一性的属性都可以用来定位元素,但是需要衡量是否是最优方式。但是注意有些属性值是动态生成的,此类属性不可用于定位。

2.6 使用逻辑运算定位

​当单一属性无法满足精准定位的需求时,xpath支持逻辑运算支持与(and)、或(or),这个功能还是比较强大的,最常用的是and,即多个属性确定结合定位元素。

image.png
图 2-8

​如登陆界面有好几处入口,单一属性都无法精准定位,此时可以herf和class属性结合,实现定位需求,此功能在脚本中比较常用。

//*[@href="#/login" and @class="router-link-active"]

2.7 通过上级节点定位

​当现实没那么理想,元素找不到任何可精准定位的属性时,可以先定位父级的位置,再进行元素定位。

image.png
图 2-9

​图2-9中,父级元素class属性唯一,因此先定位到父级,再实现自身定位。图中父级有3个class类,可选取一种用于定位,也可使用多个class类同时定位。

//div[@class="product-name"]/input
//div[@class="productCopy product-name"]/input

​或者通过先定位祖辈(更上层的元素),实现元素定位。

image.png
图 2-10

​图2-10是定位的一个提交按键位置,元素以及父级属性都很大众,此时可以寻找更上级的元素属性,先定位祖辈位置,再结合元素自身class,唯一确认元素位置。

//div[@class="el-dialog__wrapper delete-dialog"]//button[@class="el-button el-button--primary"]

2.8 通过子节点定位

​既然可以通过上层节点定位到子节点,那么也可以通过子节点实现父节点定位,parent就是比较常用的方式。

image.png
图 2-11

​图2-11中,子节点class属性当前界面唯一,因此可以先定位到i节点,再找寻它的父节点 。此时有两种方法可以选择,“parent::节点名称”或直接..到上一层级节点,具体表达如下:

//i[@class="icon-plus el-icon"]/parent::span
//i[@class="icon-plus el-icon"]/..

2.9 通过相邻目录定位

​当无法通过层级关系定位元素时,观察元素的兄弟姐妹们(相邻层级的元素)或者家族长辈(上级的相邻层级元素)的特征,实现元素定位。

image.png
图 2-12

​图2-12相邻元素很相似,此时可以通过标签下标定位,当然方式也不一定最优,与其他代码不同,下标从1开始,如定位第一个元素“账号信息”位置:

//ul/li[1]

​另一种场景是先找寻上层元素的相邻元素,结合自身元素属性,实现定位。

image.png
图2-13

​图2-13中,元素自身和相邻元素,甚至上级元素都没有无法精准定位,但是再上层label节点可以精准定位,此时通过与label节点结合,再结合自身input,就可以唯一找到元素位置。

//label[@for="name"]/..//input

​..表示上一层级节点

2.10 contain/text方法定位

​若是以上方法都不能满足你的需求,有一个非常强大的功能就可以使用,模糊匹配关键字。有多种模糊匹配方式,如:匹配开头,中间、结尾字段等,使用比较多的是contains(包含),很多场景可以通过模糊匹配定位。

image.png
图2-14

图2-14中元素class属性,以及上级button属性都无法精准定位,此时可以通过匹配文本进行定位。

//span[contains(text(),'绑定设备')]

3.总结

元素定位思路与形容某个人很相似:

  1. 元素单一属性定位:介绍个人特点,如:他有羽毛扇。
  2. 元素多属性组合:单个属性不唯一,多个属性组合可唯一确定,如:他谋略超群,且生性多疑。
  3. 通过上级节点定位:长辈有独特特征,或者与长辈组合可以确定唯一性,如:他是中山靖王之后,汉景帝玄孙。
  4. 通过子节点定位:子孙中有特殊人物,如:生子当如孙仲谋
  5. 通过相邻元素定位:找寻家族有特征人物,如:他是刘备的结义兄弟,且有文化。
  6. 模糊匹配:匹配元素的文本内容,如:他的名字里有个“龙”字。
  7. 当以上都无法满足定位条件时,给亲的建议是,找亲爱的开发同学,给所需要定位的元素补充上id。

文章来源:芯片开放社区
文章链接:https://occ.t-head.cn/community/post/detail?spm=a2cl5.14300636.0.0.1b87180flWxVN5&id=658631906446802944

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

分享:
平头哥芯片开放社区
使用钉钉扫一扫加入圈子
+ 订阅

芯片开放社区(Open Chip Community 简称OCC),是平头哥芯片基础设施的云端载体,提供开发中心、创芯空间、技术部落等互动版块,汇聚海量应用资源,助力芯片合作伙伴构建软硬融合的芯片生态。面向芯片企业,OCC以应用驱动芯片精准定义、以全栈技术支撑芯片敏捷开发;面向开发者,OCC以芯片生态降低IoT开发门槛、以1520体系加速IoT产品落地。

官方博客
官网链接