title: Jest / react-testing-library / React - unable to find an element.. with async calls
body: <p>I am getting this error, for this test:</p>
  <p><em><strong>Unable to find an element by: [data-testid=&quot;detail-result&quot;]</strong></em></p>
  <pre><code>import { render, screen, cleanup } from &quot;@testing-library/react&quot;;
  import { QueryClient, QueryClientProvider } from &quot;react-query&quot;;
  import Comp1 from &quot;./Comp1&quot;;
  import { DataProvider } from &quot;./Context&quot;;
  
  const queryClient = new QueryClient();
  
  describe(&quot;Comp1 tests&quot;, () =&gt; {
    beforeEach(() =&gt; {
      jest.useFakeTimers();
    });
  
    it(&quot;Should give correct response with render&quot;, async () =&gt; {
      render(
        &lt;QueryClientProvider client={queryClient}&gt;
          &lt;DataProvider&gt;
            &lt;Comp1 /&gt;
          &lt;/DataProvider&gt;
        &lt;/QueryClientProvider&gt;
      );
      expect(await screen.findByTestId(&quot;detail-result&quot;)).toBeInTheDocument();
    });
  });
  
  afterEach(cleanup);
  </code></pre>
  <p>I know it is something to do with the api call waiting for the other one to finish, but even with async/await I get the error:</p>
  <p>recreated here: <a href="https://codesandbox.io/s/musing-fast-g495f?file=/src/Comp1.test.js" rel="nofollow noreferrer">Sandbox</a></p>