title: Unable pass test for no 'li' in 'ul' using Enzyme and Jest
body: <p>Simple todo list app to get started with Jest and Enzyme. </p>
  
  <p>In App.js I am rendering the following component where props.list is equal to an empty array on the state. </p>
  
  <pre><code>export const Ul = ({list}) =&gt; {
      return (
          &lt;ul className="list" &gt;
            {list.map((item,i) =&gt; &lt;li key={i}&gt;{item}&lt;/li&gt; )}
          &lt;/ul&gt;
      ) 
  }
  </code></pre>
  
  <p>Viewing it in Chrome the element renders as expected. </p>
  
  <pre><code>&lt;ul class="list"&gt;&lt;/ul&gt; 
  </code></pre>
  
  <p>Viewing the dom generated by Enzyme in the console using <code>wrapper.debug()</code>  the component is rendering as:</p>
  
  <pre><code>    &lt;Ul list={{...}}&gt;
          &lt;ul className="list" /&gt;
      &lt;/Ul&gt;
  </code></pre>
  
  <p>I find that odd and don't know why.</p>
  
  <p>My problem is I am unable to pass a test checking for no 'li' children within the UL with the following: </p>
  
  <pre><code>it('ul initially has no children', () =&gt; {
      const wrapper = mount(&lt;App /&gt;);
      expect(wrapper.find('.list').children()).to.have.lengthOf(0);
      // const ul = wrapper.find('.list');
      // expect(ul).toHaveLength(0); 
  })
  </code></pre>
  
  <p>I keep getting "TypeError: Cannot read property 'have' of undefined" which makes me think it's not finding the <ul></ul> in the first place. </p>
  
  <p>Am I just incorrectly using the jest/enzyme api?</p>