如何重用react-router的useHistory的jest模拟

Question

useHistory我react-router-dom在测试中这样嘲笑：

jest.mock("react-router-dom", () => ({
  useHistory: () => ({
    length: 13,
    push: jest.fn(),
    block: jest.fn(),
    createHref: jest.fn(),
    go: jest.fn(),
    goBack: jest.fn(),
    goForward: jest.fn(),
    liten: jest.fn(),
    replace: jest.fn(),
    action: "REPLACE",
    location: null
  })
}));

这在单个测试中工作得很好，但我基本上每个测试都需要它，并且我不想每次都复制它。

我如何重用这个模拟？我尝试了显而易见的方法，将其移动到另一个文件并导出创建模拟的函数：

export default () => jest.mock("react-router-dom", () => ({...})

但是，导入它并调用该函数来创建模拟会导致错误。

import useHistoryMock from "../../../testUtils/hooks/useHistory";
useHistoryMock()

然后，我的组件实现会抛出TypeError: Cannot read property 'history' of undefined异常，如果我在测试文件本身中定义模拟，则不会抛出异常。

重用模拟的便捷方法是什么？我正在使用打字稿，所以最好我不想破坏任何编译器规则。

Answer 1

您可以尝试使用__mocks__文件夹 https://jestjs.io/docs/en/manual-mocks.html