react-testing

React component testing with Vitest and RTL requires installing dev dependencies and writing accessible queries to render and assert component behavior. This workflow provides a structured setup to initialize the runner and write your first component tests.

Mocking API calls in React tests using msw involves intercepting network requests at the boundary to simulate real-world interactions. This approach provides structured network mocking guidance to ensure components handle various API responses correctly without hitting real endpoints.

You can test custom React hooks using the renderHook method provided by React Testing Library. This skill supports hook testing workflows by applying renderHook to verify hook state logic and side effects in isolation from component rendering layers.

This React testing workflow supports selecting either Vitest or Jest as the test runner depending on your project needs. It provides practical guidance to configure the chosen runner for RTL-based component tests and hook testing within React SPAs.

Integrating Playwright or Cypress for end-to-end testing in a React SPA extends coverage beyond unit tests to full user flows. This skill provides setup guidance to configure E2E tooling alongside RTL component tests and msw mocks.

Using accessible queries in React Testing Library ensures tests interact with components as users do, improving maintainability. This skill applies accessible queries to verify component behavior, leading to robust test suites that reflect real user accessibility patterns.