title: Why can I not mock a function called by an onClick event with Jest/Enzyme?
body: <p>I have a clickable component that looks as follows:</p>
  
  <pre><code>export default class Clickable extends Component {
  
    constructor(props){
      super(props);
      this.handleClick = this.handleClick.bind(this);
    }
  
    handleClick(){
      console.log('clicked');
    }
  
    render(){
      return &lt;button onClick={this.handleClick}&gt;&lt;/button&gt;
    }
  
  
  }
  </code></pre>
  
  <p>I have confirmed in the browser that the onClick event is firing and calling the handle click function. However, I cannot get my test (jest/enzyme) to mock the click event. My test looks as follows.</p>
  
  <pre><code>describe("&lt;Clickable/&gt;", () =&gt; {
    let clickMock = jest.fn();
    let component = shallow(&lt;Clickable/&gt;);
  
    it("should call handleClick() when clicked on", () =&gt; {
      component.instance().handleClick = clickMock;
      component.update();
      component.find('button').simulate('click');
      expect(clickMock).toHaveBeenCalled();
    });
  });
  </code></pre>
  
  <p>The test returns <code>Expected mock function to have been called.</code></p>
  
  <p>Thanks</p>