title: How to test a TextField Material-UI element with React Jest?
body: <p>I built up a component with React and Material-UI. I'm using React and Redux.</p>
  
  <p>my <strong>index.jsx</strong> looks like this:</p>
  
  <pre><code>import React from 'react';
  import { render } from 'react-dom';
  import { Provider } from 'react-redux';
  import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
  import configureStore from '../store/configureStore';
  import Routes from '../routes/routes';
  import '../styles/main.less';
  
  const store = configureStore();
  render(
    &lt;Provider store={store}&gt;
      &lt;MuiThemeProvider&gt;
        &lt;Routes /&gt;
      &lt;/MuiThemeProvider&gt;
    &lt;/Provider&gt;,
    document.getElementById('app'),
  );
  </code></pre>
  
  <p>My component <code>InputSearch</code> looks like this:</p>
  
  <pre><code>import React, { PropTypes, Component } from 'react';
  import TextField from 'material-ui/TextField';
  
  class InputSearch extends Component {
    ...
  
    render() {
      return (
        ...
        &lt;TextField
          defaultValue={this.props.keyword}
          ref={(input) =&gt; { this.input = input; }}
          autoFocus
          hintText='Type a keyword'
          errorText={this.state.errorText}
          floatingLabelText='Search for keyword'
          style={styles.textField}
        /&gt;
      );
    }
  }
  
  InputSearch.propTypes = {
    keyword: PropTypes.string.isRequired,
    resetSearch: PropTypes.func.isRequired,
    searchBooks: PropTypes.func.isRequired,
    toggleResultsOpacity: PropTypes.func.isRequired,
    firstSearch: PropTypes.bool.isRequired,
  };
  
  export default InputSearch;
  </code></pre>
  
  <p>I'm using Airbnb Enzyme and Jest to build unit tests.
  My test to the <code>InputSearch</code> component looks like this:</p>
  
  <pre><code>import React from 'react';
  import { shallow, mount } from 'enzyme';
  import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
  import TextField from 'material-ui/TextField';
  import InputSearch from '../components/InputSearch/InputSearch';
  
  const resetSearchMock = jest.fn();
  const searchBooksMock = jest.fn();
  const toggleResultsOpacityMock = jest.fn();
  
  const setup = () =&gt; {
    const props = {
      keyword: '',
      resetSearch: resetSearchMock,
      searchBooks: searchBooksMock,
      toggleResultsOpacity: toggleResultsOpacityMock,
      firstSearch: true,
    };
  
    const wrapper = shallow(&lt;MuiThemeProvider&gt;&lt;InputSearch {...props} /&gt;&lt;/MuiThemeProvider&gt;);
  
    return {
      props,
      wrapper,
    };
  };
  
  describe('Initial test', () =&gt; {
    test('Shows error message when input search is empty.', () =&gt; {
      const { wrapper, props } = setup();
      expect(wrapper.find(TextField).getValue()).toEqual('');
    });
  }
  </code></pre>
  
  <p>However, I'm getting the following error:</p>
  
  <p><code>TypeError: wrapper.find(...).getValue is not a function</code></p>
  
  <p>Can anyone help me reach the right way to check the value of the Material UI <code>TextField</code>, please?</p>