I have a test where if /endpoint1
fails, an error message should be displayed. The test passes however I get the following error from React Testing Library:
Warning: An update to HomePage inside a test was not wrapped in act(...).
Here's the snipper for clarity. You can see I'm using SWR to send requests. I'm mocking requests using Mock Service Worker.
export default function App() {
const { data: data1, error: error1 } = useSwr("/endpoint1")
const { data: data2, error: error2 } = useSwr("/endpoint2")
if (error1 || error2) {
return <Error />
}
return <Success />
}
The error is present because /endpoint2
resolves after /endpoint1
, causing the component to rerender. I believed that cancelling the second request once the first one errors would work. I made a wrapper around useSwr()
that used AbortController()
and exposed an cancel()
function however the same error would occur with this snippet:
export default function App() {
const { data: data1, error: error1, cancel: cancel1 } = useCancellableSwr(
"/endpoint1"
)
const { data: data2, error: error2, cancel: cancel2 } = useCancellableSwr(
"/endpoint2"
)
if (error1 || error2) {
if (!data1 || !error1) cancel2()
if (!data2 || !error2) cancel1()
return <Error />
}
return <Success />
}
For some reason, even after cancelling one endpoint, it still resolves and causes a rerender. Am I missing something here? Thanks
Aucun commentaire:
Enregistrer un commentaire