土小帽_Tester的博客

使用场景:① 前端界面加载性能测试。② 导出性能报告给前端开发。

Puppeteer是由‌Google开发的Node.js库，专门用于控制Headless Chrome（无界面浏览器），可以模拟浏览器行为，支持截图、填充表单、处理JavaScript渲染等。虽然Puppeteer在安装配置的便利性和运行效率方面优于Selenium，但它仅支持Node.js环境，且背后的Chromium浏览器版本更新较快，可能需要频繁更新以保持兼容性。Puppeteer还支持无头模式，非常适合在服务器环境中运行，如自动化测试的CI/CD流水线、数据挖掘和网络爬虫等场景。

使用“/”分隔标签层级，一级一级直到定位目标元素，同级有多个相同标签，标签后加中括号“[]”标注选择同级的第几个标签。元素是构成HTML文档的基本组成部分之一，定义了文档的结构和内容，比如段落、标题、链接等。由一个开始标签（start tag）、可能的内容（如文本或其他元素）和一个结束标签（end tag）组成。id、name、class均为标签属性，一个元素可以同时具有id、name、class。一种XML文档定位元素的语言。② 选定html元素（标签），鼠标悬停在标签上，右键弹出菜单，选择“复制”

③ 跳转后可见右侧图片，鼠标悬停在图片上，右键选择菜单项“Copy image as data URI”，即复制图片base64成功，粘贴到需要的地方即可。③ 鼠标悬停图片上，右键选择菜单项“Copy image as data URI”，即复制图片base64成功，粘贴到需要的地方即可。③ 鼠标悬停图片上，右键选择菜单项“Copy image as data URI”，即复制图片base64成功，粘贴到需要的地方即可。③ 进入源码面板（Sources），点击图片，右侧即为图片base64码。

按F12进入浏览器的开发者模式-“应用”（Application）-Cookie，可查看Cookie并进行增、删、改、查操作。

本课介绍F12“网络”（Network）tab菜单界面的功能区域和使用。

浏览器检查工具通常用来作为浏览器web服务测试过程中，辅助测试、排查问题、定位缺陷的工具。

检查工具可以模拟不同屏幕尺寸、不同网速、不同屏幕方向情况下，网页的展示效果，是测试前端界面分辨率兼容性的简便方法。

F12检查工具提供了专门的网速配置功能，可以选择已有网速类型和添加自定义网速，可以做弱网测试。

“Network”网络选项卡功能是测试工作中，排查问题、定位bug最常用的功能。

使用线上接口测试网站https://httpbin.org/forms/post，操作演示浏览器F12检查工具进行接口测试：抓包、复制请求、篡改数据、发送新请求。

本课再次使用线上接口测试网站https://httpbin.org/forms/post，演示操作，使用浏览器F12检查工具如何导出测试脚本到接口测试工具如postman、jmeter、metersphere，以及其他浏览器。

本课再次使用线上接口测试网站https://httpbin.org/forms/post，演示操作，使用浏览器F12检查工具如何导出测试脚本到接口测试工具如postman、jmeter、metersphere，以及其他浏览器。

本课再次使用线上接口测试网站https://httpbin.org/forms/post，演示操作，使用浏览器F12检查工具如何导出测试脚本到接口测试工具如postman、jmeter、metersphere，以及其他浏览器。

本课再次使用线上接口测试网站https://httpbin.org/forms/post，演示操作，使用浏览器F12检查工具如何导出测试脚本到接口测试工具如postman、jmeter、metersphere，以及其他浏览器。