React

Testing Commands

Test React components with Jest, Vitest, and React Testing Library. Write unit tests, integration tests, and snapshot tests for reliable UI components.

8 commands

Pro Tips

Prefer 'getByRole' over 'getByTestId' in React Testing Library — tests user experience, not implementation.

Use Vitest for Vite projects: 'vitest' is pre-configured to work with Vite's config and transforms.

Use 'screen.debug()' to print the current DOM in tests — invaluable for debugging query failures.

Common Mistakes

Avoid testing implementation details like state values. Test what the user sees and interacts with.

Snapshot tests are easy to write but easy to blindly update. Review snapshot changes as carefully as code changes.

Commands

Run Jest tests

$ jest

Run all Jest tests once.

Jest watch mode

$ jest --watch

Run tests in watch mode.

Jest with coverage

$ jest --coverage

Run tests with coverage report.

Update snapshots

$ jest --updateSnapshot

Update Jest snapshots.

Run Vitest

$ vitest

Run Vitest in watch mode (Vite projects).

Vitest run once

$ vitest run

Run Vitest tests once.

Vitest with coverage

$ vitest run --coverage

Run Vitest with coverage.

Vitest UI

$ vitest --ui

Run Vitest with interactive UI.