如何重用 react-router 使用历史的玩笑模拟

Question

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

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
})
}));

这在一次测试中非常好，但我基本上每次测试都需要它，我不想每次都复制它。

我如何重用这个mock？我已经尝试了显而易见的方法，将它移到另一个文件中，并导出一个创建mock:的函数

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

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

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

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

重用mock的方便方法是什么？我使用的是typescript，所以我不想破坏任何编译器规则。

Answer 1

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