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.

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

Wrapped component never gets updated after an error #1229

Open
jay1337 opened this issue Oct 11, 2017 · 13 comments

Comments

Projects
None yet
8 participants
@jay1337
Copy link

commented Oct 11, 2017

Intended outcome:
I have a React component wrapped with the graphql function to get data from a GraphQL query.
The query is called on mounting, on this.props.data.refetch(), or at some time if pollInterval is set.
If any of these calls fails, I expect the component to be updated if a new call succeed, so that:

  • I can add a "Retry" button to let the user manually trigger a refetch if the first call on mounting failed. If the refetch succeeds then the data.error prop changes to undefined and the component gets updated with the data received.
  • If pollInterval is set and if at some point the network connection is lost, then when the connection is back the polling works as if the connection was never lost. So I want the polling to continue even if a poll has failed in the past and I want the component to be updated if new data is available (coming from a new poll of the same request or from the result of any other query or mutation in the app)

Actual outcome:
After an error, data.error remains defined and component never gets updated, even if data.refetch is called or if pollInterval is set.

My understanding:
Basically, when there is a network error, observers are unsubscribed. Thus any refetch only update Apollo store but does not trigger a rerender of the component.
I think it's the expected behaviour of the cleanupSubscription call in https://github.com/apollographql/apollo-link/blob/master/packages/zen-observable-ts/src/zenObservable.ts
Which is called through obs.error(error) in https://github.com/apollographql/apollo-client/blob/master/packages/apollo-client/src/core/ObservableQuery.ts
But I think react-apollo should resubscribe to the query after an error to keep the component updated when new data arrive in the cache (after a data.refetch, a poll, or any other query or mutation in the app).

Version

  • apollo-client@2.0.0-beta.4
  • react-apollo@1.4.16

This is the issue asked here apollographql/apollo-client#1186 (comment)

@stale

This comment has been minimized.

Copy link

commented Nov 1, 2017

This issue has been automatically labled because it has not had recent activity. If you have not received a response from anyone, please mention the repository maintainer (most likely @jbaxleyiii). It will be closed if no further activity occurs. Thank you for your contributions to React Apollo!

@stale stale bot added the no-recent-activity label Nov 1, 2017

@jay1337

This comment has been minimized.

Copy link
Author

commented Nov 1, 2017

Hey !

@stale stale bot removed the no-recent-activity label Nov 1, 2017

@msmfsd

This comment has been minimized.

Copy link

commented Nov 6, 2017

BUMP - this is an important issue with v2 - can someone please look at this?

Basically data.error is not cleared on refetch.

@lnikkila

This comment has been minimized.

Copy link

commented Nov 6, 2017

We’re seeing this as well with newer versions of dependencies:

apollo-cache-inmemory@1.0.0
apollo-cache@1.0.0
apollo-client@2.0.1
apollo-link-context@1.0.0
apollo-link-dedup@1.0.0
apollo-link-error@1.0.0
apollo-link-http@1.0.0
apollo-link@1.0.0
apollo-utilities@1.0.0
react-apollo@2.0.0
@leethree

This comment has been minimized.

Copy link

commented Nov 14, 2017

I'm seeing the same problem with React-Apollo 2.0. The wrapped components are not re-rendered after data.refetch().

@msmfsd

This comment has been minimized.

Copy link

commented Nov 15, 2017

@jozanza

This comment has been minimized.

Copy link
Contributor

commented Nov 22, 2017

Setting pollInterval also seems to have no effect for me in apollo-client@2.0.3 and react-apollo@2.0.1

@slonoed

This comment has been minimized.

Copy link

commented Jan 19, 2018

Did anyone found a workaround for it?

@jay1337

This comment has been minimized.

Copy link
Author

commented Jan 23, 2018

@slonoed you can change

                        assign(data, (this.queryObservable.getLastResult() || {}).data);

by

                        assign(data, (this.queryObservable.getLastResult() || {}).data, { retry: () => {
													this.unsubscribeFromQuery();
													this.queryObservable = null;
													this.previousData = {};
			                    this.updateQuery(this.props);
			                    if (!this.shouldSkip(this.props)) {
			                        this.subscribeToQuery();
			                    }
												} });

around line 560 of node_modules/react-apollo/react-apollo.browser.umd.js

It will pass a retry function to the component that you can call with this.props.data.retry().

@slonoed

This comment has been minimized.

Copy link

commented Jan 23, 2018

@jay1337 thanks! I don't really want to change library code.
Did you consider to make a PR?

Also, I'm curious:
Is it possible to spin up a new query from app code?

@jay1337

This comment has been minimized.

Copy link
Author

commented Jan 23, 2018

@0m15

This comment has been minimized.

Copy link

commented Jan 27, 2018

any news about this issue? I'm experiencing it as well with freshly installed apollo client:

"react-apollo": "^2.0.4"
"apollo-client-preset": "^1.0.6"

@nfantone nfantone referenced this issue Feb 8, 2018

Closed

reset last results on new observer subscribe #2871

0 of 3 tasks complete
@mephju

This comment has been minimized.

Copy link

commented Apr 15, 2018

I'm also experiencing this.
"apollo-client": "^2.2.8"
"react-apollo": "^2.1.3"

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.