Playwright Test Report Viewer

To open the latest Playwright HTML report, run this in your project directory:

npx playwright show-report

To open a report stored in another folder, pass its path:

npx playwright show-report my-report

Playwright serves the report locally and normally opens it in your browser. The default HTML reporter output folder is playwright-report. The report is a run-level summary; use a trace to inspect the exact actions, page state, network activity, and console output from a failed test. See the Playwright reporter documentation and HTML report guide for version-specific details.

Open a Playwright test report

1. Run the tests with the HTML reporter

The HTML reporter can be selected on the command line:

npx playwright test --reporter=html

After the run, Playwright writes the self-contained report to playwright-report unless you configure another directory.

2. Serve and view the report

npx playwright show-report

Use a path when the report is elsewhere:

npx playwright show-report path/to/playwright-report

You can set the host and port when serving it:

npx playwright show-report --host 127.0.0.1 --port 8080

A downloaded ZIP archive can also be supplied when index.html is at the archive’s top level:

npx playwright show-report report.zip

Playwright extracts the archive to a temporary directory and serves the report.

What the HTML report contains

The report organizes one test run. It includes:

Tests grouped by project, file, and suite.
Browser and project information.
Pass, fail, flaky, and skipped results.
Test durations and searchable test names.
Per-test errors, steps, screenshots, videos, and other attachments when they were captured.
Links to available traces.

Select a test to open its detail view. Start with the error and action list, then open an attachment or trace when the summary does not explain the failure.

HTML report configuration

Configure the reporter in playwright.config.ts when you want consistent behavior in local runs and CI:

import { defineConfig } from '@playwright/test';

export default defineConfig({
  reporter: [['html', {
    outputFolder: 'playwright-report',
    open: 'on-failure',
    host: '127.0.0.1',
    port: 9323,
  }]],
});

Reporter options

Option	Purpose	Practical use
`outputFolder`	Directory for generated HTML files and attachments.	Use a stable path that your CI job uploads as an artifact.
`open`	Controls automatic browser opening.	`always`, `never`, or `on-failure`. Use `never` in headless CI.
`host`	Address used by the local report server.	Bind to a loopback address for local-only viewing.
`port`	TCP port used by the server.	Choose a free port when another process uses the default.

The reporter guide also documents the PLAYWRIGHT_HTML_OUTPUT_DIR environment variable. Check the reporter options against the Playwright version installed in your project, because defaults and available settings are version-sensitive.

Disable automatic opening

import { defineConfig } from '@playwright/test';

export default defineConfig({
  reporter: [['html', { open: 'never' }]],
});

Then open the report explicitly with npx playwright show-report. This keeps CI jobs from trying to launch a desktop browser.

View a trace from a failed test

An HTML report summarizes the run. A trace is the detailed execution record for a test. It can show the action sequence, before-and-after page state, source, network requests, errors, and console messages.

Capture traces on the first retry

import { defineConfig } from '@playwright/test';

export default defineConfig({
  retries: 1,
  use: {
    trace: 'on-first-retry',
  },
});

When a test fails and is retried, the trace is attached to the test entry in the HTML report. Open the test details and select the trace link or the Traces tab.

Capture a trace locally

npx playwright test --trace on

Open a saved trace directly with:

npx playwright show-trace path/to/trace.zip

You can also use the browser-based viewer at trace.playwright.dev. Playwright’s documentation says that trace data loaded there stays in the browser and is not transmitted externally.

HTML report versus Trace Viewer

Question	HTML report	Trace Viewer
Did the run pass?	Best starting point; filter passed, failed, flaky, or skipped tests.	Not the primary run summary.
Which test failed?	Search and open the test details.	Open after selecting a specific trace.
What happened step by step?	Shows the action list and attachments.	Shows detailed snapshots, source, network, console, and timing.
Can I inspect a single execution?	Follow its trace attachment.	Yes, from a trace ZIP.

Merge reports from CI shards

Each shard normally creates its own report. For one combined report, use the blob reporter in every shard, collect the blob files in one directory, and merge them after the jobs finish.

Configure the shard jobs

import { defineConfig } from '@playwright/test';

export default defineConfig({
  reporter: [['blob']],
});

Upload each shard’s blob report as a CI artifact, then download all blobs into all-blob-reports.

Merge into one HTML report

npx playwright merge-reports --reporter html ./all-blob-reports

The command creates a standard HTML report in playwright-report, including attachments such as traces and screenshot diffs that were present in the blob reports. The Playwright sharding documentation shows this as the consolidation path for CI workflows.

