Testing Library Best Practices

Write accessible, maintainable component tests with Testing Library (React and React Native). Enforces role/label queries, correct async handling, user-event flows, and pragmatic mocking over implementation-detail assertions.

This skill applies Testing Library guiding principles: query by accessible role and label, drive interactions with user-event, await findBy for async UI, and avoid brittle implementation-detail tests. It covers React, React Native (jest-expo), router testing, and mocking network and navigation.

When to use

Use when writing or refactoring component tests, fixing flaky async tests, choosing the right query, or setting up Testing Library in a React or Expo/React Native project.

Examples

Accessible query refactor

Replace testid with roles

Refactor this component test to query by accessible role and label instead of test IDs, and replace fireEvent with user-event

Async data test

Wait for loaded state

Write a Testing Library test that mocks the fetch, renders the profile card, and uses findByRole to assert the loaded name and avatar