Playwright Report for CI and Local Runs

Playwright reports turn raw test output into clear, actionable insights for CI and local runs. This guide covers HTML and JSON reporting, CI best practices, and faster failure debugging.

Playwright

TestDino Team

Dec 27, 2025

Automated testing only delivers real value when teams clearly understand what happened during every run, and that understanding comes from a well-structured Playwright report.

A clear Playwright test report acts as the bridge between raw test execution and confident release decisions, helping teams quickly identify whether failures are real regressions or test noise.

Strong Playwright reporting, especially when using the Playwright HTML reporter and Playwright JSON report, reduces noise, improves test result visualization, and accelerates failed test debugging across QA and development teams.

In this guide, we show how to generate and optimize Playwright reports for local and CI runs to enable faster, more reliable releases.

What is a Playwright report?

A Playwright report includes critical execution details, such as pass/fail status, test duration, browser coverage, retries, and rich artifacts like screenshots, videos, and traces.

Playwright reports display test status indicators for each test case, such as 'passed,' 'failed,' ‘flaky,’ or 'skipped,' making it easy to interpret outcomes at a glance.

Why does It Matter?

This Playwright test report serves as reliable test evidence and a shared source of truth for QA engineers, developers, test leads, and other stakeholders across the release cycle.

A well-configured Playwright test report, especially when using the Playwright HTML reporter and Playwright JSON report, directly improves software quality by increasing visibility, speeding up debugging, and strengthening CI/CD decision-making.

Understanding Playwright test automation reports

Playwright provides multiple default reporters designed to support different testing and reporting use cases. These include the Playwright HTML reporter, Playwright JSON report, and lightweight console-based reporters used during local and CI runs.

Each Playwright report type offers a different level of test result visualization, automation, and integration, allowing teams to choose the right Playwright test report format based on their workflow and CI/CD needs.

Default Playwright report types: HTML report and more

Playwright ships with several built-in reporters that cover both human-readable and machine-consumable reporting requirements:

Playwright HTML reporter for rich visual debugging, screenshots, videos, and trace viewer access
Playwright JSON report for structured, machine-readable output used in analytics and custom reporting
Line, dot, and list reporters for fast terminal feedback during local execution

The Playwright HTML reporter is used by over 70% of teams because of its clarity and ease of debugging.

Where reports fit in the Playwright workflow

Playwright reports are generated immediately after test execution and stored in the artifacts folder. CI pipelines, dashboards, and automated test analytics tools consume these outputs.

A consistent Playwright report folder structure ensures traceability, auditability, and reliable access to Playwright test reports across local runs and CI environments.

The diagram below shows how Playwright reports fit into the CI/CD pipeline, connecting test execution results directly to critical release decisions.

How to generate Playwright reports

Generating a Playwright report is a straightforward process, but following the right steps ensures consistent and CI-ready Playwright test reports for both local and automated runs.

Step 1: Install Playwright and initialize tests

First, make sure Playwright is installed and initialized in your project. This sets up the default test runner and configuration needed for reporting.

terminal

                                                    npm init playwright@latest                                                

This command creates the basic Playwright setup, including the default playwright.config.ts file where Playwright report configuration is defined.

Step 2: Run tests with the default reporter

By default, Playwright generates a simple console-based report. This is useful for quick feedback but limited for debugging.

terminal

                                                    npx playwright test                                                

At this stage, you get basic pass or fail output, but no rich Playwright HTML report or structured Playwright JSON report.

Step 3: Generate a Playwright HTML report from the CLI

To generate a visual Playwright HTML reporter output, run tests with the HTML reporter enabled.

terminal

                                                    npx playwright test --reporter=html                                                

This command creates a Playwright report inside the playwright-report folder. You can open the report locally to view test results, screenshots, videos, and traces.

Step 4: Configure reporters in playwright.config.ts

For consistent reporting across local and CI runs, configure reporters in

playwright.config.ts

                                                    import { defineConfig } from '@playwright/test';
export default defineConfig({
  reporter: [
    ['html', { open: 'never' }],
    ['json', {`outputFile: './playwright-report/report.json'`}]
  ],
});                                                