CI artifact workflow

Run each shard with the blob reporter.
Store each generated blob report as a CI artifact.
Download all shard artifacts into one directory in a merge job.
Run npx playwright merge-reports --reporter html ./all-blob-reports.
Upload the resulting playwright-report directory as the browsable artifact.
Open it later with npx playwright show-report after downloading it.

The CLI serves a report locally; it does not permanently host it. Long-term access depends on how your CI system stores and exposes artifacts.

Common errors and fixes

Symptom	Likely cause	Fix
`command not found: playwright`	The project dependency is not installed or the command is being run outside the project.	Install the project’s Playwright package and run through `npx` from the project directory.
`No report found`	The tests used another reporter, wrote to another directory, or the output was removed.	Run with `--reporter=html`, check `outputFolder` and `PLAYWRIGHT_HTML_OUTPUT_DIR`, then rerun.
The browser does not open	Automatic opening is disabled, the environment is headless, or no desktop browser is available.	Run `npx playwright show-report` manually, or copy the report directory to a machine with a browser.
Port already in use	Another process is listening on the configured port.	Choose another port, for example `npx playwright show-report --port 8080`.
Trace link is missing	No trace was captured for that test or the attachment was omitted during artifact collection.	Enable `trace: 'on-first-retry'` or `--trace on`, and retain attachments in CI.
Merge command finds no blobs	The merge directory is empty, nested incorrectly, or contains incomplete downloads.	Put every shard blob file directly under the directory passed to `merge-reports` and verify artifact downloads.
Report loads without attachments	Only `index.html` was copied; the self-contained folder was not preserved.	Upload and download the complete report directory, including attachment subdirectories.
ZIP cannot be opened	`index.html` is nested below the archive root.	Recreate the ZIP with `index.html` at its top level, or extract it and pass the extracted directory.

Performance, reliability, and storage notes

Keep reports as artifacts: HTML reports and traces can be large, especially when videos, screenshots, and multiple retries are enabled. Apply your CI retention policy to artifacts.
Use retries deliberately: on-first-retry captures diagnostic data when a test first demonstrates a failure without tracing every successful attempt.
Separate summary from diagnosis: Open the HTML report first, then load only the traces needed for investigation.
Make shard merging deterministic: Ensure every shard uploads its blob output even when tests fail, and run the merge job after all shard jobs complete.
Pin and check versions: Reporter option names and defaults should be checked against the installed Playwright version.
Protect sensitive data: Traces and attachments may contain page content, URLs, headers, or test data. Restrict artifact access and retention according to your team’s policy.

Or skip the browser setup

If you need a clean image or PDF of a report page for a ticket, release note, or dashboard, ScreenshotNeo provides a single screenshot API request. It accepts consent banners as a visitor and removes more than 60 known consent platforms, newsletter popups, and chat widgets before capture. Each cleanup step can be turned off.

Only clean shots are billed. Bot checks or CAPTCHAs, blank pages, timeouts, failed loads, and cache hits cost nothing, and the response identifies the result with X-Page-Verdict and X-Billed headers. ScreenshotNeo also provides an MCP server with take_screenshot, get_page_info, and capture_pdf tools for Claude, Cursor, and other MCP clients.

See the ScreenshotNeo API documentation for all capture options.

curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://playwright.dev/docs/test-report-viewer -o shot.webp

import requests
r = requests.get("https://api.screenshotneo.com/v1/shot", params={"access_key": "YOUR_API_KEY", "url": "https://playwright.dev/docs/test-report-viewer"}, timeout=90)
open("shot.webp", "wb").write(r.content)

const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://playwright.dev/docs/test-report-viewer' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);

There are 1,000 screenshots per month free with no card. Paid plans start at $5 for 3,000 shots. Create a free ScreenshotNeo account.

FAQ

How do I open a Playwright test report?

Run npx playwright show-report in the project directory, or pass the report directory as an argument.

How do I view a Playwright HTML report from CI?

Download the complete playwright-report artifact, then run npx playwright show-report path/to/playwright-report locally.

How do I see a trace from a failed Playwright test?

Enable trace: 'on-first-retry' or npx playwright test --trace on, open the HTML report, and select the trace attachment. You can also run npx playwright show-trace path/to/trace.zip.

Can I combine reports from parallel shards?

Yes. Generate blob reports in each shard, collect them, and run npx playwright merge-reports --reporter html ./all-blob-reports.

Does `show-report` host my report permanently?

No. It starts a local server. Permanent access requires storing and serving the report through your CI artifact system or another host.