Closed
Description
We should warn against the use of act unnecessarily:
import {screen, fireEvent, render, act} from '@testing-library/react'
import userEvent from '@testing-library/user-event`
import ReactTestUtils from 'react-dom/test-utils'
// ReactTestUtils.act should be treated exactly the same as `act` from `@testing-library/react`
// these are ALL wrong:
act(() => fireEvent.click(el))
act(() => screen.getByText('blah'))
act(() => userEvent.click(el))
await act(async () => userEvent.type('hi', el))
act(() => render(<div />))
await act(async () => render(<div />))
await act(async () => {})
act(() => {})
// this one's fine:
act(() => {
stuffThatDoesNotUseRTL()
})
// actually, so is this one
act(() => {
fireEvent.click(el)
stuffThatDoesNotUseRTL()
})So basically the rule is: "You should only wrap non-testing-library function calls in act"
Reading material: https://kcd.im/react-act