-
Notifications
You must be signed in to change notification settings - Fork 767
v2.5.0+ re-render prevented on loading change in Query component #2887
Description
Intended outcome:
I have a list of items that displays data from Query component and a modal form that opens up and calls refetch from the aforementioned Query component when the form is submitted. After network request from refetch has been completed, the component should re-render itself to pass the updated loading/networkStatus values to the render prop, even if the data returned from the server is the same as the data in local cache.
Actual outcome:
After network request from calling refetch has been completed, the queryObservable's next handler gets called, but second if block (https://github.com/apollographql/react-apollo/blob/master/src/Query.tsx#L335-L342)
prevents the component from re-rendering.
How to reproduce the issue:
https://stackblitz.com/edit/react-bv7rtg?file=index.js
Please follow the link to see how to reproduce a simplified version of my current situation. It seems that when I toggle open state in App component (equivalent to opening a modal form), the lastResult variable in Query component (defined here https://github.com/apollographql/react-apollo/blob/master/src/Query.tsx#L126) is set to the last query result which looks something like
{
loading: false,
networkStatus: 7,
data: { ... }
}
and when the refetch request is done, the query result that gets passed to the queryObservable's next handler (https://github.com/apollographql/react-apollo/blob/master/src/Query.tsx#L327-L346) is
{
loading: false,
networkStatus: 7,
data: { ...(same as before) }
}
This satisfies the second if block (https://github.com/apollographql/react-apollo/blob/master/src/Query.tsx#L335-L342) so updateCurrentData doesn't get called and the Query component is not re-rendered.
Version