title: Test a React Hook that uses Resize Observer
body: <p>I created a simple Hook that uses <code>ResizeObserver</code> behind the scenes to run a <code>setState</code> update every time the element is resized.</p>
  
  <p>It works in the browser, but now the problem that I have is that I have no idea how to write tests for it. I tried <code>react-testing-library/hooks</code> but the hook is never called, and I think is because of ResizeObserver.</p>
  
  <p>I tried with Jest, Enzyme, @testing-library but I cannot find a way to really run a test against it.</p>
  
  <p>Basically, in the test, I create a component </p>
  
  <pre><code>function Component {
    const [ref, width] = myHook();
  
    return (
       &lt;div ref={ref}&gt;{width}&lt;/div&gt;
    )
  }
  </code></pre>
  
  <p>Then I set, for example:</p>
  
  <p><code>window.innerWidth = 400</code> (I tried to resize and call the hook inside the <code>act</code> function but nothing). At this point the hook will read the <code>ref.current.width</code> and return the <code>width</code> value</p>
  
  <p>I expect <code>value</code> to change on resize, but it does not. However this exact component, when used in the browser works fine. How can I make sure that <code>ResizeObserver</code>  is called? I also imported the polyfill but nothing. Mocking ResizeObserver will make it impossible for me to test the hook and I cannot call the hook outside a React Function! 
  Any help is appreciated, thanks!</p>