title: Test return value from jest mocked event callback
body: <p>I have the following component in Button.tsx:</p>
  
  <pre><code>// Button.tsx
  import * as React from 'react';
  import { Button as ReactstrapButton } from 'reactstrap';
  
  interface IHandlerParams&lt;onClickArgsType&gt; {
    onClickParams?: onClickArgsType
  }
  
  export interface IButtonProps&lt;onClickArgsType = {}&gt; {
    color?: string,
    onClick?: (event: React.MouseEvent&lt;any&gt;, args?: onClickArgsType) =&gt; any,
    handlersParams?: IHandlerParams&lt;onClickArgsType&gt;
  }
  
  interface IHandlers {
    onClick: React.MouseEventHandler&lt;any&gt;
  }
  
  export class Button&lt;onClickArgsType&gt; extends React.Component&lt;IButtonProps&lt;onClickArgsType&gt;&gt; {
  
    private handlers: IHandlers;
  
    constructor(props: IButtonProps&lt;onClickArgsType&gt;) {
      super(props);
      this.handlers = {
        onClick: (MouseEvent:React.MouseEvent&lt;any&gt;) =&gt; { if (this.props.onClick) {this.props.onClick( MouseEvent, this.props.handlersParams ? this.props.handlersParams.onClickParams : undefined) }}
      }
    }
  
    render() {
      return (
        &lt;ReactstrapButton
          color={this.props.color}
          onClick={this.handlers.onClick}&gt;
          {this.props.children}
        &lt;/ReactstrapButton&gt;
      )
    }
  }
  </code></pre>
  
  <p><strong><em>NOTE:</em></strong> I am using that weird "handlers" object to manage the event's callback, so that I do not have an arrow function directly in the ReactstrapButton properties, avoiding creating a new object each time and thus preventing the component from being re-rendered.</p>
  
  <p>And a corresponding test file in Button.unit.test.tsx:</p>
  
  <pre><code>// Button.unit.test.tsx
  import { mount, shallow } from "enzyme";
  import * as React from "react";
  
  import { Button, IButtonProps } from "./Button";
  
  interface IOnClickParamsTest {
    a: number,
    b: number
  }
  
  describe('App component', () =&gt; {
    it('renders without crashing', () =&gt; {
      shallow(
        &lt;Button /&gt;
      );
    });
  
    it('test the onClick method', () =&gt; {
      const onClick = jest.fn((event: React.MouseEvent&lt;IButtonProps&lt;IOnClickParamsTest&gt;&gt;, params: IOnClickParamsTest) =&gt; params.a + params.b);
      const onClickParams: IOnClickParamsTest = { a: 4, b: 5 };
  
      const buttonComponent = mount(
        &lt;Button&lt;IOnClickParamsTest&gt;
          onClick={onClick}
          handlersParams={{ onClickParams }}
        /&gt;
      );
      buttonComponent.simulate("click");
  
      expect(onClick).toBeCalled();
      expect(onClick.mock.calls[0][1]).toBe(onClickParams);// The second argument of the first call to the function was onClickParams
      // expect(onClick.mock.results[0].value).toBe(9);// The return value of the first call to the function was 9
    });
  
  });
  </code></pre>
  
  <p>The test passes as expected, but fails in the last commented line with following error:</p>
  
  <pre><code>TypeError: Cannot read property '0' of undefined
  </code></pre>
  
  <p>The error is referencing to the onClick.mock.results property. I have debugged the onClick.mock property and results, of course, is not there. Nevertheless, as per <a href="https://jestjs.io/docs/en/mock-functions#using-a-mock-function" rel="nofollow noreferrer">this docs</a> in Jest, there should exist a results property in there.</p>
  
  <p>By the way, I am using :</p>
  
  <pre><code>"react": "^16.4.0",
  "react-dom": "^16.4.0",
  
  "enzyme": "^3.3.0",
  "enzyme-adapter-react-16": "^1.1.1",
  "jest": "^23.1.0",
  "jest-enzyme": "^6.0.2",
  "ts-jest": "^22.4.6"
  </code></pre>
  
  <p>Any thoughts? Thank you so much in advance!</p>