@apollo/client 4.0.5 → 4.1.0-alpha.0

package/core/ApolloClient.js

@@ -72,8 +72,8 @@ export class ApolloClient {
      */
     constructor(options) {
         if (__DEV__) {
-            invariant(options.cache, 65);
-            invariant(options.link, 66);
+            invariant(options.cache, 66);
+            invariant(options.link, 67);
         }
         const { cache, documentTransform, ssrMode = false, ssrForceFetchDelay = 0, queryDeduplication = true, defaultOptions, defaultContext, assumeImmutableResults = cache.assumeImmutableResults, localState, devtools, dataMasking, link, incrementalHandler = new NotImplementedHandler(), } = options;
         this.link = link;
@@ -233,13 +233,13 @@ export class ApolloClient {
             options = mergeOptions(this.defaultOptions.query, options);
         }
         if (__DEV__) {
-            invariant(options.fetchPolicy !== "cache-and-network", 67);
-            invariant(options.fetchPolicy !== "standby", 68);
-            invariant(options.query, 69);
-            invariant(options.query.kind === "Document", 70);
-            invariant(!options.returnPartialData, 71);
-            invariant(!options.pollInterval, 72);
-            invariant(!options.notifyOnNetworkStatusChange, 73);
+            invariant(options.fetchPolicy !== "cache-and-network", 68);
+            invariant(options.fetchPolicy !== "standby", 69);
+            invariant(options.query, 70);
+            invariant(options.query.kind === "Document", 71);
+            invariant(!options.returnPartialData, 72);
+            invariant(!options.pollInterval, 73);
+            invariant(!options.notifyOnNetworkStatusChange, 74);
         }
         return this.queryManager.query(options);
     }
@@ -257,9 +257,9 @@ export class ApolloClient {
             errorPolicy: "none",
         }, this.defaultOptions.mutate), options);
         if (__DEV__) {
-            invariant(optionsWithDefaults.mutation, 74);
+            invariant(optionsWithDefaults.mutation, 75);
             invariant(optionsWithDefaults.fetchPolicy === "network-only" ||
-                optionsWithDefaults.fetchPolicy === "no-cache", 75);
+                optionsWithDefaults.fetchPolicy === "no-cache", 76);
         }
         checkDocument(optionsWithDefaults.mutation, OperationTypeNode.MUTATION);
         return this.queryManager.mutate(optionsWithDefaults);
@@ -484,7 +484,7 @@ export class ApolloClient {
         // result.queries and result.results instead, you shouldn't have to worry
         // about preventing uncaught rejections for the Promise.all result.
         result.catch((error) => {
-            __DEV__ && invariant.debug(76, error);
+            __DEV__ && invariant.debug(77, error);
         });
         return result;
     }

package/core/ObservableQuery.d.ts

@@ -285,6 +285,7 @@ export declare class ObservableQuery<TData = unknown, TVariables extends Operati
     private linkSubscription?;
     private pollingInfo?;
     private get networkStatus();
