title: fireEvent doesn't click button on React component
body: <p>I'm writing tests for a React component. It's a timer that starts counting down when you press a button, then stops when you press the same button. I have a test case that tries to press the pause button, wait a second, then press the pause button again, checking the timer to make sure that a second has elapsed:</p>
  <p><code>Timer.test.js</code></p>
  <pre class="lang-js prettyprint-override"><code>render(&lt;Timer /&gt;)
  const pauseButton = screen.getByText('pause')
  const timerOutput = screen.getAllByRole('heading')[1]
  
  describe('Timer', () =&gt; {
    test('Timer starts counting down when unpaused', done =&gt; {
      function fetchTime(callback) {
        fireEvent.click(pauseButton)
        setTimeout(
          fireEvent.click(pauseButton),
          1250
        )
        return callback(timerOutput)
      }
  
      function callback(data) {
        try {
          expect(data).toHaveTextContent('24:59')
          done()
        } catch(error) {
          done(error)
        }
      }
  
      fetchTime(callback)
    })
  })
  </code></pre>
  <p>The problem is, the test doesn't seem to be hitting click on <code>pauseButton</code> the way I want it to. Jest tells me in the terminal when I run my test that <code>timerOutput</code> turns out to be <code>'25:00'</code> rather than <code>'24:59'</code>, and it seems as if the component failed the test. But this is a problem with the test, not the component; when I run the app in my browser and press the button myself, it works the way it should. How do I get this test to work properly, and hit the buttons the way I want it to?</p>