Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Updating to v3.3.10 causes infinite loop for lazy query #7713

Closed
emmenko opened this issue Feb 15, 2021 · 2 comments
Closed

Updating to v3.3.10 causes infinite loop for lazy query #7713

emmenko opened this issue Feb 15, 2021 · 2 comments
Assignees
@benjamn
Labels
🚨 high-priority 🌹 has-reproduction

Comments

@emmenko
Copy link

emmenko commented Feb 15, 2021

Intended outcome:

As per title, updating to the latest version (3.3.10) should not cause any regression.

Actual outcome:

From what I was able to debug, when using useLazyQuery it seems that called is always false, causing the function to trigger the query to be called again and again.

Eventually we get this error from React

Too many re-renders. React limits the number of renders to prevent an infinite loop.

How to reproduce the issue:

If necessary, I'll try to create a reproduction. I wanted to report the issue first in case it's some known problem.
@emmenko
Copy link
Author

emmenko commented Feb 15, 2021

Here's the reproduction case: https://codesandbox.io/s/repro-apollo-issue-7713-jsn9u

benjamn added a commit that referenced this issue Feb 15, 2021
@benjamn
Fix useLazyQuery forceUpdate loop regression.
d3735a9 
PR #7655 changed this code so that the Promise.resolve().then(forceUpdate)
branch was not taken when queryDataRef.current was falsy, so forceUpdate()
was called immediately instead (the else branch).

As #7713 demonstrates, the Promise delay is important to avoid calling
forceUpdate() synchronously during the initial render, which can lead to
an infinite rendering loop.

To preserve the intent of #7655, we now do the queryDataRef.current check
inside the Promise callback, since the component could have been unmounted
before the callback fired.
@benjamn benjamn mentioned this issue Feb 15, 2021
Merged
1 task
@benjamn benjamn self-assigned this Feb 15, 2021
@benjamn
Copy link
Member

benjamn commented Feb 16, 2021

@emmenko This should be fixed in @apollo/client@3.3.11, at least in the sense that it restores the v3.3.9 behavior (no infinite loop in your reproduction). As you probably are aware, your real code probably needs some additional logic to handle loading: true before using data, and React's <StrictMode/> renders components twice, which may be surprising. Let us know if you notice any other deviations from previous behavior, or any other surprising aspects of that behavior. Thanks!

@benjamn benjamn closed this as completed Feb 16, 2021
@github-actions github-actions bot locked as resolved and limited conversation to collaborators Feb 15, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees

@benjamn benjamn

Labels
🚨 high-priority 🌹 has-reproduction
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@benjamn @emmenko @jcreighton