Explore Library
Code Quiz

Mocking Fetch and Async Assertions

Spot why a mocked API test fails to find asynchronously loaded data.

Codejavascript
import { render, screen } from '@testing-library/react';
import UserList from './UserList';

test('renders users from the API', () => {
  global.fetch = jest.fn(() =>
    Promise.resolve({
      json: () => Promise.resolve([{ id: 1, name: 'Ada' }]),
    })
  );

  render(<UserList />);

  // UserList fetches in useEffect and renders the names
  expect(screen.getByText('Ada')).toBeInTheDocument();
});

What is the bug that causes this test to fail?