Selenium3自动化测试【13】FireFox与Chrome浏览器元素定位
目前大部分浏览器都内置了相关插件或组件,能够帮助我们快速、简洁地展示各类元素的属性定义、DOM结构、CSS样式等属性。本书中使用的浏览器主要是、(这2款浏览器也是作为开发者常用的浏览器),因此本节介于这2款浏览器一起看看这些工具(组件)的使用方法。
火狐()浏览器
如果大家对火狐浏览器较为熟知,在旧版本上的,大家一定影响深刻,功能非常强大。
2016年12月宣布停止更新,新版本的火狐浏览器已经看不到影子。而不是消失了,而是被合并到 内置工具中。
1. 前端工具(): Tools
写本书时的最新版本是 60.0.1,新版的,需要学会使用自带的 Tools工具。打开通过按F12可以调用出来,如图所示。
以Bing首页为例,通过F12,调用 Tools,单击下图中的 图标,从页面中选择一个元素,选择的是Bing的输入框,此时在【查看器】可以看到凸显了输入框的Html代码,如图所示,可以看到跟我们以往所熟知的没有任何区别。
谷歌()浏览器
浏览器跟浏览器一样,也有对应的开发者工具。
1. 前端工具():开发者工具
开发者工具是一套内置于 中的Web开发和调试工具,可用来对网站进行迭代、调试和分析。在菜单中选择 【更多工具】 >【 开发者工具】(通过F12可以调用)。
在页面元素上右键单击,选择 “检查”,在中就能看到我们定位元素的id、name、class等。例如Bing输入框,如图5-4所示,通过Bing输入框元素上右键单击“检查”,即可在中看到该元素的html代码,右键单击选择copy我们就能复制出css、xpath定位方式的代码。
《更多【全栈测试】视频课程,点击我哦.....》 《从零开始学自动化测试》
图书京东、当当有售
京东:
当当: