首页 > 其他 > 详细

F12的用法

时间:2019-09-29 17:58:24      阅读:77      评论:0      收藏:0      [点我收藏+]

F12在Web测试中十分重要,可以定位元素(UI自动化常用),查看网页响应时间/数据(定位BUG,测单页面响应时间→性能)

Elements

技术分享图片点击这个按钮,将光标移至“Google”图片位置并点击,右侧的F12控制台就会选中对应的HTML标签(......可以修改页面元素的属性)。

重点:在“标签”位置右键→Copy→Copy Xpath (即可获取元素的定位)

技术分享图片

技术分享图片

 

Console和Sources

这个两个用的比较少,console会打印请求,返回的结果以及数据,可以有一定的分析作用。

可以判断:js错误,数据错误

 

Network

技术分享图片

Headers:头信息

请求头、请求体,响应头、响应体

请求数据:

Query String Parameters → get传参的请求数据

Form Data → post传参的请求数据

Preview:预览 返回数据预览
Response:响应报文

格式可以是HTML,json....

依据响应报文,判断是否为bug是哪端的

Timing:时间 这个页面请求到响应的时间

注意:

技术分享图片 红色为录制状态,会将浏览器的所有操作显示在控制台

技术分享图片点击可以清除控制台所有的内容

 

F12的用法

原文:https://www.cnblogs.com/bf-blackfish/p/11608955.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!