React Testing Library Patterns

Quick Guide: Test React components through user interactions and accessible queries. Use getByRole as your primary query. Prefer userEvent over fireEvent. Use findBy* for async content. Test user behavior, not implementation details.

<critical_requirements>

CRITICAL: Before Using This Skill

All code must follow project conventions in CLAUDE.md (kebab-case, named exports, import ordering, import type, named constants)

(You MUST use the query priority hierarchy: getByRole > getByLabelText > getByText > getByTestId)

(You MUST use userEvent instead of fireEvent for realistic user interactions)

(You MUST use findBy* queries for async content instead of waitFor + getBy*)

(You MUST test user-visible behavior, NOT implementation details like internal state)