React Testing Library !free! -

// Simulate user interaction await userEvent.click(button)

// Or use waitFor for custom conditions await waitFor(() => { expect(screen.getByRole('alert')).toHaveTextContent('Success') }) // fireEvent - lower level, more immediate fireEvent.click(button) fireEvent.change(input, { target: { value: 'new' } }) // userEvent - higher level, more realistic (recommended) await userEvent.click(button) await userEvent.type(input, 'new text') await userEvent.selectOptions(select, 'option1') await userEvent.tab() // Focus management Testing Form Interactions test('submits form with user input', async () => { const handleSubmit = jest.fn() render(<LoginForm onSubmit={handleSubmit} />) // Fill form fields await userEvent.type(screen.getByLabelText(/email/i), 'test@example.com') await userEvent.type(screen.getByLabelText(/password/i), 'password123')

// Navigate to profile await userEvent.click(screen.getByRole('link', { name: /profile/i })) expect(screen.getByText(/user profile/i)).toBeInTheDocument() react testing library

// Wait for data to appear const userName = await screen.findByText(/John Doe/i) expect(userName).toBeInTheDocument() })

// Assert expect(screen.getByText(/count: 1/i)).toBeInTheDocument() }) import { waitFor, screen } from '@testing-library/react' test('loads user data', async () => { render(<UserProfile userId={123} />) // Simulate user interaction await userEvent

act(() => { result.current.increment() })

// Logout await userEvent.click(screen.getByRole('button', { name: /logout/i })) expect(screen.getByRole('button', { name: /login/i })).toBeInTheDocument() }) 'new text') await userEvent.selectOptions(select

// Find elements const button = screen.getByRole('button', { name: /increment/i }) const count = screen.getByText(/count: 0/i)