@apollo/client 4.3.0-alpha.1 → 4.3.0-alpha.11

package/core/ObservableQuery.d.ts

@@ -278,12 +278,8 @@ export declare class ObservableQuery<TData = unknown, TVariables extends Operati
     readonly options: ObservableQuery.Options<TData, TVariables>;
     readonly queryName?: string;
     private variablesUnknown;
-    /**
-    * @internal will be read and written from `QueryInfo`
-    * 
-    * @deprecated This is an internal API and should not be used directly. This can be removed or changed at any time.
-    */
-    _lastWrite?: unknown;
+    private didWarnOnFeud;
+    private lastMissing?;
     get query(): TypedDocumentNode<TData, TVariables>;
     /**
      * An object containing the variables that were provided for the query.
@@ -349,7 +345,7 @@ export declare class ObservableQuery<TData = unknown, TVariables extends Operati
     */
     getCacheDiff({ optimistic }?: {
         optimistic?: boolean | undefined;
-    }): Cache.DiffResult<TData>;
+    }): Cache.InternalDiffResultWithDataState<TData>;
     private getInitialResult;
     private resubscribeCache;
     private stableLastResult?;
@@ -372,7 +368,18 @@ export declare class ObservableQuery<TData = unknown, TVariables extends Operati
     /**
      * A function that helps you fetch the next set of results for a [paginated list field](https://www.apollographql.com/docs/react/pagination/core-api/).
      */
-    fetchMore<TFetchData = TData, TFetchVars extends OperationVariables = TVariables>(options: ObservableQuery.FetchMoreOptions<TData, TVariables, TFetchData, TFetchVars>): Promise<ApolloClient.QueryResult<TFetchData>>;
+    fetchMore<TFetchData = TData, TFetchVars extends OperationVariables = TVariables, TErrorPolicy extends ErrorPolicy = "none">(options: ObservableQuery.FetchMoreOptions<TData, TVariables, TFetchData, TFetchVars> & {
+        /**
+        * Specifies how the query handles a response that returns both GraphQL errors and partial results.
+        * 
+        * For details, see [GraphQL error policies](https://www.apollographql.com/docs/react/data/error-handling/#graphql-error-policies).
+        * 
+        * The default value is `none`, meaning that the query result includes error details but not partial results.
+        * 
+        * @docGroup 1. Operation options
+        */
+        errorPolicy?: TErrorPolicy;
+    }): Promise<ApolloClient.QueryResult<TFetchData, TErrorPolicy>>;
     /**
      * A function that enables you to execute a [subscription](https://www.apollographql.com/docs/react/data/subscriptions/), usually to subscribe to specific fields that were included in the query.
      *
@@ -458,6 +465,7 @@ export declare class ObservableQuery<TData = unknown, TVariables extends Operati
     * @deprecated This is an internal API and should not be used directly. This can be removed or changed at any time.
     */
     notify(scheduled?: boolean): void;
+    private deliverCacheDiff;
     private activeOperations;
     private pushOperation;
     private calculateNetworkStatus;

package/core/ObservableQuery.js

@@ -2,8 +2,9 @@ import { equal } from "@wry/equality";
 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, extensionsSymbol, filterMap, getOperationDefinition, getOperationName, getQueryDefinition, preventUnhandledRejection, toQueryResult, variablesUnknownSymbol, } from "@apollo/client/utilities/internal";
+import { compact, equalByQuery, extensionsSymbol, filterMap, getOperationDefinition, getOperationName, getQueryDefinition, handleIncrementalSymbol, preventUnhandledRejection, toDiffWithDataState, toQueryResult, variablesUnknownSymbol, } from "@apollo/client/utilities/internal";
 import { invariant } from "@apollo/client/utilities/invariant";
