UI主动化中利用Chrome自带F12提取Xpath和CSS

源代码 · 2024-10-2 13:01:17

利用场景

有的同砚属于频仍利用到网页中元素定位技能的脚色，比方编写UI主动化测试用例，大概定位网页题目标人，此时选择利用第三方插件会提供更加强大、美满的功能。但是对于偶然利用，比方到其他人呆板上定位题目标时候，大张旗鼓安装新插件，显然不划算，也不得当装B。这种时候，利用Chrome自带的调试工具更加方便
复制XPath

进入方式：网页上目标元素右键-查抄，大概直接F12，选中第1个tab“元素”，英文是Elements，通过左上角的定位器选中元素。
下一步在F12工具框中，对应高亮的代码行右键，弹出窗口中选择-复制-复制XPath，英文是Copy-Copy element。比方这个图片示例中复制出来的XPath长如许//*[@id="1"]/div/div[1]/div[1]/div[2]/div[2]/div[1]/div/div/div[3]
我认可XPath样式比力丑，可读性比力差

验证XPath和CSS

由于直接复制出来的XPath非常丑，实际利用时都会举行修饰美化进步其可读性和可维护性。那么对于改完后的Xpath，也可以继续在这个工具中验证，

利用Ctrl+f调出查询框
将XPath字符串复制回车后，即可搜索
分析搜索效果。如果搜索效果是0，分析页面上并没有搜索到这个XPath对应的元素，也就是XPath写错了，归去再改。如果搜索效果黑白0的数字，代表有1个大概多个掷中。如果有多个掷中时，对于元素定位而言，一样寻常都还须要再修改一下XPath使其掷中数目为1

UI主动化中利用Chrome自带F12提取Xpath和CSS

所属分类: 问答交流

新帖推荐: 30日

推荐作品