title: not able to mock component methods using jest
body: <p>everything is latest</p>
  
  <pre><code>"jest": "^21.1.0",
  "react": "^16.0.0",
  "react-dom": "^16.0.0"
  "react-test-renderer": "^16.0.0",
  "enzyme": "^3.1.0",
  "enzyme-adapter-react-16": "^1.0.1",
  </code></pre>
  
  <p>I have a component and a test like below</p>
  
  <pre class="lang-js prettyprint-override"><code>//component
  class ToggleCheckbox  extends Component{
     onChange=()=&gt;{}
     render(){
        return &lt;div&gt; &lt;button onClick={this.onChange} &gt;click&lt;/button&gt; &lt;/div&gt; 
     }
  }
  
  //test
    it('spy', () =&gt; {
      //arrange
      const spy = jest.fn().mockImplementation( ()=&gt;{
        console.log(`spy called`);
      })
      const wrapper = shallow(&lt;ToggleCheckbox /&gt;);   
      wrapper.instance().onChange = spy
      wrapper.update(); //Forces a re-render.
      //act
      // wrapper.instance().onChange()
      wrapper.find('button').simulate('click');
  
      //assert
      expect(spy).toBeCalled(); // this will fail but I don't know why;
    });
  </code></pre>
  
  <p>the assertion will fail but I don't know why.</p>
  
  <p>I know i'm testing jest , or enzyme here rather than testing my code -- as we are doing shallow and no event gets fired in the test; but I want to know what is going on under the hood;
  thanks</p>
  
  <p>here is the link to the original question: <a href="https://github.com/facebook/jest/issues/4696" rel="nofollow noreferrer">https://github.com/facebook/jest/issues/4696</a></p>
  
  <p>How do I achieve this?</p>