title: Get state for child components connected to redux with enzyme
body: <p>I am trying to test a redux connected component. The component changes its properties on a resize event. </p>
  
  <p>I want to mount my DatePicker component with enzyme, dispatch a resize event, and test that my DatePicker's prop value <code>IS_DESKTOP_VIEWPORT === true</code> and because of this, my DatePicker's state has changed as well.</p>
  
  <p>However I cannot access the state of my DatePicker because enzyme does not let you access the state if the wrapper component is not the root:</p>
  
  <pre><code>console.log(wrapper.find('DatePicker').state())
  // ReactWrapper::state() can only be called on the root
  </code></pre>
  
  <p>I've tried wrapping the connected DatePicker in a Provider as the docs suggest, as well as mounting it directly but passing store as a prop. Neither of these methods seem to allow me to refer to DatePicker as the root component and thus neither of these methods allow me to get the state of my component.</p>
  
  <p>Here are my attempts:
  The output of these console logs is here: <a href="https://gist.github.com/gecko25/56fb14154585a2d06697c399685c9111" rel="nofollow noreferrer">https://gist.github.com/gecko25/56fb14154585a2d06697c399685c9111</a></p>
  
  <pre><code>import React from 'react';
  import { Provider } from 'react-redux';
  import PropTypes from 'prop-types';
  import { mount } from 'enzyme';
  import configureDataStore from '%SRC%/store/configure';
  import { windowResize } from '%CONSTANTS%/store/actions';
  import  ConnectedDatePicker, { DatePicker }  from './DatePicker';
  
  const DESKTOP = 1025;
  
  describe('calendar open and closes', () =&gt; {
  
      test('connected attempt #1', ()=&gt;{
  
          const store = configureDataStore();
  
          const options = {
            context: { store },
            childContextTypes: { store: PropTypes.object }
          }
  
          const wrapper = mount(&lt;ConnectedDatePicker store={store}/&gt;)
  
          store.dispatch(windowResize(DESKTOP));
  
          console.log('state--&gt;', wrapper.state()) // {}
          console.log('props--&gt;', wrapper.props()) // Doesn't include all my component specific props
          console.log(wrapper.find('DatePicker').props()) // Prints all props as expected
          console.log(wrapper.find('DatePicker').state()) // Error
  
          console.log('--------------------------')
  
      })
  
      test('connected attempt #2', () =&gt; {
  
          const store = configureDataStore();
  
          const options = {
            context: { store },
            childContextTypes: { store: PropTypes.object }
          }
  
          const wrapper = mount(&lt;ConnectedDatePicker/&gt;, options)
  
          store.dispatch(windowResize(DESKTOP));
  
  
          console.log('state--&gt;', wrapper.state()) // {}
          console.log('props--&gt;', wrapper.props()) // Doesn't include all my component specific props
          console.log(wrapper.find('DatePicker').props()) // Prints all props as expected
          console.log(wrapper.find('DatePicker').state()) // Error
  
      });
  
      test('connected attempt #3', () =&gt; {
  
          const store = configureDataStore();
  
          const wrapper = mount(&lt;Provider store={store}&gt;&lt;ConnectedDatePicker/&gt;&lt;/Provider&gt;)
  
          store.dispatch(windowResize(DESKTOP));
  
          console.log('state--&gt;', wrapper.state()) // null
          console.log('props--&gt;', wrapper.props()); // Doesn't include all my component specific props
          console.log(wrapper.find('DatePicker').props()) // Prints all props as expected
          console.log(wrapper.find('DatePicker').state()) // Error
          console.log('--------------------------')
  
      });
  });
  </code></pre>