← Recipes

阅读中文版本

Review Snapshot Diffs Before Updating

Configure snapshot tests to fail on mismatch and require a reviewed update flag so blind --update-snapshot does not hide regressions.

~20 mintestingsnapshotsreview

Task

Add npx vitest -u --changed=HEAD to the test suite so regressions are caught automatically on every pull request.

When to use this

A refactor passes existing tests but breaks npx vitest -u --changed=HEAD, shipping a silent regression to users.

Prerequisites

  • A test runner configured (Vitest or Jest)
  • Source code with testable units

Steps

1. Configure npx vitest -u --changed=HEAD in the project configuration file with the recommended defaults.

npx vitest -u --changed=HEAD

Expected output: The configuration is accepted and npx vitest -u --changed=HEAD runs without errors on the first invocation.

2. Run the check locally to verify npx vitest -u --changed=HEAD produces the expected result before pushing.

pnpm test

Expected output: Local run matches CI behavior; no surprises after push.

3. Add the gate to the CI pipeline so npx vitest -u --changed=HEAD blocks merge on failure.

- name: Run add snapshot diff review
  run: pnpm test

Expected output: Pull requests with failing npx vitest -u --changed=HEAD are blocked from merging.

Troubleshooting

Problem

The check passes locally but fails in CI

Solution

Pin dependency versions and the runtime to match CI exactly; reproduce with the same Docker image or act.

Problem

Configuration is rejected with a schema error

Solution

Check the tool version matches the config schema; older versions may not support newer fields.

Limitations

  • The gate only runs on events that trigger the workflow; locally pushed commits bypass it.
  • Configuration drift is possible if someone edits settings outside version control.

Cover the regression path

Start by measuring the problem. Configure snapshot tests to fail on mismatch and require a reviewed update flag so blind –update-snapshot does not hide regressions. The most common mistake is adding the gate without first confirming it catches the issue you care about. Run npx vitest -u –changed=HEAD against the current codebase and inspect the output before wiring it into CI.

npx vitest -u --changed=HEAD

Keep tests maintainable

Once the gate is in place, make failures actionable. A failing npx vitest -u –changed=HEAD should point to the exact file and line, not a generic error. Pin the tool version in the lockfile so a upstream release does not silently change behavior. Review the gate output in every pull request just like a test result.