title: Mock a dependency of a React component using Jest
body: <p>I have a react component (CreateForm). The React component depends on a module (Store). The CreateForm has a Cancel button. On clicking the cancel button, the handleCancel function of the Store module should be called. </p>
  
  <p>I wrote a test unsuccessfully using Jest:</p>
  
  <pre><code>test.only('should handle cancel button click', () =&gt; {
      jest.mock('../../src/store');
      const store = require('../../src/store');
      const wrapper = shallow(&lt;CreateForm /&gt;);
      const cancelButton = wrapper.find('button').at(1);
      cancelButton.simulate('click');
      expect(store.default.handleCancel).toBeCalled();
  });
  </code></pre>
  
  <p>The test failed. The mock function did not get called and the test failed. Does the react component not get this version of the mock? If so, how do I fix the test? Thanks.</p>
  
  <p>My CreateForm component looks something like the below:</p>
  
  <pre><code>import Store from './store';
  
  render() {
     return (
       &lt;Panel&gt;
         &lt;FormControls /&gt;
         &lt;button onClick={Store.create}&gt;Create&lt;/button&gt;
         &lt;button onClick={Store.handleCancel}&gt;Cancel&lt;/button&gt;
      &lt;/Panel&gt;
    );
  }
  </code></pre>
  
  <p>A second improvised test that works for me is shown below.</p>
  
  <pre><code>test.only('should handle cancel button click', () =&gt; {
    const store = require('../../src/store').default;
    const cancel = store.handleCancel;
    store.handleCancel = jest.fn();
  
    const wrapper = shallow(&lt;CreateForm /&gt;);
    const cancelButton = wrapper.find('button').at(1);
    cancelButton.simulate('click');
    expect(store.handleCancel).toBeCalled();
  
    store.handleCancel = cancel;
  });
  </code></pre>
  
  <p>The above test works. I am manually mocking the function, doing the test and restoring the function back to its original after the test. Is there a better way or Jest way of writing the above test? Thanks.</p>