What are the pitfalls of snapshot testing?

Snapshots are easy to create and easy to ignore. The failure mode is a huge diff that a developer accepts because the update is faster than understanding it. At that point the snapshot still passes but no longer expresses intent.

The usual problems

• A whole page snapshot changes whenever any child changes
• Generated class names, timestamps or IDs create noisy diffs
• One large snapshot hides which specific behaviour regressed
• Reviewers approve an updated snapshot without reading it
• Obsolete snapshots remain after the component changes

test("shows the total", () => {
  render(<Invoice total={120} />);

  expect(screen.getByTestId("total")).toHaveTextContent("$120.00");
});

Keep snapshots narrow: serialize one small component or one payload, not a whole route. Use property matchers or a custom serializer to replace unstable values. Prefer inline snapshots for short output, because they sit next to the test and are harder to update unnoticed.