React testing library

Skill a5c-ai/babysitter/library/specializations/web-development/skills/react-testing-library

Babysitter enforces obedience on agentic workforces and enables them to manage extremely complex tasks and workflows through deterministic, hallucination-free self-orchestration

Install

npx -y skills add a5c-ai/babysitter --skill react-testing-library

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

What its author says it does

Copied from the file, not written here

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

SKILL.md

1.6 KB, as published. Nobody here has run it

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

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), '[email protected]');
    await user.type(screen.getByLabelText(/password/i), 'password123');
    await user.click(screen.getByRole('button', { name: /sign in/i }));

    await waitFor(() => {
      expect(onSubmit).toHaveBeenCalledWith({
        email: '[email protected]',
        password: 'password123',
      });
    });
  });
});

Query Priority

getByRole (accessibility)
getByLabelText (forms)
getByPlaceholderText
getByText
getByTestId (last resort)

Target Processes

react-testing
unit-testing
accessibility-testing