title: test onChange event in enzyme and jest with refs
body: <p>I am using <code>ref</code> to get the value of input box. I want to make a test case of search component where it can simulate the onChange event. If I running my <code>handleSearchChange</code> from test case. it is not able to resolve <code>ref</code>.</p>
  
  <blockquote>
    <p>Component</p>
  </blockquote>
  
  <pre><code>import React,{ Component } from 'react';
  import { injectProps } from 'relpers';
  import PropTypes from 'prop-types';
  
  
  export class Search extends Component{
  
    state = {
      searchValue: ''
    }
  
    handleSearchChange = ()=&gt;{
      const { handleInputChange } = this.props;
      let searchValue = this.search.value;
      this.setState({
        searchValue
      });
      //handleInputChange(searchValue);
    }
  
    render(){
      let { searchValue } = this.state;
      let { placeHolder } = this.props;
      return (
        &lt;form&gt;
          &lt;input
            id={'searchInput'}
            placeholder={placeHolder}
            ref={input =&gt; this.search = input}
            value={searchValue}
            onChange={this.handleSearchChange}
          /&gt;
        &lt;/form&gt;
      )
    }
  }
  
  
  Search.propTypes = {
    placeHolder: PropTypes.string,
    handleInputChange: PropTypes.func,
  };
  
  Search.defaultProps = {
    placeHolder: "Search for order..",
    handleInputChange:()=&gt;{}
  };
  </code></pre>
  
  <blockquote>
    <p>Test case</p>
  </blockquote>
  
  <pre><code>import React from 'react';
  import { shallow } from 'enzyme';
  import { Search } from './search';
  
  describe('&lt;Search /&gt; component test cases', ()=&gt;{
    it('check if search component render properly',()=&gt;{
      const wrapper = shallow(&lt;Search /&gt;);
      expect(wrapper.find('input')).toHaveLength(1);
    });
  
    it('checks if handleSearchChange method works correctly', () =&gt; {
      const wrapper = shallow(&lt;Search /&gt;);
      const searchInput = wrapper.find("#searchInput");
      searchInput.value = "123456";
      searchInput.simulate('change');
      expect(wrapper.instance().state.searchValue).toEqual('123456');
    });
  })
  </code></pre>
  
  <blockquote>
    <p>Error
    <a href="https://i.stack.imgur.com/rvPLF.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/rvPLF.png" alt="enter image description here"></a></p>
  </blockquote>
  
  <p><strong>Edited</strong></p>
  
  <p>Checking ref with mount</p>
  
  <pre><code>it('checks if handleSearchChange method works correctly', () =&gt; {
      const wrapper = mount(&lt;Search /&gt;);
      const instance = wrapper.instance();
  
      const searchInput = wrapper.find("#searchInput");
      searchInput.value = "123456";
      searchInput.simulate('change');
      expect(wrapper.instance().state.searchValue).toEqual('123456');
    });
  </code></pre>