title: How to get the element with the testid using react testing library?
body: <p>Hi i want to access the first div with class "icon" using getByTestId.</p>
  
  <p>below is how the DOM looks,</p>
  
  <pre><code>&lt;div class="parent"&gt;
      &lt;div data-testid="add"&gt;
          &lt;div class="info"&gt;&lt;/div&gt; 
          &lt;div class="action"&gt;
              &lt;div class="icon"/&gt; //want to access this 
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="parent"&gt;
      &lt;div data-testid="add"&gt;
          &lt;div class="info"&gt;&lt;/div&gt; 
          &lt;div class="action"&gt;
              &lt;div class="icon"/&gt; 
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>As you see from above there are multiple elements with testid "add" how can i get the first add div and access its child div with class icon. </p>
  
  <p>i have tried</p>
  
  <pre><code>const element  = queryAllByTestId('add')[0].querySelector(
      'div'
    )[1];
  </code></pre>
  
  <p>this gives element undefined.</p>
  
  <p>could someone help me with this. thanks.</p>