Profile My skills Saved Collections Edit profile Submit a skill

React Component Testing

Test React components with Testing Library — render, query by role, and assert on user-visible behavior.

alexngai 9fcc8bb 625 B Updated
Web & Frontend

File contents

React Component Testing

Test what the user sees, not implementation details.

  1. render(<Component />) from @testing-library/react.
  2. Query by accessible role: screen.getByRole('button', { name: /save/i }).
  3. Drive interactions with userEvent, then assert on the resulting DOM.
  4. Avoid container.querySelector and snapshot-everything tests — they break on refactors.

Prefer findBy* for async UI and getBy* for content that is already present.

alexngai/skill-tree/tree/main/docs/demo/skills/react-component-testing commit 9fcc8bb881

Browse category

Frequently asked questions

npx skillmds@latest add alexngai/react-component-testing