UI自动化之:在Console中定位元素技巧

原创
2020/05/16 12:25
阅读数 681

为避免在代码中不断来回调试定位元素是否正确的问题,推荐大家使用Chrome浏览器的Console,而在selenium中彪哥极力推荐使用css selector定位元素,因为他比Xpath定位速度要快,而且css selector 使用起来更加优雅

首先打开测试专用Chrome浏览器,打开需要定位的网站页面,按F12打开开发者工具,然后切换到Console页签
Console控制台原生支持类jQuery的选择器,我们可以在控制台输入一个 $ 然后回车,看看是否支持,如果没有意外,你看到的应该是如下界面。

1.结果中有function

表示支持类jQuery的选择器,这时我们就可以用 $ 加上熟悉的css选择器来选择DOM节点,语法为:
$('#ID选择器 .Class选择器')
在输入上述语法后回车,就会返回定位到的代码块,例如:

然后我们在代码中就可以直接这样写:
dr.find_element_by_css_selector('#userLoginBtn')

注:

  1. Class属性用 . 来标示

  2. ID属性用 # 来标示

  3. 标签有上下层关系时,上层与下层的标签要用空格隔开

  4. 如果一个class属性中有多个class时,中间不能有空格

  5. 执行的结果有多个时,可通过索引选择要用第几个结果,如

# 有父子关系$('#ID选择器 .Class选择器')
class属性中有多个class$('.ID选择器.Class选择器')
# 通过索引选择$('#ID选择器 .Class选择器')[index]

2.结果中没有function

表示不支持jQuery的选择器,我们还能通过JS方法来定位元素,js提供了很多方法,如:
document.getElementById('ID选择器')document.getElementsByClassName('Class选择器')document.getElementsByName('标签的name名称')document.getElementsByTagName('html标签名')...........
例如,我们在控制台输入document.getElementById('userLoginBtn')回车,就会返回定位到的代码块,如下:

然后我们在代码中通过webdriver的js方法来进行定位元素,类似如下代码(这个是定位页面中的复文本框并输入内容):
def new_content_textfield(self,content):     js ="document.getElementById('content_ifr').contentWindow.document.body.innerHTML = '%s'" %(content)     self.js(js)


Console真的很强大,特别是前端调试,刷新了我的认知



本文章仅代表个人观点,如有纰漏喜欢私信或留言

如果你认同这篇文章,请点击在看

本文分享自微信公众号 - 彪哥的测试之路(gh_c1b79633c733)。
如有侵权,请联系 support@oschina.cn 删除。
本文参与“OSC源创计划”,欢迎正在阅读的你也加入,一起分享。

展开阅读全文
打赏
0
0 收藏
分享
加载中
更多评论
打赏
0 评论
0 收藏
0
分享
返回顶部
顶部