playwright-timeline-reporter
v0.0.1
Published
Timeline visualization for Playwright workers, tests, and hooks
Readme
Playwright Timeline Reporter
A Playwright reporter that turns execution traces (tests, hooks, fixtures) into a horizontal timeline rendered with Apache ECharts. It is designed to be consumed via npx playwright merge-reports so multiple shards can be combined into a single visualization.
Quick start
- Install the package next to your Playwright config (currently locally via the repo):
npm install playwright-timeline-reporter- Run your usual Playwright suite while emitting blob output (per shard):
npx playwright test --reporter=blob- Merge the blobs and generate the HTML timeline (defaults to
timeline-report/index.html):
npx playwright merge-reports --reporter=playwright-timeline-reporter blob-reportOpen the generated HTML file to inspect worker utilization, long hooks, and fixtures. The legend highlights hooks/fixtures so slow setup/teardown is easy to spot.
Example project
The example/ folder contains a minimal Playwright suite exercising hooks and custom fixtures. After npm install && npm run build in the repo root:
cd example
npm install
npm run test
npm run reportThen open example/timeline-report/index.html in a browser.
