title: How to find count of a div containing specific value in React, Jest and Enzyme
body: <p>I am looking for a solution using React, Jest and Enzyme. I am a newbie to these technologies.</p>
  
  <p>I could get a few simple tests to run. Now here is what I want to test:</p>
  
  <pre><code>&lt;div className="trow"&gt;
              &lt;div className="tcolid" &gt;101&lt;/div&gt;
              &lt;div className="tcolname"&gt;Joe&lt;/div&gt;
              &lt;div className="tcolgender"&gt;M&lt;/div&gt;
            &lt;/div&gt;
  
            &lt;div className="trow"&gt;
              &lt;div className="tcolid" &gt;102&lt;/div&gt;
              &lt;div className="tcolname"&gt;Abc&lt;/div&gt;
              &lt;div className="tcolgender"&gt;F&lt;/div&gt;
            &lt;/div&gt;
  
            &lt;div className="trow"&gt;
              &lt;div className="tcolid" &gt;103&lt;/div&gt;
              &lt;div className="tcolname"&gt;Xyz&lt;/div&gt;
              &lt;div className="tcolgender"&gt;F&lt;/div&gt;
            &lt;/div&gt;
            ...
            ...
  </code></pre>
  
  <p>My React component consumes data from a rest api. The API can return multiple records male and/or female. My requirement is to  ensure only a single male employee to be rendered in UI. I have that achieved - not a problem.</p>
  
  <p>When I am writing tests using Jest and Enzyme I want to check that when I render I only render a single html element having a value 'M'.</p>
  
  <p>Here is what I have tried - Jest / Enzyme does not like it.</p>
  
  <pre><code>expect (wrapper.find("div.tcolgender").text()).toEqual("M").toHaveLength(1);
  </code></pre>
  
  <p>This does not work. I looked at the Enzyme API - dont find any 'count' or similar such method. Note - this is a 'full' render and not a 'shallow' render.</p>