title: Why do I need to wrap React/Enzyme state changes in act?
body: <p>In my simple React/ReactDOM/Enzyme unit test I get a warning from ReactDOM about wrapping any mutations to state in <code>act()</code>. Why do I need to do this if my test passes anyway? I have 50 or so React components that all use hooks, custom hooks, etc. and I never wrap in <code>act()</code> and they all pass.</p>
  
  <p>Can I just disable this warning? I don't want to add extra code for what appears to be no reason.</p>
  
  <p>The warning:</p>
  
  <pre><code>Warning: An update to MyComponent inside a test was not wrapped in act(...).
  
      When testing, code that causes React state updates should be wrapped into act(...):
  
      act(() =&gt; {
        /* fire events that update state */
      });
      /* assert on the output */
  
      This ensures that you're testing the behavior the user would see in the browser. Learn more at [redacted]
  </code></pre>
  
  <p>My test:</p>
  
  <pre><code>const App = () =&gt; {
    const [isLoaded, setIsLoaded] = useState(false);
  
    const myOnClick = () =&gt; {
      setIsLoaded(true);
    };
  
    return (
      &lt;div onClick={myOnClick}&gt;
        {isLoaded ? 'Yes' : 'No'}
      &lt;/div&gt;
    )
  }
  </code></pre>
  
  <pre><code>describe('My test', () =&gt; {
    let wrapper
  
    beforeAll(() =&gt; {
      wrapper = mount(&lt;App /&gt;)
    })
  
    it('renders "no"', () =&gt; {
      expect(wrapper.text()).toBe('No')
    })
  
    describe('When onClick is called', () =&gt; {
      beforeAll(() =&gt; {
        wrapper.find('div').prop('onClick')()
      })
  
      it('renders "yes"', () =&gt; {
        expect(wrapper.text()).toBe('Yes')
      })
    })
  })
  </code></pre>
  
  <p>CodeSandbox repro: <a href="https://codesandbox.io/s/react-169-act-warning-repro-olm8o?expanddevtools=1&amp;fontsize=14&amp;hidenavigation=1&amp;previewwindow=tests" rel="noreferrer">https://codesandbox.io/s/react-169-act-warning-repro-olm8o?expanddevtools=1&amp;fontsize=14&amp;hidenavigation=1&amp;previewwindow=tests</a></p>