Как смоделировать функцию каррирования без сохранения состояния с помощью Jest & Enzyme

Question

У меня есть этот компонент React без сохранения состояния:

...
const Providers = ({ onSelectFeedProvider, ... }) => {
  const handleSelectFeedProvider = value => e => {
    e.preventDefault();
    onSelectFeedProvider({ target: { value } });
  };

  return {
    <Row onClick={handleSelectFeedProvider(1)}>
      ...
    </Row>
  }
}

И тест:

import Row from 'components/Common/Row';
import Providers from './index';

jest.mock('components/Common/Row', () => 'Row');

let onSelectFeedProviderSpy = jest.fn();
let onSelectProviderSpy = jest.fn();

const initialProps = {
  feedProvider: 0,
  onSelectFeedProvider: () => onSelectFeedProviderSpy(),
  selectedProvider: undefined,
  onSelectProvider: () => onSelectProviderSpy()
};

const mockComponent = props => {
  const finalProps = { ...initialProps, ...props };

  return <Providers {...finalProps} />;
};

it('should call correctly', () => {
  const wrapper = shallow(mockComponent());

  wrapper.find(Row).simulate('click', 'what do I have to do here');

  expect(onSelect).toHaveBeenCalledTimes(1);
});

Как мне правильно вызвать метод и передать покрытие? Я думаю, что перепробовал все возможности. Есть мысли?

Answer 1

У вас не так много вариантов, один из подходов - сделать onSelect инъекционным

const Component = ({onSelect}) => {
  const handleSelect = value => e => {
    e.preventDefault()
    onSelect && onSelect({ target: { value } })
  }

  return <Row onClick={handleSelect(1)} />
}

Тест

it('should call correctly', () => {
  const spy = jest.fn()
  const wrapper = shallow(mockComponent({onSelectProvider: spy}));

  wrapper.find(Row).simulate('click', 'what do I have to do here');

  expect(spy).toHaveBeenCalledTimes(1);
});