facebook / relay

Relay is a JavaScript framework for building data-driven React applications.
https://relay.dev
MIT License
18.42k stars 1.83k forks source link

Network fails cause useLazyLoadQuery to produce cryptic console errors #3208

Open maraisr opened 4 years ago

maraisr commented 4 years ago

Logging here, will edit with a repro after some more investigation.


Looks like if in the network layer if an exception was fired, and subsequently calls execute.error. That useLazyLoadQueryNode has no idea about this error, and still tries to run as normal. Which in turns leaves preparedQueryResult undefined, and causes useFragmentNode to try and get .name from undefined.

So my question is, should a network error still try and resolve a fragment?

Possibly undefined

https://github.com/facebook/relay/blob/a6ad4d857af6c11666f54f72eaca2f63fa0f2e58/packages/relay-experimental/useLazyLoadQueryNode.js#L67-L77

Leaving this to fail

https://github.com/facebook/relay/blob/a6ad4d857af6c11666f54f72eaca2f63fa0f2e58/packages/relay-experimental/useLazyLoadQueryNode.js#L121-L125

fragmentNode is undefined

https://github.com/facebook/relay/blob/a6ad4d857af6c11666f54f72eaca2f63fa0f2e58/packages/relay-runtime/util/getFragmentIdentifier.js#L67

sibelius commented 4 years ago

can you share the code of your network layer function?

maraisr commented 4 years ago

Its nothing much, other than just standard stuff. Its more that if the network properly failed, like auth issues or something that populates the errors array from the response. Then the network fn must throw right?

https://gist.github.com/maraisr/87a8fa1dbac3b918f2a628f1e016fad6

sibelius commented 4 years ago

can you setup a repro?

stale[bot] commented 3 years ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

maraisr commented 3 years ago

I think we should keep this one open Stale bot,

cc @en_js @kassens

piotrblasiak commented 3 years ago

I'm experiencing the same issue. Any progress on this?

piotrblasiak commented 3 years ago

This issue seems related: https://github.com/facebook/relay/issues/3160

piotrblasiak commented 3 years ago

Another problem with the hook is that it seems that the result is stored in the cache, which means that doing a retry using the ErrorBoundary way approach from the docs doesn't work but simply hits the cache every time.

TheOpenDevProject commented 3 years ago

Still can't find a work-around for this.

stale[bot] commented 2 years ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

Dremora commented 2 years ago

Not ideal, but passing UNSTABLE_renderPolicy: 'full' to the query options makes the error go away. Still an issue on 14.1.0.

Update: in my case the error seems to be originating during SSR in Next.js. It's somewhat confusingly displayed in the browser, but I couldn't reproduce any issues on the client side. So perhaps it's not directly related to the OP's issue.

Update 2: it seems the error does happen in the browser, but only during the initial hydration phase, and only in dev mode, assuming server-side query has completed successfully, but the same query failed in the browser.

molinch commented 2 months ago

@maraisr @piotrblasiak @TheOpenDevProject Did you finally fix it, and if so how ?