@spaguettiscope/playwright-reporter

Playwright reporter for SpaguettiScope — writes test results to .spasco/results/ in the native SpaguettiScope format.

Installation

npm install --save-dev @spaguettiscope/playwright-reporter
# or
pnpm add -D @spaguettiscope/playwright-reporter

Peer dependency: @playwright/test >= 1.40.0 must be installed.

Usage

Add the reporter to your playwright.config.ts:

import { defineConfig } from '@playwright/test'

export default defineConfig({
  reporter: [['list'], ['@spaguettiscope/playwright-reporter']],
})

With options

export default defineConfig({
  reporter: [
    ['list'],
    [
      '@spaguettiscope/playwright-reporter',
      {
        outputDir: '.spasco/results', // relative to workspace root (default)
        workspaceRoot: '../..', // override workspace root detection
      },
    ],
  ],
})

Options

| Option | Type | Default | Description | | --------------- | -------- | ----------------- | ----------------------------------------------------------------------------------------------------------------------- | | outputDir | string | .spasco/results | Directory for results, relative to workspace root | | workspaceRoot | string | auto-detected | Override workspace root (walks up looking for pnpm-workspace.yaml, turbo.json, or package.json with workspaces) |

Output format

Each test run produces a directory under .spasco/results/{runId}/:

.spasco/results/
  2024-01-15T12-00-00-a1b2c3/
    meta.json          # run metadata (tool, version, git info, CI info)
    results/
      <testCaseId>.json  # one file per test case

The meta.json includes "tool": "playwright" so the SpaguettiScope dashboard can distinguish runs from different test tools.

Monorepo setup

In a monorepo, the reporter automatically detects the workspace root by walking up from Playwright's rootDir. You typically don't need to configure anything:

// apps/web/playwright.config.ts
export default defineConfig({
  reporter: [['@spaguettiscope/playwright-reporter']],
  // results go to <workspace-root>/.spasco/results/
})

If auto-detection fails, set workspaceRoot explicitly:

export default defineConfig({
  reporter: [['@spaguettiscope/playwright-reporter', { workspaceRoot: '../../' }]],
})

Integration with spasco dashboard

After running your Playwright tests, generate the SpaguettiScope dashboard:

spasco dashboard

Make sure your spasco.config.json includes a connector pointing at the results directory:

{
  "dashboard": {
    "connectors": [{ "id": "spasco", "resultsDir": ".spasco/results" }]
  }
}