This setup generates both a Playwright HTML report and a Playwright JSON report, enabling visual debugging and automation-friendly output.

Step 5: Run Tests and Verify Report Output

Run your Playwright tests again after configuration.

terminal

                                                    npx playwright test                                                

Verify that the Playwright test report HTML output is generated in the configured folder and that the JSON file contains structured test results.

Step 6: Store Reports as CI Artifacts

In CI environments, ensure the Playwright report folder is stored as an artifact. This allows teams to download and review test results after the pipeline completes.

This step ensures Playwright reports remain accessible for debugging, auditing, and team collaboration across CI/CD pipelines.

Customizing Your Playwright Reports with Custom Reporters

Many teams extend Playwright reporting using third-party tools or custom integrations to go beyond basic HTML output. These enhancements improve test result visualization, enable automated test analytics, and provide deeper test run insights across CI and local runs.

Customization allows teams to adapt each Playwright report to their workflow, whether the goal is long-term trend analysis, compliance reporting, or advanced debugging for failed tests.

Playwright Allure Report Setup

The Playwright allure report is a popular choice for teams that need historical visibility across multiple runs. Allure provides interactive dashboards, test summaries, timelines, and trend analysis built on top of Playwright results.

Organizations report up to a 25% reduction in flaky tests after adopting Allure reporting, primarily due to improved visibility into failure patterns and retries.

Integrating Allure with Playwright test reports helps teams move from reactive debugging to proactive quality management.

Custom Playwright Report Solutions

Some teams build a Playwright custom report using the Playwright JSON report as the data source.

This approach is ideal for organizations with branding, compliance, or security requirements that standard reporters cannot meet.

Custom Playwright reports enable deep integration with internal dashboards, CI systems, and automated test analytics platforms, turning raw test data into actionable insights tailored to the organization’s needs.

Optimizing Playwright Reports for CI/CD Test Execution

CI environments introduce unique challenges such as parallel execution, ephemeral runners, and limited storage. Proper Playwright report configuration ensures that Playwright test reports remain reliable, accessible, and actionable across CI pipelines.

Industry data shows that over 80% of CI failures are diagnosed using test reports rather than raw logs, highlighting the importance of clear and consistent Playwright reporting in CI/CD workflows.

Merging Playwright Reports in CI

Parallel test execution significantly improves CI speed, but it also fragments results across multiple shards, browsers, and runners. Merging Playwright reports brings all execution data together into a single, unified Playwright test report for faster and more reliable analysis.

Why merging Playwright reports is important in CI:

Consolidates results from parallel shards into one report
Provides a single Playwright HTML report for the entire pipeline
Simplifies failure analysis across browsers and environments
Improves visibility for QA, developers, and CI stakeholders

How Playwright report merging works:

Each CI shard generates a partial report using the blob reporter
All shard outputs are collected after test execution
Playwright merges these blobs into one complete report

Step-by-step approach to merging Playwright reports in CI:

1. Configure the blob reporter in your Playwright report configuration

2. Run Playwright tests in parallel across shards or browsers

3. Collect blob report outputs from each CI runner

4. Use Playwright’s merge command to generate a unified Playwright HTML reporter output

This approach ensures that even in highly parallelized CI environments, teams get a single, accurate Playwright test report that reflects the full test run.

From Playwright Reports to Actionable Insights with TestDino

TestDino elevates Playwright reporting from static outputs to actionable intelligence. TestDino transforms raw Playwright test reports into an interactive web dashboard that provides clarity across CI and local runs.

Teams using AI-assisted reporting resolve failures up to 35% faster by reducing manual triage and surfacing meaningful insights early.

TestDino:

TestDino is a Playwright test reporting and analytics platform that turns raw test results into an interactive web dashboard. Instead of only reading a console log or opening a local HTML file, your team can view test runs, failures, screenshots, and AI insights in one place.

Prerequisites

Before you add TestDino to your project, make sure you have:

A working Playwright test project
Node.js is installed on your machine or CI runner
A TestDino account
At least one project was created in TestDino
A project token for that TestDino project

You will use this token with the tdpw CLI. Treat it like a password and do not commit it to Git.

Step 1: Install and Check the TestDino CLI

