最好的解决方案似乎是使用容器模式，并从容器类中传递API数据，并单独测试组件。这允许测试中的组件简单地将API数据作为 prop ，并使其更具可测试性。

由于您没有进行任何真实的API调用或其他耗时的操作，因此异步操作将在可预见的短时间内解决。
因此，您只需等待一段时间。

it('has new behaviour from result of set state', (done) => {
  let component = mount(<Component />);
  requests.pop().respond(200);

  setTimeout(() => {
    try {
      component.update();
      assertNewBehaviour();
      done();
    } catch (error) {
      done(error);
    }
  }, 1000);
});

字符串

react测试库有一个waitFor函数，非常适合这种情况。
我将给予一个钩子和函数的例子，因为这是当前的react模式。假设你有一个类似于这个的组件：

export function TestingComponent(props: Props) {
    const [banners, setBanners] = useState<MyType>([]);

    React.useEffect(() => {
        const response = await get("/...");
        setBanners(response.banners);
    }, []);

    return (
        {banners.length > 0 ? <Component> : </NoComponent>}
    );
}

字符串
现在，您可以编写一个这样的测试，以确保在设置横幅时呈现Component

test("when the banner matches the url it renders", async () => {
        const {container} = render(<TestingComponent />);
        await waitFor(() => {expect(...).toBe(...)});
    });

型
waitFor将等待函数中的条件满足后再继续。如果条件在X时间内未满足，则会超时，测试将失败。有关详细信息，请参阅react测试库文档

使用nock（link）模拟它，你几乎可以立即使用。还有一个视频教程（link）。不要忘记使用waitFor。

test.only('should use API response', async () => {
  nock(BASE_URL)
    .get(`/account/${ACCOUNT_ID}/lists?page=1`)
    .reply(200, listsMockResponse1page);
 const {getByTestId} = render(component);
...

字符串