Skip to content

Commit 910da57

Browse files
authored
docs: refresh README with relevance notes (#32)
Adds a "verified with" line so readers can see the stack was refreshed, explains why this repo's Istanbul-based approach is preferred over Playwright's built-in V8 coverage (Chromium-only, hard to merge, needs source-map post-processing), notes that vite-plugin-istanbul v9 requires Vite >=7 and is ESM-only (hence vite.config.mts), and clarifies that the create-react-app branch is an archived reference since CRA is no longer maintained.
1 parent 1d6d8c0 commit 910da57

1 file changed

Lines changed: 14 additions & 2 deletions

File tree

README.md

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,21 @@
55

66
This example demonstrates how to use [vite-plugin-istanbul](https://github.com/ifaxity/vite-plugin-istanbul) to collect coverage data during runtime with your end-to-end tests which will be stored on the filesystem. When applying the shown parts, you are able to view the coverage report e.g. as HTML, or convert it to the `lcov` format for upload to [Coveralls](https://coveralls.io/) or other similar providers. In this example, we are using GitHub Actions to run the tests and upload them to Coveralls.
77

8+
Verified with: React 19, Vite 8, TypeScript 6, Playwright 1.60, `vite-plugin-istanbul` 9, `nyc` 18.
9+
10+
## Why not Playwright's built-in coverage?
11+
12+
Playwright exposes [`page.coverage`](https://playwright.dev/docs/api/class-coverage) which wraps Chromium's V8 coverage. That works for a single Chromium page but has limitations for app-level e2e coverage:
13+
14+
- It is Chromium-only — no Firefox or WebKit.
15+
- It produces V8 coverage that is awkward to merge across tests and runs.
16+
- Source maps need to be applied manually (e.g. via `v8-to-istanbul`) to get per-file line/branch numbers that match your source.
17+
18+
The Istanbul approach in this repo instruments the source at build time, so coverage is collected the same way in every browser, merges cleanly across tests, and reports against your original source files out of the box.
19+
820
## Prerequisites
921

10-
- The web application which you are using needs to have [`vite-plugin-istanbul`](https://github.com/ifaxity/vite-plugin-istanbul) configured during the build process.
22+
- The web application which you are using needs to have [`vite-plugin-istanbul`](https://github.com/ifaxity/vite-plugin-istanbul) configured during the build process. `vite-plugin-istanbul` v9 requires Vite ≥7 and is ESM-only, so the Vite config in this repo lives at `vite.config.mts`.
1123
- It's recommended to only enable it during end-to-end testing, for example by checking a variable to determine if it should be enabled.
1224
- You could also add it only when the dev server `NODE_ENV=development` is used.
1325

@@ -37,4 +49,4 @@ See this version in the [`ct-react-vite`](https://github.com/mxschmitt/playwrigh
3749

3850
## Using create-react-app / Webpack
3951

40-
See this archived version in the [`create-react-app`](https://github.com/mxschmitt/playwright-test-coverage/tree/create-react-app) branch.
52+
Create React App is no longer maintained — new projects should use Vite (this branch) or another modern toolchain. An archived reference of the CRA setup is preserved in the [`create-react-app`](https://github.com/mxschmitt/playwright-test-coverage/tree/create-react-app) branch but is not kept up to date.

0 commit comments

Comments
 (0)