Playwright Test Coverage

A Playwright extension that collects code coverage from running end-to-end tests. Assumes that code has been instrumented with babel-plugin-istanbul during the build process.

The coverage files are saved per test case attempt.

Acknowledgement

This package is a fork of the playwrigh-test-coverage.

The difference from the original package is in the way the output coverage files are structured:

.
├── .nyc_output # Default output directory (if `ISTANBUL_TEMP_DIR` is not set)
│ ├── projectName # Directory for each project (e.g., "project" or specified project name)
│ │ ├── testId-retry1 # Coverage data directory for a specific test and retry attempt
│ │ | ├── uuid1.json # Coverage data file for a generated by the test file in the retry attempt
│ │ | ├── uuid2.json
│ │ | └── ...
│ │ ├── testId-retry1.json # Merged coverage data from all files for a specific test and retry attempt
│ │ └── ...
└── ...

Prerequisites

• Playwright test framework
• babel-plugin-istanbul plugin
• nyc for running tests

npm i -D @playwright/test babel-plugin-istanbul nyc

Installation

npm i -D @vcaisim/playwright-test-coverage

Usage

Write your Playwright tests as usual, except require test and expect from this package as follows:

// tests/foo.spec.js
const { test, expect } = require("@vcaisim/playwright-test-coverage");

// Use test and expect as usual
test("basic test", async ({ page }) => {
  await page.goto("https://playwright.dev/");
  const title = page.locator(".navbar__inner .navbar__title");
  await expect(title).toHaveText("Playwright");
});

Then, instrument your front end source code for coverage using the babel-plugin-istanbul plugin.

Finally, run your server via nyc to capture code coverage. For more details see istanbul/nyc.

Options

• ISTANBUL_TEMP_DIR - Set this environment variable to specify where Istanbul coverage files should be output. Defaults to $CWD/.nyc_output.

License

MIT