+import { dataStateErrorCache } from "./dataStateErrorCache.js";
 import { NetworkStatus } from "./networkStatus.js";
 const { assign, hasOwnProperty } = Object;
 const uninitialized = {
@@ -20,16 +21,29 @@ const empty = {
     dataState: "empty",
     partial: true,
 };
+const destructiveMethodCounts = new WeakMap();
+function wrapDestructiveCacheMethod(cache, methodName) {
+    const original = cache[methodName];
+    if (typeof original === "function") {
+        // @ts-expect-error this is just too generic to be typed correctly
+        cache[methodName] = function () {
+            destructiveMethodCounts.set(cache, 
+            // The %1e15 allows the count to wrap around to 0 safely every
+            // quadrillion evictions, so there's no risk of overflow. To be
+            // clear, this is more of a pedantic principle than something
+            // that matters in any conceivable practical scenario.
+            (destructiveMethodCounts.get(cache) + 1) % 1e15);
+            // @ts-expect-error this is just too generic to be typed correctly
+            return original.apply(this, arguments);
+        };
+    }
+}
 export class ObservableQuery {
     options;
     queryName;
     variablesUnknown = false;
-    /**
-    * @internal will be read and written from `QueryInfo`
-    * 
-    * @deprecated This is an internal API and should not be used directly. This can be removed or changed at any time.
-    */
-    _lastWrite;
+    didWarnOnFeud = false;
+    lastMissing;
     // The `query` computed property will always reflect the document transformed
     // by the last run query. `this.options.query` will always reflect the raw
     // untransformed query to ensure document transforms with runtime conditionals
@@ -66,6 +80,18 @@ export class ObservableQuery {
     }
     constructor({ queryManager, options, transformedQuery = queryManager.transform(options.query), }) {
         this.queryManager = queryManager;
+        // Track how often destructive cache methods are called, since we want
+        // eviction to override the feud-stopping logic in `shouldAutoRefetch`,
+        // by causing it to return true. Wrapping these cache methods is a bit of a
+        // hack, but it saves us from having to make eviction counting an official
+        // part of the ApolloCache API.
+        const { cache } = queryManager;
+        if (!destructiveMethodCounts.has(cache)) {
+            destructiveMethodCounts.set(cache, 0);
+            wrapDestructiveCacheMethod(cache, "evict");
+            wrapDestructiveCacheMethod(cache, "modify");
+            wrapDestructiveCacheMethod(cache, "reset");
+        }
         // active state
         this.waitForNetworkResult = options.fetchPolicy === "network-only";
         this.isTornDown = false;
@@ -76,7 +102,7 @@ export class ObservableQuery {
         // Make sure we don't store "standby" as the initialFetchPolicy.
         initialFetchPolicy = fetchPolicy === "standby" ? defaultFetchPolicy : (fetchPolicy), } = options;
         if (options[variablesUnknownSymbol]) {
-            invariant(fetchPolicy === "standby", 82);
+            invariant(fetchPolicy === "standby", 83);
             this.variablesUnknown = true;
         }
         this.lastQuery = transformedQuery;
@@ -205,12 +231,13 @@ 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.cache.diff({
+        return toDiffWithDataState(this.cache.diff({
             query: this.query,
             variables: this.variables,
             returnPartialData: true,
             optimistic,
-        });
+            [handleIncrementalSymbol]: undefined,
+        }));
     }
     getInitialResult(initialFetchPolicy) {
         let fetchPolicy = initialFetchPolicy || this.options.fetchPolicy;
@@ -220,16 +247,18 @@ export class ObservableQuery {
         }
         const cacheResult = () => {
             const diff = this.getCacheDiff();
+            let { dataState } = diff;
             // TODO: queryInfo.getDiff should handle this since cache.diff returns a
             // null when returnPartialData is false
             const data = this.options.returnPartialData || diff.complete ?
                 diff.result ?? undefined
                 : undefined;
+            if (data === undefined) {
+                dataState = "empty";
+            }
             return this.maskResult({
                 data,
-                dataState: diff.complete ? "complete"
-                    : data === undefined ? "empty"
-                        : "partial",
+                dataState,
                 loading: !diff.complete,
                 networkStatus: diff.complete ? NetworkStatus.ready : NetworkStatus.loading,
                 partial: !diff.complete,
@@ -382,7 +411,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(83, variables, queryDef.name?.value || queryDef);
+                __DEV__ && invariant.warn(84, variables, queryDef.name?.value || queryDef);
             }
         }
         if (variables && !equal(this.variables, variables)) {
@@ -390,7 +419,6 @@ export class ObservableQuery {
             reobserveOptions.variables = this.options.variables =
                 this.getVariablesWithDefaults({ ...this.variables, ...variables });
         }
-        this._lastWrite = undefined;
         return this._reobserve(reobserveOptions, {
             newNetworkStatus: NetworkStatus.refetch,
         });
@@ -398,7 +426,7 @@ export class ObservableQuery {
     fetchMore({ query, variables, context, errorPolicy, updateQuery, }) {
         invariant(
             this.options.fetchPolicy !== "cache-only",
-            84,
+            85,
             getOperationName(this.query, "(anonymous)")
         );
         const combinedOptions = {
@@ -432,7 +460,7 @@ export class ObservableQuery {
         let wasUpdated = false;
         const isCached = this.options.fetchPolicy !== "no-cache";
         if (!isCached) {
-            invariant(updateQuery, 85);
+            invariant(updateQuery, 86);
         }
         const { finalize, pushNotification } = this.pushOperation(NetworkStatus.fetchMore);
         pushNotification({
@@ -509,9 +537,7 @@ export class ObservableQuery {
                                             // will be overwritten anyways, just here for types sake
                                             loading: false,
                                             data: diff.result,
-                                            dataState: fetchMoreResult.dataState === "streaming" ?
-                                                "streaming"
-                                                : "complete",
+                                            dataState: diff.complete ? "complete" : "streaming",
                                         },
                                     });
                                 }
@@ -608,7 +634,7 @@ export class ObservableQuery {
                         onError(error);
                     }
                     else {
-                        invariant.error(86, error);
+                        invariant.error(87, error);
                     }
                     return;
                 }
@@ -859,7 +885,7 @@ export class ObservableQuery {
                 if (!this.didWarnCacheOnlyPolling &&
                     pollInterval &&
                     fetchPolicy === "cache-only") {
-                    __DEV__ && invariant.warn(87, getOperationName(this.query, "(anonymous)"));
+                    __DEV__ && invariant.warn(88, getOperationName(this.query, "(anonymous)"));
                     this.didWarnCacheOnlyPolling = true;
                 }
             }
@@ -925,7 +951,10 @@ export class ObservableQuery {
     }
     _reobserve(newOptions, internalOptions) {
         this.isTornDown = false;
-        let { newNetworkStatus } = internalOptions || {};
+        let { newNetworkStatus, keepLastMissing } = internalOptions || {};
+        if (!keepLastMissing) {
+            this.lastMissing = undefined;
+        }
         this.queryManager.obsQueries.add(this);
         const useDisposableObservable = 
         // Refetching uses a disposable Observable to allow refetches using different
@@ -1066,7 +1095,7 @@ export class ObservableQuery {
         this.queryManager.obsQueries.delete(this);
         this.isTornDown = true;
         this.abortActiveOperations();
-        this._lastWrite = undefined;
+        this.lastMissing = undefined;
     }
     transformDocument(document) {
         return this.queryManager.transform(document);
@@ -1124,53 +1153,126 @@ export class ObservableQuery {
                 return;
             }
         }
-        const { dirty } = this;
+        const { dirty, lastMissing } = this;
+        const { fetchPolicy } = this.options;
         this.resetNotifications();
-        if (dirty &&
-            (this.options.fetchPolicy === "cache-only" ||
-                this.options.fetchPolicy === "cache-and-network" ||
-                !this.activeOperations.size)) {
-            const diff = this.getCacheDiff();
-            if (
-            // `fromOptimisticTransaction` is not available through the `cache.diff`
-            // code path, so we need to check it this way
-            equal(diff.result, this.getCacheDiff({ optimistic: false }).result)) {
-                //If this diff did not come from an optimistic transaction
-                // make the ObservableQuery "reobserve" the latest data
-                // using a temporary fetch policy of "cache-first", so complete cache
-                // results have a chance to be delivered without triggering additional
-                // network requests, even when options.fetchPolicy is "network-only"
-                // or "cache-and-network". All other fetch policies are preserved by
-                // this method, and are handled by calling oq.reobserve(). If this
-                // reobservation is spurious, distinctUntilChanged still has a
-                // chance to catch it before delivery to ObservableQuery subscribers.
-                this.reobserveCacheFirst();
+        if (!dirty ||
+            (fetchPolicy !== "cache-only" &&
+                fetchPolicy !== "cache-and-network" &&
+                this.activeOperations.size)) {
+            return;
+        }
+        const diff = this.getCacheDiff();
+        const current = this.getCurrentResult();
+        // `fromOptimisticTransaction` is not available through the `cache.diff`
+        // code path, so we need to check whether the cache result is an optimistic
+        // result this way.
+        const isOptimistic = !equal(diff.result, this.getCacheDiff({ optimistic: false }).result);
+        if (
+        // When this diff came from an optimistic transaction, deliver the
+        // current cache data to the ObservableQuery, but don't perform a
+        // reobservation, since oq.reobserveCacheFirst might make a network
+        // request, and we never want to trigger network requests in the
+        // middle of optimistic updates.
+        isOptimistic ||
+            // If we get a cache update in the middle of streaming (possible with
+            // cache-and-network fetch policy), just deliver the cache value without
+            // going through the full reobserve which would otherwise trigger another
+            // request (deduplication should kick in, but doing so replays any
+            // previous emits from the link chain, which get rewritten into the cache
+            // and might clobber this cache update)
+            (!diff.complete && current.networkStatus === NetworkStatus.streaming)) {
+            this.deliverCacheDiff(diff);
+            return;
+        }
+        if (diff.complete) {
+            this.lastMissing = undefined;
+        }
+        else if (!lastMissing ||
+            // If a destructive cache method has been called since the last recorded
+            // incomplete result, there's a chance fetching this data again will
+            // restore what was evicted, even though the cache result looks the same
+            // as before.
+            lastMissing.dmCount !== destructiveMethodCounts.get(this.cache) ||
+            !equal(lastMissing.variables, this.variables) ||
+            !equal(lastMissing.missing, diff.missing?.missing)) {
+            this.didWarnOnFeud = false;
+            this.lastMissing = {
+                variables: this.variables,
+                missing: diff.missing?.missing,
+                dmCount: destructiveMethodCounts.get(this.cache),
+            };
+        }
+        else if (
+        // reobserveCacheFirst with cache-only fetch policy only calls
+        // reobserve which never fetches from the network so we are ok
+        // allowing cache-only queries to fallthrough to reobserveCacheFirst.
+        // This also prevents the feud warning which would be confusing for a
+        // cache-only query anyways.
+        fetchPolicy !== "cache-only") {
+            // If we've fallen through to this case, a cache emit has returned the
+            // same missing fields which means at least one value on the fields we've
+            // already delivered have changed. We are ok delivering the updated
+            // partial result in this case to keep the result as fresh as possible. We
+            // NEVER want to downgrade this query from a complete query to a partial
+            // query though, so we also make sure we only deliver if the previous
+            // result was also partial.
+            if (current.dataState === "partial") {
+                this.deliverCacheDiff(diff);
             }
-            else {
-                // If this diff came from an optimistic transaction, deliver the
-                // current cache data to the ObservableQuery, but don't perform a
-                // reobservation, since oq.reobserveCacheFirst might make a network
-                // request, and we never want to trigger network requests in the
-                // middle of optimistic updates.
-                this.input.next({
-                    kind: "N",
-                    value: {
-                        data: diff.result,
-                        dataState: diff.complete ? "complete"
-                            : diff.result ? "partial"
-                                : "empty",
-                        networkStatus: NetworkStatus.ready,
-                        loading: false,
-                        error: undefined,
-                        partial: !diff.complete,
-                    },
-                    source: "cache",
-                    query: this.query,
-                    variables: this.variables,
-                    meta: {},
-                });
+            // If the (partial) result is the same as the last partial result
+            // we recorded from a previous broadcast (and the variables match
+            // too), avoid calling reobserveCacheFirst to refetch this query
+            // again. If we allow refetching anytime this result becomes partial,
+            // we risk feuds between queries competing to update the same data in
+            // incompatible ways, which can lead to an endless cycle of cache
+            // broadcasts and useless network requests. As with any
+            // feud, eventually one side must step back from the brink,
+            // letting the other side(s) have the last word(s). There may
+            // be other points where we could break this cycle, such as
+            // silencing the broadcast for cache.writeQuery (not a good
+            // idea, since it just delays the feud a bit) or somehow
+            // avoiding the network request that just happened (also bad,
+            // because the server could return useful new data). All
+            // options considered, returning early and stopping the
+            // reobserveCacheFirst cycle seems to be the least damaging place to
+            // break the cycle because it allows read functions/custom scalars to
+            // be applied to the feuding query while avoiding the endless cycle of
+            // requests.
+            if (__DEV__ && !this.didWarnOnFeud) {
+                this.didWarnOnFeud = true;
+                warnOnFeud(this.query, diff);
             }
+            return;
         }
+        //If this diff did not come from an optimistic transaction
+        // make the ObservableQuery "reobserve" the latest data
+        // using a temporary fetch policy of "cache-first", so complete cache
+        // results have a chance to be delivered without triggering additional
+        // network requests, even when options.fetchPolicy is "network-only"
+        // or "cache-and-network". All other fetch policies are preserved by
+        // this method, and are handled by calling oq.reobserve(). If this
+        // reobservation is spurious, distinctUntilChanged still has a
+        // chance to catch it before delivery to ObservableQuery subscribers.
+        this.reobserveCacheFirst();
+    }
+    deliverCacheDiff(diff) {
+        const current = this.getCurrentResult();
+        this.input.next({
+            kind: "N",
+            value: {
+                data: diff.result,
+                dataState: diff.dataState,
+                networkStatus: current.networkStatus,
+                loading: current.loading,
+                error: undefined,
+                partial: !diff.complete,
+            },
+            source: "cache",
+            query: this.query,
+            variables: this.variables,
+            meta: {},
+        });
     }
     activeOperations = new Set();
     pushOperation(networkStatus) {
@@ -1233,6 +1335,7 @@ export class ObservableQuery {
         // exception for cache-only queries - we reset them into a "ready" state
         // as we won't trigger a refetch for them
         const resetToEmpty = this.options.fetchPolicy === "cache-only";
+        this.lastMissing = undefined;
         this.setResult(resetToEmpty ? empty : uninitialized, {
             shouldEmit: resetToEmpty ? 1 /* EmitBehavior.force */ : 2 /* EmitBehavior.never */,
         });
@@ -1254,19 +1357,55 @@ export class ObservableQuery {
         });
     }
     operator = filterMap((notification) => {
-        const { query, variables, meta } = notification;
+        const { query, meta } = notification;
         if (notification.source === "setResult") {
-            return { query, variables, result: notification.value, meta };
+            return {
+                query,
+                variables: this.variables,
+                result: notification.value,
+                meta,
+            };
+        }
+        if (notification.kind === "C") {
+            return;
         }
-        if (notification.kind === "C" || !isEqualQuery(notification, this)) {
+        const resolvedVariables = "resolvedVariables" in notification ?
+            notification.resolvedVariables
+            : undefined;
+        // Usually we prefer to drop notifications that don't match this query
+        // but this breaks when used with `@export` queries that resolve variables
+        // after the request is initiated. `notification.resolvedVariables` gives us
+        // the variables the query actually resolved with during evaluation in
+        // QueryManager (which is the variables value after `@export` variables have
+        // been applied), but we need to update this query with those resolved
+        // variables maybe in the middle of a request (updating is handled below).
+        // When we update this.variables to the resolved variables, this causes
+        // isEqualQuery(notification, this) to fail for future notifications since
+        // the notification.variables holds the stale variables value. In this case,
+        // we want to allow the notification through only if the current variables
+        // value matches the resolved variables.
+        //
+        // Note: the check for matching resolved variables typically kicks in for
+        // multi-emission fetches (such as defer, or cache-and-network, etc).
+        if (notification.query !== this.query) {
             return;
         }
+        if (!equal(resolvedVariables, this.variables)) {
+            if (!equal(notification.variables, this.variables)) {
+                return;
+            }
+            if (resolvedVariables) {
+                this.options.variables = resolvedVariables;
+                this.resubscribeCache();
+            }
+        }
+        const variables = this.variables;
         let result;
         const previous = this.subject.getValue();
         if (notification.source === "cache") {
             result = notification.value;
             if (result.networkStatus === NetworkStatus.ready &&
-                result.partial &&
+                result.dataState === "partial" &&
                 (!this.options.returnPartialData ||
                     previous.result.networkStatus === NetworkStatus.error) &&
                 this.options.fetchPolicy !== "cache-only") {
@@ -1281,7 +1420,9 @@ export class ObservableQuery {
             result =
                 notification.kind === "E" ?
                     {
-                        ...(isEqualQuery(previous, notification) ?
+                        ...((isEqualQuery(previous, notification) ||
+                            (resolvedVariables &&
+                                equal(resolvedVariables, previous.variables))) ?
                             previous.result
                             : { data: undefined, dataState: "empty", partial: true }),
                         error: notification.error,
@@ -1290,7 +1431,8 @@ export class ObservableQuery {
                     }
                     : notification.value;
             if (notification.kind === "E" && result.dataState === "streaming") {
-                result.dataState = "complete";
+                result.dataState =
+                    dataStateErrorCache.get(notification.error) ?? "complete";
             }
             if (result.error) {
                 meta.shouldEmit = 1 /* EmitBehavior.force */;
@@ -1338,7 +1480,10 @@ export class ObservableQuery {
     reobserveCacheFirst() {
         const { fetchPolicy, nextFetchPolicy } = this.options;
         if (fetchPolicy === "cache-and-network" || fetchPolicy === "network-only") {
-            this.reobserve({
+            // Preserve this.lastMissing so a cache update that triggers this
+            // reobserve doesn't reset feud detection. All user-initiated calls to
+            // reobserve (refetch/poll/reobserve, etc) should clear it.
+            this._reobserve({
                 fetchPolicy: "cache-first",
                 // Use a temporary nextFetchPolicy function that replaces itself with the
                 // previous nextFetchPolicy value and returns the original fetchPolicy.
@@ -1354,10 +1499,10 @@ export class ObservableQuery {
                     // Otherwise go back to the original this.options.fetchPolicy.
                     return fetchPolicy;
                 },
-            });
+            }, { keepLastMissing: true });
         }
         else {
-            this.reobserve();
+            this._reobserve(undefined, { keepLastMissing: true });
         }
     }
     getVariablesWithDefaults(variables) {
@@ -1366,7 +1511,7 @@ export class ObservableQuery {
 }
 export function logMissingFieldErrors(missing) {
     if (__DEV__ && missing) {
-        __DEV__ && invariant.debug(88, missing);
+        __DEV__ && invariant.debug(89, missing);
     }
 }
 function isEqualQuery(a, b) {
@@ -1409,4 +1554,7 @@ function getTrackingOperatorPromise(defaultValue) {
     });
     return { promise, operator };
 }
+function warnOnFeud(query, diff) {
+    __DEV__ && invariant.warn(90, getOperationName(query, "(anonymous)"), diff.missing?.missing);
+}
 //# sourceMappingURL=ObservableQuery.js.map