@testrelic/playwright-analytics

The main package that provides a custom Playwright reporter and enhanced test fixture for capturing navigation timelines and test analytics.

Features

Reporter

The custom reporter collects comprehensive test data including:

• Test results (pass/fail/flaky/skipped)
• Execution timing and duration
• Failure diagnostics with code snippets
• Network request statistics
• CI environment metadata
• Navigation timeline reconstruction

Fixture

The enhanced test fixture extends Playwright's default page fixture to automatically track:

• Page navigations (goto, link clicks, browser navigation)
• SPA route changes
• Hash changes
• Navigation timing
• Network requests per navigation

Installation

npm install @testrelic/playwright-analytics

Configuration

Add the reporter to your playwright.config.ts:

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

export default defineConfig({
  reporter: [
    ['list'],
    ['@testrelic/playwright-analytics', {
      outputPath: './test-results/analytics-timeline.json',
      includeStackTrace: true,
      includeCodeSnippets: true,
      includeNetworkStats: true,
    }],
  ],
});

See the Configuration page for all available options.

Usage in Tests

Import the test fixture instead of the default Playwright test:

import { test, expect } from '@testrelic/playwright-analytics/fixture';

test('example test', async ({ page }) => {
  // Navigation tracking happens automatically
  await page.goto('https://example.com');
  
  // All interactions are tracked
  await page.click('a[href="/about"]');
  
  // Assertions work as normal
  await expect(page.locator('h1')).toHaveText('About Us');
});

The fixture is fully compatible with Playwright's API — you don't need to change your existing tests.

CLI Tools

The package includes a CLI for merging shard reports:

npx testrelic merge shard-1.json shard-2.json -o merged.json

See Merging Shard Reports for details.

API Reference

Programmatic Report Merging

import { mergeReports } from '@testrelic/playwright-analytics/merge';

await mergeReports(
  ['shard-1.json', 'shard-2.json'],
  { output: 'merged-report.json' }
);

Types

The package exports TypeScript types for the report schema:

import type { 
  AnalyticsReport,
  TimelineEntry,
  TestResult,
  NetworkStats 
} from '@testrelic/playwright-analytics';