如何在react单元测试中监视useNavigate

Question

我想测试在单击按钮后是否调用了useNavigate，以及在单元测试中是否使用正确的路径调用了它。我试图监视它，但我一直得到以下错误：

● Test suite failed to run
TypeError: Cannot redefine property: useNavigate
at Function.defineProperty (<anonymous>)

这是我测试中触发错误的间谍：

import * as router from "react-router-dom";
jest.spyOn(router, 'useNavigate');

可能是什么问题？

Answer 1

类似的东西对我有用：

import * as router from "react-router-dom";
jest.mock('react-router-dom', () => ({
...jest.requireActual('react-router-dom'),
useNavigate: jest.fn(),
}));
beforeEach(() => {
router.useNavigate.mockImplementation(
jest.requireActual('react-router-dom').useNavigate
);
});
test(...,() => {
jest.spyOn(router, 'useNavigate');
})

我为useMap反作用挂钩的react-leaflet测试了这个