Насмешка над компонентом высшего порядка с шуткой

Question

Я хочу убедиться, что компонент HOC вызывается с помощью jest, но я не могу заставить jest.mock работать. Мой HOC выглядит так:

const withEntity = (
  ...args
) => {
  const wrappedComponent = WrappedComponent => {
    const innerComponent = ({ ...props }) => {    
      return (
        <WrapperComponent
          {...props}
        >
          <WrappedComponent />
        </WrapperComponent>
      );
    };

    innerComponent.propTypes = {
      ...
    };

    return innerComponent;
  };

  wrappedComponent.propTypes = {
    ...
  };

  return wrappedComponent;
};

withEntity.propTypes = {
  ...
};

export default withEntity;

В отдельном файле функция withEntity вызывается так:

export const DoSomething = withEntity(...args)(MyComponent);

Затем в тестовом файле для компонента DoSomething я пытаюсь импортировать функцию withEntity и макетировать ее так:

import withEntity from "../../../shared/entity/higher_order_components/withEntity";
jest.mock("../../../shared/entity/higher_order_components/withEntity");

Но когда я действительно пытаюсь запустить тест, я получаю эту ошибку:

  ● Test suite failed to run

    TypeError: (0 , _withEntity.default)(...) is not a function

Не уверен, что делать с этой ошибкой, что я здесь не так делаю?

Answer 1

Насмешка вашего HOC должна выглядеть так:

jest.mock('../your/HOC', () => () => 
    Component => props => <Component {...props} /> 
)

это можно прочитать как:

jest.mock('../your/HOC', () => `

создать макет, который возвращает вашу функцию HOC,

() => 

функция, которая возвращает ваш HOC aka withEntity(...args),

Component => props => <Component {...props} /> 

Сам HOC, который является функцией, которая получает компонент и возвращает функцию, которая получает реквизиты и возвращает функцию, которая возвращает визуализированный компонент со своими реквизитами.