Testing Library

Write component tests the way users use the app with React/Vue/Svelte Testing Library. Enforces accessibility-first queries (getByRole, getByLabelText), userEvent over fireEvent, and resilient async assertions.

This skill generates Testing Library tests that don't break on refactors. It uses role-based queries, userEvent v14 patterns, findBy* for async, screen.debug + logRoles for diagnosis, and avoids the anti-patterns (querySelector, container.firstChild, act() wrapping).

When to use

Use when writing component tests for React/Vue/Svelte that survive refactors, when migrating off Enzyme, or when component tests are flaky because of fireEvent + setTimeout patterns.

Examples

Form submission test

Test a form with userEvent and async assertions

Write a Testing Library test for a sign-up form using userEvent, getByRole/getByLabelText, and findByText for the success toast

Migrate from Enzyme

Convert legacy Enzyme shallow tests to RTL

Refactor this Enzyme shallow component test to React Testing Library using role queries and userEvent