@testrelic/playwright-analytics

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

What does this package include?

What does the reporter capture?

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

What does the fixture track?

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

How do I install it?

For AI agents

Set up with an AI assistant

AI Prompt — Install and configure reporter

Install @testrelic/playwright-analytics in this Playwright project.
1. Run: npm install @testrelic/playwright-analytics
2. Add it to playwright.config.ts:
   ['@testrelic/playwright-analytics', {
     outputPath: './test-results/analytics-timeline.json',
     includeStackTrace: true,
     includeCodeSnippets: true,
     includeNetworkStats: true,
   }]
3. In all test files, replace the import:
   FROM: import { test, expect } from '@playwright/test';
   TO:   import { test, expect } from '@testrelic/playwright-analytics/fixture';
Show me the updated config and one updated test file.

---

AI Prompt — Merge shard reports

I have TestRelic shard reports at shard-1.json and shard-2.json.
Use mergeReports from '@testrelic/playwright-analytics/merge' to merge them into merged-report.json.
Write a short Node.js script I can run with: node merge.mjs

For Human

npm install @testrelic/playwright-analytics

How do I configure the reporter?

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.

How do I use the fixture in my tests?

Import the test fixture instead of the default Playwright test:

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

test('example test', async ({ page }) => {
  await page.goto('https://example.com');
  await page.click('a[href="/about"]');
  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.

How do I merge shard reports using the CLI?

The package includes a CLI for merging shard reports:

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

See Merging Reports for details.

How do I merge reports programmatically?

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

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

What does this package export?

The main entry point (@testrelic/playwright-analytics) exports the reporter class used by Playwright's reporter array, along with TypeScript types for the report schema.

Subpath exports:

Subpath	What it provides
@testrelic/playwright-analytics	Reporter class (used in playwright.config.ts)
@testrelic/playwright-analytics/fixture	Enhanced test + expect fixture with navigation tracking
@testrelic/playwright-analytics/api-fixture	testRelicApiFixture for extending API test fixtures
@testrelic/playwright-analytics/merge	mergeReports function for merging shard reports

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

// Import for programmatic shard merging
import { mergeReports } from '@testrelic/playwright-analytics/merge';