This is a monorepo for writing tests with file snapshots, providing integrations for different testing libraries.
File snapshots are stored in two directories: validationDir and outputDir. validationDir contains the golden masters which should be under version control. outputDir contains the snapshots from the latest test run.
By default, the directories are located under /data/test/validation and /data/test/output.
Using two directories to store snapshots enables diffing using directory comparison. This gives fine-grained control when updating snapshots and facilitates features like detecting unused snapshots.
When no validation file exists for a file snapshot, a new validation file is created containing a marker in the first line:
===== missing file =====
This explicitly marks the file as new. To use the snapshot as validation file:
- Remove the marker line from the file
- Add the file to version control
Each test run generates new file snapshots in outputDir. Differences can be viewed using directory comparison.
If a file snapshot changed intentionally:
- Apply the changes to the validation files
- Commit the changed validation file to version control
Since validation files are named after the test, you can navigate to a validation file by using file search with the test title (e.g. Ctrl + Shift + N in IntelliJ)
When regularly switching between branches with changed validation files, it can be helpful to clear the output directory. Otherwise, updated validation files will appear in the diff even though they did not change in the current branch.
Unused validation files are validation files from tests which no longer exist, e.g. because the test was renamed or deleted. To avoid confusion, unused validation files should always be deleted.
Effectively working with file snapshots requires a tool which supports comparing directories. We can recommend the following tools:
- Validation-File Comparison Plugin for IntelliJ IDEs (does not yet support frontend monorepos)
- Meld
This monorepo uses Turborepo as build system to manage task dependencies and enable task caching.
| Command | Description |
|---|---|
pnpm turbo check |
Runs code checks, including TypeScript compilation, linting, formatting and tests |
pnpm turbo fix |
Applies automatic fixes, including linting and formatting |
pnpm turbo build |
Runs the build |
pnpm turbo ci |
Runs all tasks required for CI, including checks and builds |
To run tasks for a specific package only, use filters:
pnpm turbo --filter=@cronn/playwright-file-snapshots check