# React Testing Library

> React Testing Library patterns, queries, user events, and accessibility testing.

- Skill: `majiayu000/react-testing-library-2` (Agent Skill, multi-file: 2 files)
- Install (CLI): `npx skillmds@latest add majiayu000/react-testing-library-2`
- Raw SKILL.md: https://api.skillmd.com/api/skills/majiayu000/react-testing-library-2/raw
- Safety review: pending (external: skill-scanner PASS, skillspector PASS)
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Web & Frontend
- Author: majiayu000 (https://skillmd.com/u/majiayu000)
- Updated: 2026-09-09
- Page: https://skillmd.com/skills/majiayu000/react-testing-library-2

---


# React Testing Library Skill

Expert assistance for testing React components.

## Capabilities

- Write user-centric tests
- Use proper queries
- Handle async operations
- Test accessibility
- Mock dependencies

## Test Patterns

```typescript
import { render, screen, waitFor } from '@testing-library/react';
import userEvent from '@testing-library/user-event';

describe('LoginForm', () => {
  it('should submit form with valid data', async () => {
    const onSubmit = vi.fn();
    const user = userEvent.setup();

    render(<LoginForm onSubmit={onSubmit} />);

    await user.type(screen.getByLabelText(/email/i), 'test@example.com');
    await user.type(screen.getByLabelText(/password/i), 'password123');
    await user.click(screen.getByRole('button', { name: /sign in/i }));

    await waitFor(() => {
      expect(onSubmit).toHaveBeenCalledWith({
        email: 'test@example.com',
        password: 'password123',
      });
    });
  });
});
```

## Query Priority

1. getByRole (accessibility)
2. getByLabelText (forms)
3. getByPlaceholderText
4. getByText
5. getByTestId (last resort)

## Target Processes

- react-testing
- unit-testing
- accessibility-testing