Last Updated: November 21, 2025
Testing Library
User-centric testing utilities
Core Principles
| Item | Description |
|---|---|
User-Centric
|
Test like users interact |
No Implementation
|
Don't test internals |
Accessible
|
Encourage accessibility |
Framework Agnostic
|
Works with any framework |
Queries
|
Find elements semantically |
Events
|
Simulate user interactions |
React Example
import { render, screen, fireEvent } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import Counter from './Counter'
test('increments counter', async () => {
render(<Counter />)
// Query by role
const button = screen.getByRole('button', { name: /increment/i })
const count = screen.getByText(/count: 0/i)
// User interaction
await userEvent.click(button)
// Assertion
expect(screen.getByText(/count: 1/i)).toBeInTheDocument()
})
Query Priority
| Item | Description |
|---|---|
getByRole
|
Most accessible (use first) |
getByLabelText
|
Form inputs |
getByPlaceholderText
|
When no label |
getByText
|
Non-interactive content |
getByDisplayValue
|
Current form value |
getByTestId
|
Last resort |
Best Practices
- Prefer getByRole over getByTestId
- Use userEvent over fireEvent
- Test user behavior, not implementation
- Use findBy for async elements
💡 Pro Tips
Quick Reference
Testing Library encourages accessible applications