使用react- Testing -library测试useEffect内部的api调用

npm install --save-dev @testing-library/react

import React from 'react';
import { render, waitFor } from '@testing-library/react';
import Component from './Component';

describe('Component', () => {
  it('should make an API call on mount', async () => {
    // 模拟API调用并返回数据
    const mockData = { name: 'John Doe' };
    jest.spyOn(global, 'fetch').mockResolvedValueOnce({
      json: jest.fn().mockResolvedValueOnce(mockData),
    });

    // 渲染组件
    render(<Component />);

    // 等待API调用完成
    await waitFor(() => expect(global.fetch).toHaveBeenCalledTimes(1));

    // 断言API调用及其结果
    expect(global.fetch).toHaveBeenCalledWith('API_URL');
    expect(screen.getByText(mockData.name)).toBeInTheDocument();
  });
});