Jest doMock example

widget-layout.test.js

import React from 'react';
import { mount } from 'enzyme';
let WidgetLayout;

/* eslint-disable react/display-name, react/prop-types */

beforeEach(() => {
  jest.resetModules();
});

const mockConnectWithState = (state = {}) => {
  jest.doMock('../../../store/store', () => ({
    connect: jest.fn(mapper => Component => props => {
      const defaultState = {
        widgets: [],
        isEditMode: true,
        layouts: {}
      };
      return (
        <Component {...props} {...mapper({ ...defaultState, ...state })} />
      );
    }),
    actions: {
      setWidgets: jest.fn(),
      setLayouts: jest.fn(),
      removeWidget: jest.fn()
    }
  }));
  WidgetLayout = require.requireActual('./widget-layout').default;
};

test('should not render delete icon when not in edit mode', () => {
  mockConnectWithState({ isEditMode: false });
  const wrapper = mount(<WidgetLayout id={'widget-id'} title="WidgetTitle" />);

  expect(
    wrapper.find('Icon').findWhere(x => x.prop('name') === 'close').length
  ).toBe(0);
});

test('should render delete icon when in edit mode', () => {
  mockConnectWithState({ isEditMode: true });
  const wrapper = mount(<WidgetLayout id={'widget-id'} title="WidgetTitle" />);

  expect(
    wrapper.find('Icon').findWhere(x => x.prop('name') === 'close').length
  ).toBe(1);
});

test('should show confimartion dialog when clicked on delete icon', () => {
  mockConnectWithState({ isEditMode: true });
  const wrapper = mount(<WidgetLayout id={'widget-id'} title="WidgetTitle" />);
  wrapper
    .find('Icon')
    .findWhere(x => x.prop('name') === 'close')
    .simulate('click');

  expect(wrapper.find('Confirm').prop('open')).toBe(true);
});

test('should remove widget when dialog is confirmed', () => {
  mockConnectWithState({ isEditMode: true });
  const { actions } = require('../../../store/store');
  const wrapper = mount(<WidgetLayout id={'widget-id'} title="WidgetTitle" />);
  wrapper
    .find('WidgetLayout')
    .instance()
    .handleConfirm();

  expect(actions.removeWidget).toHaveBeenCalledTimes(1);
  expect(actions.removeWidget).toHaveBeenCalledWith({ id: 'widget-id' });
});

test('should not remove widget when dialog is canceled', () => {
  mockConnectWithState({ isEditMode: true });
  const { actions } = require('../../../store/store');
  const wrapper = mount(<WidgetLayout id={'widget-id'} title="WidgetTitle" />);
  wrapper
    .find('WidgetLayout')
    .instance()
    .handleCancel();

  expect(actions.removeWidget).toHaveBeenCalledTimes(0);
});