Question

我要测试的功能如下。我们正在使用类似构建器的方法来组装复杂的URL结构，以帮助浏览Web应用程序。

import { useNavigation } from '../../../blah';

useNavigation().goBack();

我正在尝试检查的全功能如下

export const useNavigation = (path) => {
  const { view } = store.getState();

  const withQueryParams = (params = {}) => {
    const paramString = addQueryStringParameters(params);
    return useNavigation(`${path}${paramString}`);
  };

  const tlo = (id) => useNavigation(`/${id}/${id}${path}`);

  const site = (id) => useNavigation(`/${view.activeTLO.id}/${id}${path}`);

  const current = () => useNavigation(`/${view.activeTLO.id}/${view.activeSite.id}${path}`);

  const navigate = () => history.push(path);

  const goBack = () => history.goBack();

  return {
    withQueryParams,
    tlo,
    site,
    current,
    navigate,
    path,
    goBack,
  };
};

开个玩笑，我正在尝试模拟内部的goBack函数，以便我们可以检查它是否在代码中的某个位置被调用，但是到目前为止我还没有运气。

我正在像这样导入和模拟函数

import * as navigateTo from '../../../lib/navigateTo';

navigateTo.useNavigation = jest.fn(() => ({
  goBack: jest.fn(),
}));

当尝试对goBack函数执行期望时，检查它是否被调用会变得有些奇怪。

下面的期望确实可以正常工作，因为它可以看到已经调用了navigationTo.useNavigation，但是我无法竭尽全力检查是否已将navigationTo.useNavigation.goBack调用为始终未定义的状态。

it('renders the navigate to the orders page', () => {
  const actions = availableOrderActions(settings).find((action) => action.label === 'Supplier Orders');
  actions.clickHandler();

  expect(navigateTo.useNavigation).toHaveBeenCalled();
});

对此的任何帮助都将是非常有用的，因为涉及事物的单元测试方面，我们很多人都面临过它的实际问题。

预先感谢，克里斯

Answer 1

看起来像是模拟这种事情的方式。

import * as navigateTo from '../../../lib/navigateTo';

const goBack = jest.fn();
navigateTo.useNavigation = jest.fn(() => ({
  goBack,
}));

it('renders the navigate to orders page', () => {
   const actions = availableOrderActions(settings).find((action) => action.label === 'Buyer Orders');
   actions.clickHandler();
   expect(navigateTo.useNavigation).toHaveBeenCalled();
   expect(goBack).toHaveBeenCalled();
});

如果使用Jest / Enzyme调用内部函数，则进行测试

1 个答案: