search

apollographql / react-apollo

:recycle: React integration for Apollo Client
https://www.apollographql.com/docs/react/
MIT License
6.85k stars 790 forks source link

Fixed unmounted component state update #4021

Open mccraveiro opened 4 years ago

mccraveiro commented 4 years ago

In my project I'm getting the following error with useQuery:

Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in %s.%s, a useEffect cleanup function,

After some debugging, I came into this line: https://github.com/apollographql/react-apollo/blob/4bd40a94b18102b1eb42864d2e59d52ced0303f5/packages/hooks/src/utils/useBaseQuery.ts#L34

Because of the re-render in a microtask this may cause the hook to update the state of an unmounted component. Adding a isMounted check fixed the issue.

I'm not sure how to add tests for this. Any suggestions?

apollo-cla commented 4 years ago

@mccraveiro: Thank you for submitting a pull request! Before we can merge it, you'll need to sign the Apollo Contributor License Agreement here: https://contribute.apollographql.com/

mccraveiro commented 4 years ago

@benjamn @hwillson Should I move this PR to the apollo-client repository? This patch will need to be applied on both.