title: Why does react hook throw the act error when used with fetch api?
body: <p>I keep getting <code>Warning: An update to App inside a test was not wrapped in act(...).</code> in my test suite whenever I make an API request and update the state.</p>
  
  <p>I'm making use of react-testing-library. I also tried using ReactDOM test utils, got the same result. One other thing I tried was wrapping the container in <code>act</code>, still got the same result.</p>
  
  <p>Please note that: My App works and my test passes. I just need to know what I was doing wrong or if it's a bug in the react-dom package that's making that error show up. And it's bad to mock the console error and mute it.</p>
  
  <pre><code>global.fetch = require('jest-fetch-mock');
  
  it('should clear select content item', async () =&gt; {
      fetch.mockResponseOnce(JSON.stringify({ results: data }));
  
      const { container } = render(&lt;App /&gt;);
  
      const content = container.querySelector('.content');
  
      await wait();
  
      expect(content.querySelectorAll('.content--item').length).toBe(2);
  });
  </code></pre>
  
  <p>Here's the hook implementation:</p>
  
  <pre><code>const [data, setData] = useState([]);
  const [error, setError] = useState('');
  
  const fetchInitData = async () =&gt; {
      try {
          const res = await fetch(API_URL);
          const data = await res.json();
  
          if (data.fault) {
              setError('Rate limit Exceeded');
          } else {
              setData(data.results);
          }
      } catch(e) {
          setError(e.message);
      }
  };
  
  useEffect(() =&gt; {
      fetchInitData();
  }, [isEqual(data)]);
  </code></pre>