onError loop

[MiKaminskas]

Intended outcome:

I'm trying to set data from query to state. For It I'm using useQuery hook and useEffect. Also i need to do some action in case of error for it I'm using onError callback.

Actual outcome:

If I add callback then component is starting to loop. If I comment(or delete) this onError then it doesn't loop.

How to reproduce the issue:

I tried to reproduce this bug, but it freezes codesandbox, so I made the screenshot.

Versions

System:
   OS: Windows 10
 Binaries:
   Node:   10.15.1
   npm: 6.4.1 - C:\NodeJS-v10.15.1\npm.CMD
 Browsers:
   Edge: 41.16299.1004.0
   Chrome 76
 npmPackages:
   apollo-boost: ^0.4.4 => 0.4.4
   apollo-cache-inmemory: ^1.6.3 => 1.6.3
   apollo-client: ^2.6.4 => 2.6.4
   apollo-link-context: ^1.0.18 => 1.0.18
   apollo-link-http: ^1.5.15 => 1.5.15
   react-apollo: ^3.0.1 => 3.0.1

[dylanwulf]

This could be related to my issue: apollographql/react-apollo#3407

I found that the problem only happens if onError or onComplete are specified as inline functions. If you define those functions as class instance methods or memoized functions then the problem stops happening.

[dylanwulf]

I created a PR which I believe will fix this issue: apollographql/react-apollo#3419

[MiKaminskas]

I found that the problem only happens if onError or onComplete are specified as inline functions. If you define those functions as class instance methods or memoized functions then the problem stops happening.

I use Functional Component. In my case it help only if I move onError function outside of component. Memorized functiond didn't help.