+    private get cache();
     constructor({ queryManager, options, transformedQuery, }: {
         queryManager: QueryManager;
         options: ApolloClient.WatchQueryOptions<TData, TVariables>;

package/core/ObservableQuery.js

@@ -1,6 +1,6 @@
 import { equal } from "@wry/equality";
-import { BehaviorSubject, Observable, share, Subject, tap } from "rxjs";
-import { isNetworkRequestInFlight } from "@apollo/client/utilities";
+import { BehaviorSubject, filter, Observable, share, Subject, tap } from "rxjs";
+import { isNetworkRequestInFlight, isNetworkRequestSettled, } from "@apollo/client/utilities";
 import { __DEV__ } from "@apollo/client/utilities/environment";
 import { compact, equalByQuery, filterMap, getOperationDefinition, getOperationName, getQueryDefinition, preventUnhandledRejection, toQueryResult, } from "@apollo/client/utilities/internal";
 import { invariant } from "@apollo/client/utilities/invariant";
@@ -60,6 +60,9 @@ export class ObservableQuery {
     get networkStatus() {
         return this.subject.getValue().result.networkStatus;
     }
+    get cache() {
+        return this.queryManager.cache;
+    }
     constructor({ queryManager, options, transformedQuery = queryManager.transform(options.query), }) {
         this.queryManager = queryManager;
         // active state
@@ -197,7 +200,7 @@ export class ObservableQuery {
     * @deprecated This is an internal API and should not be used directly. This can be removed or changed at any time.
     */
     getCacheDiff({ optimistic = true } = {}) {
-        return this.queryManager.cache.diff({
+        return this.cache.diff({
             query: this.query,
             variables: this.variables,
             returnPartialData: true,
@@ -308,7 +311,7 @@ export class ObservableQuery {
                 }
             },
         };
-        const cancelWatch = this.queryManager.cache.watch(watch);
+        const cancelWatch = this.cache.watch(watch);
         this.unsubscribeFromCache = Object.assign(() => {
             this.unsubscribeFromCache = undefined;
             cancelWatch();
@@ -372,7 +375,7 @@ export class ObservableQuery {
             const queryDef = getQueryDefinition(this.query);
             const vars = queryDef.variableDefinitions;
             if (!vars || !vars.some((v) => v.variable.name.value === "variables")) {
-                __DEV__ && invariant.warn(77, variables, queryDef.name?.value || queryDef);
+                __DEV__ && invariant.warn(78, variables, queryDef.name?.value || queryDef);
             }
         }
         if (variables && !equal(this.variables, variables)) {
@@ -388,7 +391,7 @@ export class ObservableQuery {
     fetchMore({ query, variables, context, errorPolicy, updateQuery, }) {
         invariant(
             this.options.fetchPolicy !== "cache-only",
-            78,
+            79,
             getOperationName(this.query, "(anonymous)")
         );
         const combinedOptions = {
@@ -422,7 +425,7 @@ export class ObservableQuery {
         let wasUpdated = false;
         const isCached = this.options.fetchPolicy !== "no-cache";
         if (!isCached) {
-            invariant(updateQuery, 79);
+            invariant(updateQuery, 80);
         }
         const { finalize, pushNotification } = this.pushOperation(NetworkStatus.fetchMore);
         pushNotification({
@@ -430,105 +433,153 @@ export class ObservableQuery {
             kind: "N",
             value: {},
         }, { shouldEmit: 3 /* EmitBehavior.networkStatusChange */ });
-        return this.queryManager
-            .fetchQuery(combinedOptions, NetworkStatus.fetchMore)
-            .then((fetchMoreResult) => {
-            // disable the `fetchMore` override that is currently active
-            // the next updates caused by this should not be `fetchMore` anymore,
-            // but `ready` or whatever other calculated loading state is currently
-            // appropriate
-            finalize();
-            if (isCached) {
-                // Performing this cache update inside a cache.batch transaction ensures
-                // any affected cache.watch watchers are notified at most once about any
-                // updates. Most watchers will be using the QueryInfo class, which
-                // responds to notifications by calling reobserveCacheFirst to deliver
-                // fetchMore cache results back to this ObservableQuery.
-                this.queryManager.cache.batch({
-                    update: (cache) => {
-                        if (updateQuery) {
-                            cache.updateQuery({
-                                query: this.query,
-                                variables: this.variables,
-                                returnPartialData: true,
-                                optimistic: false,
-                            }, (previous) => updateQuery(previous, {
-                                fetchMoreResult: fetchMoreResult.data,
-                                variables: combinedOptions.variables,
-                            }));
-                        }
-                        else {
-                            // If we're using a field policy instead of updateQuery, the only
-                            // thing we need to do is write the new data to the cache using
-                            // combinedOptions.variables (instead of this.variables, which is
-                            // what this.updateQuery uses, because it works by abusing the
-                            // original field value, keyed by the original variables).
-                            cache.writeQuery({
-                                query: combinedOptions.query,
-                                variables: combinedOptions.variables,
-                                data: fetchMoreResult.data,
-                            });
-                        }
-                    },
-                    onWatchUpdated: (watch) => {
-                        if (watch.watcher === this) {
-                            wasUpdated = true;
-                        }
-                    },
-                });
-            }
-            else {
-                // There is a possibility `lastResult` may not be set when
-                // `fetchMore` is called which would cause this to crash. This should
-                // only happen if we haven't previously reported a result. We don't
-                // quite know what the right behavior should be here since this block
-                // of code runs after the fetch result has executed on the network.
-                // We plan to let it crash in the meantime.
-                //
-                // If we get bug reports due to the `data` property access on
-                // undefined, this should give us a real-world scenario that we can
-                // use to test against and determine the right behavior. If we do end
-                // up changing this behavior, this may require, for example, an
-                // adjustment to the types on `updateQuery` since that function
-                // expects that the first argument always contains previous result
-                // data, but not `undefined`.
-                const lastResult = this.getCurrentResult();
-                const data = updateQuery(lastResult.data, {
-                    fetchMoreResult: fetchMoreResult.data,
-                    variables: combinedOptions.variables,
-                });
-                // was reportResult
-                pushNotification({
-                    kind: "N",
-                    value: {
-                        ...lastResult,
-                        networkStatus: NetworkStatus.ready,
-                        // will be overwritten anyways, just here for types sake
-                        loading: false,
-                        data: data,
-                        dataState: lastResult.dataState === "streaming" ? "streaming" : "complete",
-                    },
-                    source: "network",
-                });
+        const { promise, operator } = getTrackingOperatorPromise((value) => {
+            switch (value.kind) {
+                case "E": {
+                    throw value.error;
+                }
+                case "N": {
+                    if (value.source !== "newNetworkStatus" && !value.value.loading) {
+                        return value.value;
+                    }
+                }
             }
-            return this.maskResult(fetchMoreResult);
-        })
+        });
+        const { observable } = this.queryManager.fetchObservableWithInfo(combinedOptions, { networkStatus: NetworkStatus.fetchMore });
+        const subscription = observable
+            .pipe(operator, filter((notification) => notification.kind === "N" && notification.source === "network"))
+            .subscribe({
+            next: (notification) => {
+                wasUpdated = false;
+                const fetchMoreResult = notification.value;
+                if (isNetworkRequestSettled(notification.value.networkStatus)) {
+                    finalize();
+                }
+                if (isCached) {
+                    // Performing this cache update inside a cache.batch transaction ensures
+                    // any affected cache.watch watchers are notified at most once about any
+                    // updates. Most watchers will be using the QueryInfo class, which
+                    // responds to notifications by calling reobserveCacheFirst to deliver
+                    // fetchMore cache results back to this ObservableQuery.
+                    this.cache.batch({
+                        update: (cache) => {
+                            if (updateQuery) {
+                                cache.updateQuery({
+                                    query: this.query,
+                                    variables: this.variables,
+                                    returnPartialData: true,
+                                    optimistic: false,
+                                }, (previous) => updateQuery(previous, {
+                                    fetchMoreResult: fetchMoreResult.data,
+                                    variables: combinedOptions.variables,
+                                }));
+                            }
+                            else {
+                                // If we're using a field policy instead of updateQuery, the only
+                                // thing we need to do is write the new data to the cache using
+                                // combinedOptions.variables (instead of this.variables, which is
+                                // what this.updateQuery uses, because it works by abusing the
+                                // original field value, keyed by the original variables).
+                                cache.writeQuery({
+                                    query: combinedOptions.query,
+                                    variables: combinedOptions.variables,
+                                    data: fetchMoreResult.data,
+                                });
+                            }
+                        },
+                        onWatchUpdated: (watch, diff) => {
+                            if (watch.watcher === this) {
+                                wasUpdated = true;
+                                const lastResult = this.getCurrentResult();
+                                // Let the cache watch from resubscribeCache handle the final
+                                // result
+                                if (isNetworkRequestInFlight(fetchMoreResult.networkStatus)) {
+                                    pushNotification({
+                                        kind: "N",
+                                        source: "network",
+                                        value: {
+                                            ...lastResult,
+                                            networkStatus: (fetchMoreResult.networkStatus ===
+                                                NetworkStatus.error) ?
+                                                NetworkStatus.ready
+                                                : fetchMoreResult.networkStatus,
+                                            // will be overwritten anyways, just here for types sake
+                                            loading: false,
+                                            data: diff.result,
+                                            dataState: fetchMoreResult.dataState === "streaming" ?
+                                                "streaming"
+                                                : "complete",
+                                        },
+                                    });
+                                }
+                            }
+                        },
+                    });
+                }
+                else {
+                    // There is a possibility `lastResult` may not be set when
+                    // `fetchMore` is called which would cause this to crash. This should
+                    // only happen if we haven't previously reported a result. We don't
+                    // quite know what the right behavior should be here since this block
+                    // of code runs after the fetch result has executed on the network.
+                    // We plan to let it crash in the meantime.
+                    //
+                    // If we get bug reports due to the `data` property access on
+                    // undefined, this should give us a real-world scenario that we can
+                    // use to test against and determine the right behavior. If we do end
+                    // up changing this behavior, this may require, for example, an
+                    // adjustment to the types on `updateQuery` since that function
+                    // expects that the first argument always contains previous result
+                    // data, but not `undefined`.
+                    const lastResult = this.getCurrentResult();
+                    const data = updateQuery(lastResult.data, {
+                        fetchMoreResult: fetchMoreResult.data,
+                        variables: combinedOptions.variables,
+                    });
+                    pushNotification({
+                        kind: "N",
+                        value: {
+                            ...lastResult,
+                            networkStatus: NetworkStatus.ready,
+                            // will be overwritten anyways, just here for types sake
+                            loading: false,
+                            data: data,
+                            dataState: lastResult.dataState === "streaming" ?
+                                "streaming"
+                                : "complete",
+                        },
+                        source: "network",
+                    });
+                }
+            },
+        });
+        return preventUnhandledRejection(promise
+            .then((result) => toQueryResult(this.maskResult(result)))
             .finally(() => {
-            // call `finalize` a second time in case the `.then` case above was not reached
-            finalize();
-            // In case the cache writes above did not generate a broadcast
-            // notification (which would have been intercepted by onWatchUpdated),
-            // likely because the written data were the same as what was already in
-            // the cache, we still want fetchMore to deliver its final loading:false
-            // result with the unchanged data.
+            subscription.unsubscribe();
             if (isCached && !wasUpdated) {
-                pushNotification({
-                    kind: "N",
-                    source: "newNetworkStatus",
-                    value: {},
-                }, { shouldEmit: 1 /* EmitBehavior.force */ });
+                finalize();
+                const lastResult = this.getCurrentResult();
+                if (lastResult.networkStatus === NetworkStatus.streaming) {
+                    pushNotification({
+                        kind: "N",
+                        source: "network",
+                        value: {
+                            ...lastResult,
+                            dataState: "complete",
+                            networkStatus: NetworkStatus.ready,
+                        },
+                    });
+                }
+                else {
+                    pushNotification({
+                        kind: "N",
+                        source: "newNetworkStatus",
+                        value: {},
+                    }, { shouldEmit: 1 /* EmitBehavior.force */ });
+                }
             }
-        });
+        }));
     }
     // XXX the subscription variables are separate from the query variables.
     // if you want to update subscription variables, right now you have to do that separately,
@@ -554,7 +605,7 @@ export class ObservableQuery {
                         onError(error);
                     }
                     else {
-                        invariant.error(80, error);
+                        invariant.error(81, error);
                     }
                     return;
                 }
@@ -632,7 +683,7 @@ export class ObservableQuery {
             previousData: result,
         });
         if (newResult) {
-            queryManager.cache.writeQuery({
+            this.cache.writeQuery({
                 query: this.options.query,
                 data: newResult,
                 variables: this.variables,
@@ -798,7 +849,7 @@ export class ObservableQuery {
                 if (!this.didWarnCacheOnlyPolling &&
                     pollInterval &&
                     fetchPolicy === "cache-only") {
-                    __DEV__ && invariant.warn(81, getOperationName(this.query, "(anonymous)"));
+                    __DEV__ && invariant.warn(82, getOperationName(this.query, "(anonymous)"));
                     this.didWarnCacheOnlyPolling = true;
                 }
             }
@@ -1065,8 +1116,8 @@ export class ObservableQuery {
         const { dirty } = this;
         this.resetNotifications();
         if (dirty &&
-            (this.options.fetchPolicy == "cache-only" ||
-                this.options.fetchPolicy == "cache-and-network" ||
+            (this.options.fetchPolicy === "cache-only" ||
+                this.options.fetchPolicy === "cache-and-network" ||
                 !this.activeOperations.size)) {
             const diff = this.getCacheDiff();
             if (
@@ -1294,7 +1345,7 @@ export class ObservableQuery {
 }
 export function logMissingFieldErrors(missing) {
     if (__DEV__ && missing) {
-        __DEV__ && invariant.debug(82, missing);
+        __DEV__ && invariant.debug(83, missing);
     }
 }
 function isEqualQuery(a, b) {