⏳ Advanced Async Testing

Production async testing patterns.

Waiting for Multiple Conditions

test('waits for complex async state', async () => {
  render(<Dashboard />);
  
  await waitFor(() => {
    expect(screen.getByText('Data loaded')).toBeInTheDocument();
  });
  
  await waitFor(() => {
    expect(screen.getByText('Analysis complete')).toBeInTheDocument();
  });
});

Handling Race Conditions

test('handles rapid updates', async () => {
  const { rerender } = render(<Component value={1} />);
  
  rerender(<Component value={2} />);
  rerender(<Component value={3} />);
  
  await waitFor(() => {
    expect(screen.getByText('Value: 3')).toBeInTheDocument();
  });
});

Mocking Complex Async

test('handles complex async flow', async () => {
  global.fetch = jest.fn()
    .mockResolvedValueOnce({ json: () => ({ users: [] }) })
    .mockResolvedValueOnce({ json: () => ({ posts: [] }) });
  
  render(<Dashboard />);
  
  await screen.findByText('Users loaded');
  await screen.findByText('Posts loaded');
});

✅ Key Takeaways

• Use **waitFor()** for complex async conditions

• Handle **race conditions** in rapid updates

• Mock **multiple calls** separately

• Always **await** async operations