Playwright Hierarchy Reporter (npm package)

 |  Deliverables

A minimal, custom hierarchical test reporter for Playwright with clean, indented CLI output — inspired by Vitest’s verbose reporter.

This package provides a custom console reporter for Playwright that prints tests in a clear hierarchical structure, omitting repeated prefixes and grouping suites meaningfully by project and file.

📋 Test Run Starting...

[chromium] unit\ExampleTest.test.ts
  Basic Example Test
    Dummy Nested Suite Test
      ✓ Example 1
      ✓ Example 2
    ✓ Should successfully do thing 1
    ✓ Should successfully do thing 2

🧪 Test run finished with status: PASSED

Motivation

The default CLI reporters in Playwright favor compactness but don’t show test hierarchies with meaningful indentation or avoid repetition. This reporter improves the developer experience by making the test structure more legible — especially useful for medium to large test suites.

Key Features

  • Hierarchical CLI output with smart de-duplication of project and file names
  • Project and test file shown inline (e.g. [chromium] tests/example.spec.ts)
  • Clean indentation for nested describe/test structure
  • Zero runtime dependencies
  • Works seamlessly with multi-project Playwright configs

Technical Highlights

  • Built as a Playwright custom reporter
  • Designed for fast feedback and snapshot-based testing
  • Development-tested using Playwright itself to ensure true output
  • Snapshot testing harness included for CLI rendering correctness
  • TypeScript strictly typed implementation with modern config
  • Code linting with ESLint TypeScript rules

GitHub Repo | npm