Duplicating code for `act` warnings in Integration Tests

[ritchieanesco]

Hi Kent,

So, it took a while to get my head around what act warnings were and how to go about fixing it (thanks in part to your article https://kentcdodds.com/blog/fix-the-not-wrapped-in-act-warning.

I am currently writing integration tests for a multi-step form which contains a session timeout. Basically the user has 10 mins to complete the form or a modal window will appear warning them the amount of time remaining.

The act warnings were due to the session timeout but as mentioned I've fixed that issue. I am now finding that every integration test i write now needs to include the 'session timeout' assertion. See below example.

// Example
it('should render', async () => {
  const {getTestById } = renderTest()
   // fixes the act warning
   await waitFor(() => getTestById('timer-notification')
   act(() => advanceByTime(1000)
   await waitFor(() => getTestById('timer-text')
   // test for labels and fields
});

it('should validate', async () => {
  const {getTestById } = renderTest()
   // fixes the act warning
   await waitFor(() => getTestById('timer-notification')
   act(() => advanceByTime(1000)
   await waitFor(() => getTestById('timer-text')
   // validation assertion here
});

it('should submit', async () => {
  const {getTestById } = renderTest()
   // fixes the act warning
   await waitFor(() => getTestById('timer-notification')
   act(() => advanceByTime(1000)
   await waitFor(() => getTestById('timer-text')
   // submit assertion here
});

...

I have mixed feelings about this as I know we should test what a user would expect however I feel this also adds noise to what we are trying to test. What are your thoughts?

[kentcdodds]

Hi @ritchieanesco,

I answered this during office hours today: https://www.youtube.com/watch?v=ph_dQoIKzoY