Apollo-client: query() returns null-data

Created on 27 May 2018 · 4Comments · Source: apollographql/apollo-client

Hallo,
I've got an Angular app and today updated from Angular Client 2.2.2 to the latest version 2.3.1. Suddenly, queries don't work anymore. For example, the following small code snippet always results in:

{
    data: null,
    loading: false,
    networkStatus: 7,
    stale: true
}

Here is the snippet:

export class HomeComponent {
    constructor(private apollo: Apollo) {
    }

    public onTestButton(): void {
        const client = this.apollo.getClient();
        client.query({
            query: gql`
                query GetCountries {
                    countries {
                        _id
                        name
                    }
                }
            `,
            fetchPolicy: "network-only"
        })
        .then(data => console.dir(data))
        .catch(error => console.error(error));
    }
}

Is this a known issue? I debugged into Apollo Client and I could see that the real data was actually received in QueryManager.fetchRequest, but from that point on the code is rather complicated for a starter like me.

Further info: with fetch policy "no-cache" the data is correctly returned.

needs-reproduction

Source

blissi

👍2

Most helpful comment

I believe you might had encountered the problem I described here: https://github.com/apollographql/apollo-client/issues/3030#issuecomment-448472845

jdorleans on 19 Dec 2018

❤3 👍2

All 4 comments

I found out that the complete-field of the newData-field of the query is set to false. The only place where this is set seems to be in the fetchRequest()-function:

                        if (fetchPolicy !== 'no-cache') {
                            try {
                                _this.dataStore.markQueryResult(result, document, variables, fetchMoreForQueryId, errorPolicy === 'ignore' || errorPolicy === 'all');
                            }
                            catch (e) {
                                reject(e);
                                return;
                            }
                        }
                        else {
                            _this.setQuery(queryId, function () { return ({
                                newData: { result: result.data, complete: true },
                            }); });
                        }

Thus, this is only set for fetch policy "no-cache".

The code that evaluates the complete-field is isMissing = !newData.complete ? !newData.complete : false; in queryListenerForObserver.

Any idea?

blissi on 28 May 2018

Any chance you could put together a small runnable reproduction for this? That would greatly help with troubleshooting. Thanks!