跳到主要内容

追踪查看器

引言​

Playwright 追踪查看器是一个 GUI 工具，它允许您探索录制的 Playwright 测试追踪，这意味着您可以来回查看测试中的每个操作，并直观地了解每个操作期间发生了什么。

您将学习

录制追踪​

默认情况下，playwright.config 文件将包含为每个测试创建 trace.zip 文件所需的配置。追踪设置为在 on-first-retry 时运行，这意味着它们将在失败测试的第一次重试时运行。此外，在 CI 上运行时 retries 设置为 2，在本地运行时设置为 0。这意味着追踪将在失败测试的第一次重试时记录，但不会在第一次运行和第二次重试时记录。

playwright.config.ts
import { defineConfig } from '@playwright/test';
export default defineConfig({
  retries: process.env.CI ? 2 : 0, // set to 2 when running on CI
  // ...
  use: {
    trace: 'on-first-retry', // record traces on first retry of each test
  },
});

要了解有关录制追踪的可用选项的更多信息，请查看我们关于追踪查看器的详细指南。

追踪通常在持续集成 (CI) 环境中运行，因为您可以在本地使用UI 模式来开发和调试测试。但是，如果您想在不使用UI 模式的情况下在本地运行追踪，您可以使用 --trace on 强制开启追踪。

npx playwright test --trace on

打开 HTML 报告​

HTML 报告显示了所有已运行测试的报告，包括在哪些浏览器上运行以及运行了多长时间。测试可以按通过、失败、不稳定或跳过进行过滤。您还可以搜索特定的测试。点击测试将打开详细视图，您可以在其中查看有关测试的更多信息，例如错误、测试步骤和追踪。

npx playwright show-report

打开追踪​

在 HTML 报告中，点击测试名称文件名称旁边的追踪图标，直接打开所需测试的追踪。

playwright html report

您也可以点击打开测试的详细视图，向下滚动到 'Traces' 标签页，然后点击追踪截图打开追踪。

playwright html report detailed view

要了解有关报告器的更多信息，请查看我们关于报告器的详细指南，包括 HTML 报告器。

查看追踪​

通过点击或使用时间线悬停来查看测试的追踪，并查看操作前后页面的状态。检查测试每一步中的日志、源、网络、错误和控制台。追踪查看器会创建一个 DOM 快照，因此您可以与其完全交互并打开浏览器 DevTools 来检查 HTML、CSS 等。

playwright trace viewer

要了解有关追踪的更多信息，请查看我们关于追踪查看器的详细指南。

下一步​