RTK 查询、React 和 fetch-mock-jest：无法识别的请求对象

Question

我一直在尝试将当前的一些获取逻辑迁移到 RTK 查询，以避免重复的获取调用并改进数据缓存管理。一切都按预期进行，应用程序按预期运行，但现在由于

fetch-mock-jest

库，测试失败了。

每当执行涉及使用 RTK 查询挂钩的组件的测试时，都会失败并出现以下错误：

{
  status: 'FETCH_ERROR',
  error: 'TypeError: fetch-mock: Unrecognised Request object. Read the Config and Installation sections of the docs'
}

我已经阅读了

他们文档的这一部分，但我不知道 RTKQ 使用哪些构造函数，所以我不知道应该从哪个包导入它们，或者应该如何以及在哪里配置它们。

此外，我的应用程序将混合 RTKQ 获取（对于需要频繁调用、更新和在多个位置显示的数据）和普通获取（例如下载文档），所以我不知道到底应该如何我对其进行配置以使其在所有情况下都能工作，因为它在添加 RTKQ 之前一直有效。

我应该在setupTests.js

中添加某种配置吗？我应该如何配置 

jest-fetch-mock

 才能同时支持 RTKQ 和正常获取？

谢谢！

Answer 1

对于遇到同样问题的人，我发现在 fetch-mock 中重新声明构造函数可以解决问题：

// setupTests.ts
import fetchMockJest from 'fetch-mock-jest';

// Configure standard constructors so that RTK Query works in tests with FetchMockJest
Object.assign(fetchMockJest.config, {
  fetch,
  Headers,
  Request,
  Response,
});

此外，如果您使用 RTK 查询，则需要确保在每次测试后清理缓存，否则您的获取调用将仅在其中一项测试中进行：

afterEach(() => {
  // Restore cache to allow multiple fetch calls to be performed in tests
  act(() => store.dispatch(yourRtkqApi.util.resetApiState()));
});