title: How to test an onChange input event with enzyme and jest
body: <p>I'm trying to test an onChange event of my component using <code>enzyme</code> and <code>jest</code>.
  TextFieldWrapper.jsx:</p>
  
  <pre><code>import React from "react";
  import PropTypes from "prop-types";
  import TextField from "@material-ui/core/TextField";
  
  const TextFieldWrapper = ({
    label,
    type,
    input,
    meta: { touched, error },
    multiline,
    fullWidth,
    required
  }) =&gt; {
    return (
      &lt;div&gt;
        &lt;TextField
          required={required}
          label={label}
          error={!!(touched &amp;&amp; error)}
          margin="normal"
          multiline={multiline}
          rows={4}
          type={type}
          value={input.value}
          onChange={input.onChange}
          variant="outlined"
          onBlur={input.onBlur}
          fullWidth={fullWidth}
          helperText={touched &amp;&amp; error ? error : ""}
        /&gt;
      &lt;/div&gt;
    );
  };
  
  TextFieldWrapper.defaultProps = {
    multiline: false,
    fullWidth: false,
    required: false
  };
  TextFieldWrapper.propTypes = {
    label: PropTypes.string.isRequired,
    type: PropTypes.string.isRequired,
    input: PropTypes.shape({}).isRequired,
    meta: PropTypes.shape({
      touched: PropTypes.bool,
      error: PropTypes.string
    }).isRequired,
    multiline: PropTypes.bool,
    fullWidth: PropTypes.bool,
    required: PropTypes.bool
  };
  
  export default TextFieldWrapper;
  </code></pre>
  
  <p>TextField.spec.js:</p>
  
  <pre><code>import React from 'react';
  import { shallow, mount } from 'enzyme';
  import TextFieldWrapper from '../../components/common/TextFieldWrapper';
  describe('TextField component', () =&gt; {
  it('Should change value when onChange was called', () =&gt; {
      const onChange = jest.fn();
      const props = {
          label: 'Test Label',
          type: 'text',
          input: {},
          value: 'Hello world',
          meta: {
              touched: true,
              error: 'error'
          },
          onChange,
      }
      const wrapper = mount(&lt;TextFieldWrapper {...props}/&gt;);
      wrapper.find('TextField').simulate('change', {
          target: {
              value: 'This is just for test'
          }
      })
      expect(onChange).toHaveBeenCalledWith('This is just for test');
  })
  
  })
  </code></pre>
  
  <p>I got this error when I run the test:</p>
  
  <pre><code>expect(jest.fn()).toHaveBeenCalledWith(expected)
  Expected mock function to have been called with:
    ["This is just for test"]
  But it was not called.
  </code></pre>
  
  <p>I found a similair question: <a href="https://stackoverflow.com/questions/43426885/enzyme-simulate-an-onchange-event">Enzyme simulate an onChange event
  </a> using enzyme whith sinon.js, however it doesn't resolve my problem.</p>