(core) - Fix ssrExchange.restoreData adding invalidated results

.changeset/cuddly-readers-walk.md

@@ -0,0 +1,5 @@
+---
+'@urql/core': patch
+---
+
+Prevent `ssrExchange().restoreData()` from adding results to the exchange that have already been invalidated. This may happen when `restoreData()` is called repeatedly, e.g. per page. When a prior run has already invalidated an SSR result then the result is 'migrated' to the user's `cacheExchange`, which means that `restoreData()` should never attempt to re-add it again.

packages/core/src/exchanges/ssr.test.ts

@@ -176,9 +176,40 @@ it('deletes cached results in non-suspense environments', async () => {
 
   await Promise.resolve();
 
-  expect(Object.keys(ssr.extractData()).length).toBe(0);
+  expect(ssr.extractData()[queryOperation.key]).toBe(null);
   expect(onPush).toHaveBeenCalledWith(queryResponse);
 
   // NOTE: The operation should not be duplicated
   expect(output).not.toHaveBeenCalled();
 });
+
+it('never allows restoration of invalidated results', async () => {
+  client.suspense = false;
+
+  const onPush = jest.fn();
+  const initialState = { [queryOperation.key]: serializedQueryResponse as any };
+
+  const ssr = ssrExchange({
+    isClient: true,
+    initialState: { ...initialState },
+  });
+
+  const { source: ops$, next } = input;
+  const exchange = ssr(exchangeInput)(ops$);
+
+  pipe(exchange, forEach(onPush));
+  next(queryOperation);
+
+  await Promise.resolve();
+
+  expect(ssr.extractData()[queryOperation.key]).toBe(null);
+  expect(onPush).toHaveBeenCalledTimes(1);
+  expect(output).not.toHaveBeenCalled();
+
+  ssr.restoreData(initialState);
+  expect(ssr.extractData()[queryOperation.key]).toBe(null);
+
+  next(queryOperation);
+  expect(onPush).toHaveBeenCalledTimes(2);
+  expect(output).toHaveBeenCalledTimes(1);
+});

packages/core/src/exchanges/ssr.ts

@@ -12,7 +12,7 @@ export interface SerializedResult {
 }
 
 export interface SSRData {
-  [key: string]: SerializedResult;
+  [key: string]: SerializedResult | null;
 }
 
 export interface SSRExchangeParams {
@@ -101,13 +101,15 @@ export const ssrExchange = (params?: SSRExchangeParams): SSRExchange => {
     if (invalidateQueue.length === 1) {
       Promise.resolve().then(() => {
         let key: number | void;
-        while ((key = invalidateQueue.shift())) delete data[key];
+        while ((key = invalidateQueue.shift())) {
+          data[key] = null;
+        }
       });
     }
   };
 
   const isCached = (operation: Operation) => {
-    return !shouldSkip(operation) && data[operation.key] !== undefined;
+    return !shouldSkip(operation) && data[operation.key] != null;
   };
 
   // The SSR Exchange is a temporary cache that can populate results into data for suspense
@@ -134,7 +136,7 @@ export const ssrExchange = (params?: SSRExchangeParams): SSRExchange => {
       sharedOps$,
       filter(op => isCached(op)),
       map(op => {
-        const serialized = data[op.key];
+        const serialized = data[op.key]!;
         return deserializeResult(op, serialized);
       })
     );
@@ -159,7 +161,15 @@ export const ssrExchange = (params?: SSRExchangeParams): SSRExchange => {
     return merge([forwardedOps$, cachedOps$]);
   };
 
-  ssr.restoreData = (restore: SSRData) => Object.assign(data, restore);
+  ssr.restoreData = (restore: SSRData) => {
+    for (const key in restore) {
+      // We only restore data that hasn't been previously invalidated
+      if (data[key] !== null) {
+        data[key] = restore[key];
+      }
+    }
+  };
+
   ssr.extractData = () => Object.assign({}, data);
 
   if (params && params.initialState) {