> react-testing-library
React Testing Library best practices for writing maintainable, user-centric tests. Use when writing, reviewing, or refactoring RTL tests. Triggers on test files, testing patterns, getBy/queryBy queries, userEvent, waitFor, and component testing.
curl "https://skillshub.wtf/pproenca/dot-skills/react-testing-library?format=md"React Testing Library Best Practices
Comprehensive testing guide for React components using Testing Library, designed for AI agents and LLMs. Contains 43 rules across 9 categories, prioritized by impact to guide test writing and code review.
When to Apply
Reference these guidelines when:
- Writing new component tests with React Testing Library
- Selecting queries (getByRole, getByLabelText, etc.)
- Handling async operations in tests (findBy, waitFor)
- Simulating user interactions (userEvent)
- Reviewing tests for anti-patterns and implementation detail testing
Rule Categories by Priority
| Priority | Category | Impact | Prefix |
|---|---|---|---|
| 1 | Query Selection | CRITICAL | query- |
| 2 | Async Handling | CRITICAL | async- |
| 3 | Common Anti-Patterns | CRITICAL | anti- |
| 4 | User Interaction | HIGH | user- |
| 5 | Assertions | HIGH | assert- |
| 6 | Component Setup | MEDIUM | setup- |
| 7 | Test Structure | MEDIUM | struct- |
| 8 | Debugging | LOW-MEDIUM | debug- |
| 9 | Accessibility Testing | LOW | a11y- |
Quick Reference
1. Query Selection (CRITICAL)
query-prefer-role- Prefer getByRole over other queriesquery-avoid-testid- Avoid getByTestId as primary queryquery-use-screen- Use screen for queriesquery-label-text-forms- Use getByLabelText for form fieldsquery-role-name-option- Use name option with getByRolequery-get-vs-query- Use getBy for present, queryBy for absentquery-within-scope- Use within() to scope queries
2. Async Handling (CRITICAL)
async-findby-over-waitfor- Use findBy instead of waitFor + getByasync-await-findby- Always await findBy queriesasync-single-assertion-waitfor- Single assertion in waitForasync-no-side-effects-waitfor- Avoid side effects in waitForasync-waitfor-disappear- Use waitForElementToBeRemoved
3. Common Anti-Patterns (CRITICAL)
anti-unnecessary-act- Avoid unnecessary act() wrappinganti-manual-cleanup- Remove manual cleanup callsanti-implementation-details- Avoid testing implementation detailsanti-empty-waitfor- Avoid empty waitFor callbacksanti-container-queries- Avoid using container for queriesanti-redundant-roles- Avoid adding redundant ARIA roles
4. User Interaction (HIGH)
user-prefer-userevent- Use userEvent over fireEventuser-setup-before-render- Setup userEvent before renderuser-await-interactions- Always await userEvent interactionsuser-keyboard-for-special-keys- Use keyboard() for special keysuser-clear-before-type- Use clear() before retyping
5. Assertions (HIGH)
assert-jest-dom-matchers- Use jest-dom matchersassert-visible-over-in-document- Use toBeVisible() for visibilityassert-text-content- Use toHaveTextContent() for textassert-have-value- Use toHaveValue() for inputsassert-accessible-description- Use toHaveAccessibleDescription()
6. Component Setup (MEDIUM)
setup-wrapper-providers- Use wrapper option for providerssetup-custom-render- Create custom render with providerssetup-mock-modules- Mock modules at module levelsetup-fake-timers- Configure userEvent with fake timerssetup-render-hook- Use renderHook for testing hooks
7. Test Structure (MEDIUM)
struct-arrange-act-assert- Follow Arrange-Act-Assert patternstruct-one-behavior-per-test- Test one behavior per teststruct-descriptive-names- Use descriptive test namesstruct-avoid-beforeeach-render- Avoid render() in beforeEach
8. Debugging (LOW-MEDIUM)
debug-screen-debug- Use screen.debug() to inspect DOMdebug-logroles- Use logRoles to find available rolesdebug-testing-playground- Use Testing Playground for queries
9. Accessibility Testing (LOW)
a11y-role-queries-verify- Role queries verify accessibilitya11y-verify-focus- Test focus managementa11y-test-aria-states- Test ARIA states and properties
How to Use
Read individual reference files for detailed explanations and code examples:
- Section definitions - Category structure and impact levels
- Rule template - Template for adding new rules
Reference Files
| File | Description |
|---|---|
| references/_sections.md | Category definitions and ordering |
| assets/templates/_template.md | Template for new rules |
| metadata.json | Version and reference information |
> related_skills --same-repo
> rust-write-tests
Skill for writing expert-level Rust tests. Teaches the "What Could Break?" framework, five transformations from superficial to expert tests, flake hunting protocol, intent-based assertions, naming conventions, and a mandatory self-review checklist. Triggers on writing Rust tests, designing test cases, improving test quality, or reviewing test coverage.
> rust-implement
Write production-grade Rust code using a multi-pass approach. Design types first, then implement, then simplify, then verify with automated lint. Use this skill whenever writing new Rust functions, structs, modules, or features. Triggers on Rust implementation, new Rust code, Rust functions, Rust modules, error handling in Rust, async Rust, or type design in Rust.
> valid-skill
A valid test skill with proper formatting. This skill should pass all validations and serves as a reference for the expected format.
> too-long-skill
This skill has more than 500 lines which should fail validation.