复制 CSS 选择器、XPath 和 DOM 上下文以加快 QA 交接速度。使用可重播的步骤和屏幕截图记录浏览器错误。
从任何网页查找并复制 CSS 选择器、XPath 和 JavaScript 路径。检查确切的元素，检查选择器稳定性，捕获屏幕截图和 DOM 上下文，并保留自动化测试和浏览器错误的技术证据。
CSS Selector & XPath Finder 是 Samelogic 为 QA 工程师、软件测试人员、测试自动化工程师和前端开发人员构建的 Chrome 扩展。使用它来检查页面元素，生成浏览器测试定位器，并为工程提供重现和调查故障所需的上下文。
CSS 选择器查找器和生成器
选择网页上的任意元素以生成并复制其 CSS 选择器。
- 从任何网站或 Web 应用程序复制 CSS 选择器
- 为所选元素生成 CSS 选择器
- 在测试中使用选择器之前检查其稳定性
- 识别依赖于动态 ID 或类的选择器
- 检查选择器后面的确切元素
- 捕获元素和周围的 DOM 上下文
- 保存元素屏幕截图或整页屏幕截图
- 复制元素的 JavaScript 路径
- 将捕获保存在本地或将其同步到您的工作区
当您需要 CSS 选择器查找器、CSS 选择器生成器或 CSS 选择器 Chrome 扩展来进行浏览器测试和测试自动化时，请使用 CSS 选择器和 XPath 查找器。
XPath 查找器和生成器
选择一个元素以查找、生成和复制其 XPath。
- 为任何网页上的元素生成 XPath
- 复制 XPath 用于 Playwright 或 Selenium 测试
- 将元素的 XPath 与其 CSS 选择器进行比较
- 检查 XPath 背后的 DOM 结构
- 使用定位器之前检查页面上下文
- 保留失败元素的屏幕截图和技术证据
使用该扩展作为 XPath 查找器、XPath 生成器或 XPath 帮助器来进行自动化浏览器测试。
剧作家定位器和选择器
在进行自动化测试之前检查元素并审查定位器。
- 根据确切的页面元素查看剧作家定位器
- 复制用于 Playwright 测试的 CSS 选择器
- 将捕获的 XPath 与 Playwright 一起使用
- 检查剧作家选择器的稳定性
- 识别从动态页面属性生成的脆弱选择器
- 调查部署后停止匹配的定位器
- 保留失败测试步骤周围的页面状态
- 为 QA 和工程提供相同的元素参考
与记录浏览器操作并生成测试代码的 Playwright Codegen 不同，CSS Selector 和 XPath Finder 专注于检查单个元素、检查定位器稳定性并保留它们周围的技术上下文。
当您想要生成的浏览器流程以及对定位器选择和故障证据的更紧密控制时，请结合使用这两种工具。
Selenium CSS 选择器和 XPath
在 Selenium 测试和浏览器自动化中使用捕获的定位器。
- 从任何元素复制 Selenium CSS 选择器
- 生成并复制 Selenium XPath
- 在选择定位器之前比较 CSS 选择器和 XPath
- 当 Selenium 定位器停止匹配时检查元素
- 捕获失败的 Selenium 测试的屏幕截图和 DOM 上下文
- 与其他测试人员或开发人员共享确切受影响的元素
浏览器错误报告
选择器标识一个元素，但它不解释浏览器故障之前发生的情况或如何重现它。
当一个问题需要多个操作时，请有意启动错误重放并遵循触发问题的浏览器路径。
错误重播捕获：
- 浏览器交互顺序
- 受影响的页面元素
- CSS 选择器和 XPath
- 元素和整页屏幕截图
- DOM 和页面上下文
- 生成的再现步骤
- 最终浏览器状态
查看证据并将其保存为可重播的测试工件。与 QA、工程、产品或支持人员共享，或将错误报告导出到 Jira 或 Linear。
探索性测试和浏览器测试
在手动 QA、探索性测试、回归测试和浏览器调试期间使用 CSS 选择器和 XPath Finder。
- 检查网站和 Web 应用程序上的确切元素
- 无需手动搜索 DOM 即可查找 CSS 选择器和 XPath
- 记录 UI 回归和间歇性浏览器故障
- 重现错误时捕获技术证据
- 使用准确的重现步骤创建清晰的错误报告
- 为工程提供问题背后的选择器和 DOM 上下文
- 将失败的测试证据交给人工智能编码代理
- 减少 QA 和工程之间的重复澄清
它是如何运作的
1. 选择网页上的一个元素。
2. 复制其 CSS 选择器、XPath 或 JavaScript 路径。
3. 检查选择器的稳定性。
4. 捕获元素、屏幕截图和 DOM 上下文。
5. 使用 Playwright 或 Selenium 中的定位器。
6. 当问题需要完整的浏览器路径时启动 Bug 重放。
7. 重现故障。
8. 查看、保存并共享可重播的测试工件。
当生成的测试需要更稳定的定位器、更清晰的元素上下文或解释步骤失败原因的可重现证据时，请将其与 Playwright Codegen 一起使用。
不仅仅是选择器生成器
CSS 选择器或 XPath 告诉您元素的位置。它不会告诉您页面是否处于预期状态、失败之前发生了什么，或者为什么自动化测试停止工作。
CSS 选择器和 XPath Finder 保留定位器以及受影响的元素、屏幕截图、DOM 上下文和浏览器路径。
工程部门收到的不仅仅是选择器字符串。他们可以看到：
- 哪个元素受到影响
- 它出现在页面上的位置
- 哪个选择器识别了它
- 失败之前发生了什么操作
- 如何重现问题
不仅仅是屏幕录像机
Bug 重放是有意的 QA 捕获，而不是被动的会话重放。
您可以决定何时开始记录、重现问题、查看证据并仅共享相关的浏览器上下文。
与基本的屏幕录像机不同，每次重播都保持与受影响的页面元素和选择器的连接。工程获得了精确的元素、技术背景和再现路径，而不仅仅是视频。
共享可重播的测试工件
登录以将捕获同步到您的工作区并与您的团队共享。
而不是发送：“我认为这是受影响的元素。”
发送：“这是确切的元素。这是它的 CSS 选择器、XPath、屏幕截图、DOM 上下文以及重现失败的浏览器路径。”
找到元素。复制 CSS 选择器或 XPath。检查定位器。记录一下浏览器的bug。为工程提供重现和修复问题所需的证据。