callstack__react-native-testing-library/docs/guides/quick-start.md

import { PackageManagerTabs } from '@rspress/core/theme';

Quick Start

Installation

Open a Terminal in your project's folder and run:

<PackageManagerTabs command={{ npm: 'npm install -D @testing-library/react-native', yarn: 'yarn add -D @testing-library/react-native', pnpm: 'pnpm add -D @testing-library/react-native', bun: 'bun add -D @testing-library/react-native', }} />

This library has a peer dependency on Test Renderer. Make sure to install it:

<PackageManagerTabs command={{ npm: 'npm install -D test-renderer', yarn: 'yarn add -D test-renderer', pnpm: 'pnpm add -D test-renderer', bun: 'bun add -D test-renderer', }} />

Test Renderer has better compatibility with React 19 and improved type safety compared to the deprecated React Test Renderer.

Jest matchers

RNTL automatically extends Jest with React Native-specific matchers. The only thing you need to do is to import anything from @testing-library/react-native which you already need to do to access the render function.

ESLint plugin

Set up eslint-plugin-testing-library to avoid common Testing Library mistakes and bad practices.

Install the plugin (assuming you already have eslint installed & configured):

<PackageManagerTabs command={{ npm: 'npm install -D eslint-plugin-testing-library', yarn: 'yarn add -D eslint-plugin-testing-library', pnpm: 'pnpm add -D eslint-plugin-testing-library', bun: 'bun add -D eslint-plugin-testing-library', }} />

Then, add this to your ESLint config (e.g., .eslintrc.js). Extend the react plugin:

module.exports = {
  overrides: [
    {
      // Test files only
      files: ['**/__tests__/**/*.[jt]s?(x)', '**/?(*.)+(spec|test).[jt]s?(x)'],
      extends: ['plugin:testing-library/react'],
    },
  ],
};