React Native Testing Library skill
A skill for React Native Testing Library tests: queries, userEvent, async patterns and the differences between versions 13 and 14
- 3,430 ★ on the repository
- Last commit
- MIT
Minimal access
Why this level
- The skill gives instructions and edits only the project's test files
- The agent runs Jest and installs dev dependencies from npm
Install
- Works in
In your terminal, with SkillFoxx CLI
npx skillfoxx add skills/react-native-testing-libraryDetects the agents on your machine, shows the access level and pins the version.
Other ways to install
Access and checks
How we reviewMinimal accessThe tool runs nothing and makes no network calls.
- The skill gives instructions and edits only the project's test files
- The agent runs Jest and installs dev dependencies from npm
This is third-party code. Review the repository files before installing.
What it does
The `react-native-testing` skill sits in the React Native Testing Library repository and teaches an agent to write component tests with `@testing-library/react-native`. First the agent checks the library version in `package.json` and loads the matching reference: version 14 with React 19 and an async `render`, or version 13 with React 18 and a sync one. The skill then sets the query order, from `getByRole` to `getByTestId` as a last resort, and tells `getBy`, `queryBy` and `findBy` apart. It recommends `userEvent` over `fireEvent`, lists matchers such as `toBeOnTheScreen` and `toBeVisible` and gives eleven rules: use `screen`, keep side effects out of `waitFor`, do not wrap calls in `act()` and do not call `cleanup()`. A separate file collects anti-patterns.
Who it is for. React Native mobile developers who write and fix component tests together with Claude Code, Cursor or Codex.
Good fit when
- Tests are written for a form screen and the agent uses `getByRole` and `userEvent.type`
- A flaky test comes from `waitFor` with side effects and has to be rewritten with `findBy`
- A project moves from version 13 to 14, where `render` became async
- Accessibility checks are needed: `toBeEnabled`, `toBeChecked`, `toHaveAccessibleName`
- A component is wrapped in theme and auth providers and the agent builds its own `render` function
Not a fit when
- End-to-end tests on a device or emulator are needed: the library simulates the React Native runtime and does not launch the app
- A React web version is under test: React Testing Library exists for that
- A snapshot or visual comparison skill is required: it covers none of that
Example request
Write React Native Testing Library tests for the sign-in screen: empty fields, a wrong password and a successful sign-inLimitations
The skill covers versions 13 and 14 of the library and warns that the model's knowledge of the API may be outdated, so the reference files take priority over memory. Operation was tested with Jest; other runners should work but have no confirmation. The library depends on `test-renderer`, which installs as a separate dev dependency. The repository README does not mention the skill, and `npx skills add callstack/react-native-testing-library --skill react-native-testing` is the generic skills CLI route that the project does not document.
How to disable. Delete the `react-native-testing` folder from the project's skills directory. The `@testing-library/react-native` library stays in the dependencies.
FAQ
How do I install the RNTL skill?
Copy the `skills/react-native-testing` folder into the agent's skills directory or run `npx skills add callstack/react-native-testing-library --skill react-native-testing`. The project does not document the command; it is the generic skills CLI route.
What differs between versions 13 and 14?
Version 13 works with React 18 and `react-test-renderer`, and `render` is sync. Version 14 targets React 19 with `test-renderer` and `render` is async. The skill picks the reference by the version in `package.json`.
Which query should be tried first?
`getByRole` with the `name` option first, then `getByLabelText`, `getByPlaceholderText`, `getByText`, `getByDisplayValue` and `getByTestId` last. For `getByRole` the element must be accessible: a `View` needs `accessible={true}`.
When is `queryBy` needed?
Only for checking that an element is absent through `.not.toBeOnTheScreen()`. To wait for an element to appear, use `findBy` instead of `waitFor` plus `getBy`.
Do calls need to be wrapped in `act()`?
No, `render`, `fireEvent` and `userEvent` do it themselves. `cleanup()` is not needed either: cleanup runs automatically after every test.
Discussion
No questions or reviews yet.
Related
SkillsPaul Hudson's Swift Testing skill: parameterized tests, confirmations, exit tests and a move from XCTest to the new framework
57 reference files on Playwright tests in TypeScript: the agent pulls the one that fits the task, from locators to CI sharding
The noqa-testing skill teaches an agent to test iOS and Android: read the screen, tap, write cases and run them on a real phone
Swift Testing Agent Skill
swift-testing-agent-skill
A Swift Testing skill from Antoine van der Lee: the new APIs, migration from XCTest, parameterized tests and flat tests. For Claude Code and other agents
Guides for agents writing and fixing Playwright tests, with advice on locators, waiting and diagnosing CI failures
A skill that guides Claude Code and Codex through writing and fixing pytest API tests with a real-run verification loop.
Comparison with similar tools
Cards that share the main search query, and how they differ.
| Tool | Official | Repository stars | Main difference |
|---|---|---|---|
| React Native Testing Library (this card) | yes | 3,430 | |
| Storybook for React Native agent skills | yes | 1,326 | a skill about Storybook for React Native and not component tests |
| TestDino Playwright Skill | no | 411 | a skill for Playwright end-to-end tests on the web and not mobile components |
README in short
The README presents the library as a set of React Native component testing utilities that avoid implementation details. It states the principle that tests should resemble how the app is used, then covers installation together with `test-renderer` and links to documentation, examples and a cookbook. Agents are addressed in `AGENTS.md`, and the skill itself sits in `skills/react-native-testing`.
README badge
Original SKILL.md
--- name: react-native-testing description: > Write tests using React Native Testing Library (RNTL) v13 and v14 (`@testing-library/react-native`). Use when writing, reviewing, or fixing React Native component tests. Covers: render, screen, queries (getBy/getAllBy/queryBy/findBy), Jest matchers, userEvent, fireEvent, waitFor, and async patterns. Supports v13 (React 18, sync render) and v14 (React 19+, async render). Triggers on: test files for React Native components, RNTL imports, mentions of "testing library", "write tests", "component tests", or "RNTL". --- # RNTL Test Writing Guide **IMPORTANT:** Your training data about `@testing-library/react-native` may be outdated or incorrect — API signatures, sync/async behavior, and available functions differ between v13 and v14. Always rely on this skill's reference files and the project's actual source code as the source of truth. Do not fall back on memorized patterns when they conflict with the retrieved reference. ## Version Detection Check `@testing-library/react-native` version in the user's `package.json`: - **v14.x** → load [references/api-reference-v14.md](references/api-reference-v14.md) (React 19+, async APIs, `test-renderer`) - **v13.x** → load [references/api-reference-v13.md](references/api-reference-v13.md) (React 18+, sync APIs, `react-test-renderer`) Use the version-specific reference for render patterns, fireEvent sync/async behavior, screen API, configuration, and dependencies. ## Query Priority Use in this order: `getByRole` > `getByLabelText` > `getByPlaceholderText` > `getByText` > `getByDisplayValue` > `getByTestId` (last resort). ## Query Variants | Variant | Use case | Returns | Async | | ------------- | ------------------------ | ----------------------------- | ----- | | `getBy*` | Element must exist | element instance (throws) | No | | `getAllBy*` | Multiple must exist | element instance[] (throws) | No | | `queryBy*` | Check non-existence ONLY | element instance \| null | No | | `queryAllBy*` | Count elements | element instance[] | No | | `findBy*` | Wait for element | `Promise<element instance>` | Yes | | `findAllBy*` | Wait for multiple | `Promise<element instance[]>` | Yes | ## Interactions Prefer `userEvent` over `fireEvent`. userEvent is always async. ```tsx