Open cdaringe opened 4 years ago
Intended outcome:
useQuery to yield {loading: false, data: { ...data-from-cache... }}
useQuery
{loading: false, data: { ...data-from-cache... }}
Actual outcome:
useQuery yields {loading: true, data: { ...data-from-cache...}}
{loading: true, data: { ...data-from-cache...}}
How to reproduce the issue:
an easily cloneable, runnable reproduction is found here: https://github.com/cdaringe/apollo-bad-ssr-state.
on ssr the following events occur, ending in an incorrect SSR state:
await getDataFromTree(app)
{loading: false, data ...good-data...}
ReactDOM.renderToString(...)
{ loading: true, error: undefined, data: ...good-data... }
by debugging in my component on SSR, useQuery went thru the following transitions in a single request:
{loading: true, data: undefined}
<App />
{loading: false, data: CORRECT_DATA}
getDataFromTree
{loading: true, data: CORRECT_DATA}
ReactDom::renderToString
loading
Version
System: OS: macOS 10.15.4 Binaries: Node: 13.13.0 - ~/.nvm/versions/node/v13.13.0/bin/node Yarn: 1.19.1 - ~/.yarn/bin/yarn npm: 6.14.4 - ~/.nvm/versions/node/v13.13.0/bin/npm Browsers: Chrome: 81.0.4044.138 Firefox: 75.0 Safari: 13.1 npmPackages: @apollo/client: 3.0.0-beta.39 => 3.0.0-beta.39 @apollo/react-ssr: ^4.0.0-beta.1 => 4.0.0-beta.1
Exactly the same behaviour @apollo/client: 3.0.0-beta.50
Intended outcome:
useQuery
to yield{loading: false, data: { ...data-from-cache... }}
Actual outcome:
useQuery
yields{loading: true, data: { ...data-from-cache...}}
How to reproduce the issue:
an easily cloneable, runnable reproduction is found here: https://github.com/cdaringe/apollo-bad-ssr-state.
problem
on ssr the following events occur, ending in an incorrect SSR state:
useQuery
executesawait getDataFromTree(app)
occursuseQuery
completes, client cache updated with query results. last result ofuseQuery
correctly has state of{loading: false, data ...good-data...}
ReactDOM.renderToString(...)
is called,useQuery
returns{ loading: true, error: undefined, data: ...good-data... }
by debugging in my component on SSR,
useQuery
went thru the following transitions in a single request:{loading: true, data: undefined}
, on when first calling<App />
{loading: false, data: CORRECT_DATA}
, whilegetDataFromTree
was awaitinguseQuery
to settle{loading: true, data: CORRECT_DATA}
, onReactDom::renderToString
. blast!loading
should be false 😢 .Version
System: OS: macOS 10.15.4 Binaries: Node: 13.13.0 - ~/.nvm/versions/node/v13.13.0/bin/node Yarn: 1.19.1 - ~/.yarn/bin/yarn npm: 6.14.4 - ~/.nvm/versions/node/v13.13.0/bin/npm Browsers: Chrome: 81.0.4044.138 Firefox: 75.0 Safari: 13.1 npmPackages: @apollo/client: 3.0.0-beta.39 => 3.0.0-beta.39 @apollo/react-ssr: ^4.0.0-beta.1 => 4.0.0-beta.1