TestDino provides a CLI tool called tdpw to upload reports and work with test history. You don’t need to install it globally; you can call it with npx.

terminal

                                                    # Show TestDino CLI help
npx tdpw --help
                                                

This command confirms the CLI is available and ready to upload Playwright reports.

Step 2: Configure Reporters in Playwright

TestDino works with the Playwright JSON report. Add the following reporter configuration to your existing playwright.config.js or playwright.config.ts.

playwright.config.ts or playwright.config.js

                                                    reporter: [
  // Mandatory reporter for JSON results
  ['json', { outputFile: './playwright-report/report.json' }],
  // Optional, enables native HTML upload
 ['html', { open: 'never' }],`
],
                                                

This setup:

Writes a JSON report to ./playwright-report/report.json
Writes the Playwright HTML report and assets into ./playwright-report

The JSON file is what tdpw reads during upload, and the HTML folder provides screenshots and the full Playwright HTML reporter output.

Step 3: Run Tests Locally

Run your tests as usual using Playwright. The configuration automatically generates the report folder and files.

terminal

                                                    npx playwright test                                                

This produces a complete Playwright test report with JSON and HTML output.

Step 4: Upload Reports from Your Machine

To send reports to TestDino, run the upload command with your report directory and project token.

terminal

                                                    npx --yes tdpw ./playwright-report --token"your-token" --upload-html                                                

--token="your-token" is your project token from the TestDino UI
--upload-html uploads HTML assets like screenshots and attachments

Step 5: Upload Reports from CI

In CI, uploads should run automatically after tests are complete. Store the token as a secret (for example, TESTDINO_TOKEN) and reference it in your workflow.

yaml

                                                    name: Playwright Tests
on:
  push:
  workflow_dispatch:

jobs:
  test:
    runs-on: ubuntu-latest
    container: mcr.microsoft.com/playwright:latest

    env:
      TESTDINO_TOKEN: ${{ secrets.TESTDINO_TOKEN }}

    steps:
      - uses: actions/checkout@v4

      - uses: actions/setup-node@v4
        with:
          node-version: '22.x'

      - name: Install dependencies
        run: |
          npm ci
          npx playwright install --with-deps

      - name: Run tests
        run: npx playwright test

      - name: Upload to TestDino Reporter
        if: always()
        run: npx --yes tdpw ./playwright-report --token="${{ secrets.TESTDINO_TOKEN }}" --upload-html
                                                

Key points:

The upload runs after npx playwright test
if: always() ensures reports upload even if tests fail
The same CLI command works across different CI tools

Step 6: View Results in the TestDino Dashboard

Once uploads are complete, open the TestDino web app and navigate to your project’s Test Runs. You will see:

A list of recent runs with pass or fail counts and total duration
Filters for branches, authors, or environments
Each run expanded into a list of test cases with status and timing

Clicking a failed test shows:

Error message and stack trace
Screenshots captured at failure
Links to traces if enabled in Playwright
AI hints that help separate real bugs from flaky tests or environment issues

Over time, this provides a single place to understand what failed, why it failed, and how often it happens.

With this setup, TestDino integrates directly into your existing Playwright reporting workflow while keeping npx playwright test unchanged.

Troubleshooting Common Playwright Reporting Issues

Even mature automation setups encounter Playwright reporting issues over time. Common problems include missing artifacts, empty Playwright test reports, or incomplete Playwright HTML reporter output in CI.

In most cases, these failures are caused by incorrect Playwright report configuration, path mismatches between local and CI environments, or insufficient CI permissions.

Fixing Missing or Empty Playwright Reports

When a Playwright report is missing or empty, start by validating the basics and eliminating silent failures early.

When a Playwright report is missing or empty, start by validating the basics and eliminating silent failures early.
Verify the Playwright HTML reporter and Playwright JSON report output paths in playwright.config.ts
Confirm CI pipelines explicitly upload Playwright test report artifacts
Check file system permissions on CI runners for report directories
Validate that parallel jobs correctly merge Playwright reports when sharding is enabled

Early validation of Playwright reporting prevents silent CI failures and ensures reliable test result visualization for debugging and audits.

Best Practices for Playwright Reporting

Best Practice	Why It Matters	Playwright Reporting Impact
Standardize Playwright report configuration	• Ensures consistency across local and CI runs • Avoids environment-specific mismatches	• Reliable Playwright test report output • Predictable Playwright HTML reporter behavior
Enable JSON and HTML reporters together	• JSON supports automation and analytics • HTML supports visual debugging	• Full Playwright JSON report for tools • Rich Playwright HTML report for teams
Retain artifacts on test failure	• Screenshots explain UI issues • Traces show step-by-step execution	• Strong Playwright test report evidence • Faster failed test debugging
Use retries only in CI environments	• Separates flaky tests from real failures • Avoids hiding bugs locally	• Cleaner CI test reports • Better flake detection
Merge Playwright reports in parallel runs	• Parallel shards fragment results • Browsers report separately	• Unified Playwright report • Accurate cross-browser coverage
Publish Playwright HTML reports as CI artifacts	• No need to rerun tests • Easy access for all roles	• Faster triage using Playwright HTML reporter
Track results across multiple runs	• Single runs lack historical context • Trends reveal instability	• Better Playwright reporting best practices • Improved test stability
Validate report paths and permissions early	• Prevents empty reports • Avoids silent CI failures	• Reliable Playwright report configuration

Conclusion

Playwright reporting is a critical part of modern test automation, connecting raw execution data to confident release decisions.

A well-configured Playwright report with HTML and JSON output improves visibility, reduces debugging time, and ensures every Playwright test report clearly communicates pass, fail, and test evidence.

As teams scale Playwright in CI/CD, following Playwright reporting best practices and using analytics-driven tools transforms reporting from reactive troubleshooting into proactive quality control. With the right Playwright report configuration, teams spend less time chasing failures and more time shipping reliable software.

Use TestDino to instantly turn Playwright test reports into clear, actionable CI insights. 🚀

FAQs

A Playwright test report summarizes test results from Playwright runs, including pass/fail status, duration, screenshots, and browser coverage.
Reports can be generated in HTML, JSON, or custom formats to help QA, developers, and managers quickly analyze test outcomes.

Table of content

Playwright Report for CI and Local Runs

What is a Playwright report?

Why does It Matter?

Understanding Playwright test automation reports

Default Playwright report types: HTML report and more

Where reports fit in the Playwright workflow

How to generate Playwright reports

Step 1: Install Playwright and initialize tests

Step 2: Run tests with the default reporter

Step 3: Generate a Playwright HTML report from the CLI

Step 4: Configure reporters in playwright.config.ts

Step 5: Run Tests and Verify Report Output

Step 6: Store Reports as CI Artifacts

Customizing Your Playwright Reports with Custom Reporters

Optimizing Playwright Reports for CI/CD Test Execution

Merging Playwright Reports in CI

From Playwright Reports to Actionable Insights with TestDino

Troubleshooting Common Playwright Reporting Issues

Fixing Missing or Empty Playwright Reports

Conclusion

FAQs

Get started fast

The Ultimate Guide to Playwright MCP in 2026

How to install Playwright MCP on VS Code

How to install Playwright MCP on Cursor

Playwright Report for CI and Local Runs

What is a Playwright report?

Why does It Matter?

Understanding Playwright test automation reports

Default Playwright report types: HTML report and more

Where reports fit in the Playwright workflow

How to generate Playwright reports

Step 1: Install Playwright and initialize tests

Step 2: Run tests with the default reporter

Step 3: Generate a Playwright HTML report from the CLI

Step 4: Configure reporters in playwright.config.ts

Step 5: Run Tests and Verify Report Output

Step 6: Store Reports as CI Artifacts

Customizing Your Playwright Reports with Custom Reporters

Optimizing Playwright Reports for CI/CD Test Execution

Merging Playwright Reports in CI

From Playwright Reports to Actionable Insights with TestDino

Troubleshooting Common Playwright Reporting Issues

Fixing Missing or Empty Playwright Reports

Conclusion

FAQs

Get started fast

The Ultimate Guide to Playwright MCP in 2026

How to install Playwright MCP on VS Code

How to install Playwright MCP on Cursor

Join our waitlist