无法使用jest模拟浅安装组件的react useLocation挂钩

polkgigr 于 2022-12-08 发布在 Jest

关注(0)|答案(2)|浏览(208)

我试图测试一个使用useLocation react钩子的组件，但是即使我模拟了它，useLocation（）.pathname也会导致错误，因为useLocation是未定义的。
我的另一个问题是，如果我在这个测试文件中成功地模拟了useLocation（），它是否也能用于其他测试文件？是否有一种方法可以只为一个jest测试文件模拟模块？

jest.mock('react-router-dom', () => ({
  ...jest.requireActual('react-router-dom'),
  useLocation: jest.fn().mockReturnValue({
    pathname: '/route'
  })
}));

describe('ComponentUsingLocation', () => {
  test('should render', () => {
    const wrapper = shallow(
      <ComponentUsingLocation />
    );

    expect(wrapper).toMatchSnapshot();
  });
});

jestjs

来源：https://stackoverflow.com/questions/74532955/unable-to-mock-the-react-uselocation-hook-with-jest-for-shallow-mounted-componen

2条答案

按热度按时间

ql3eal8s1#

你能不能试

jest.mock('react-router-dom', () => ({
  ...jest.requireActual("react-router-dom") as {},
  useLocation: jest.fn().mockImplementation(() => {
      return {
        pathname: "/route",
        search: '',
        hash: '',
        state: null
      };
  })
}));

为了回答第二个问题，如果您希望它在一个文件中的所有测试用例中工作，您可以在beforeAll() jest函数上模拟它。
更多信息-https://jestjs.io/docs/setup-teardown

赞(0）回复(0）举报 2022-12-08

px9o7tmv2#

看起来一个不同的实现确实可以工作，出于某种原因没有使用jest.fn（）.mockReturnValue，而是简单地使用一个常规函数来完成这项工作。
我还在一个标准的react-scripts项目中安装了jest-react-hooks-shallow包。

jest.mock('react-router-dom', () => ({
  ...jest.requireActual('react-router-dom'),
  useLocation: () => ({
    pathname: 'localhost:3000/example/path'
  })
}));

赞(0）回复(0）举报 2022-12-08

我来回答

无法使用jest模拟浅安装组件的react useLocation挂钩

2条答案

相关问题

热门标签

最新问答