fix: make sure that fetch cache sets are properly awaited

Next.js does not await promises that update the incremental cache for fetch requests,
that is needed in our runtime otherwise the cache updates get lost, so this change
makes sure that the promise is properly awaited via `waitUntil`

Author: dario-piotrowicz

.changeset/few-ducks-listen.md

@@ -0,0 +1,9 @@
+---
+"@opennextjs/cloudflare": patch
+---
+
+fix: make sure that fetch cache `set`s are properly awaited
+
+Next.js does not await promises that update the incremental cache for fetch requests,
+that is needed in our runtime otherwise the cache updates get lost, so this change
+makes sure that the promise is properly awaited via `waitUntil`

packages/cloudflare/src/cli/build/bundle-server.ts

@@ -10,6 +10,7 @@ import { patchVercelOgLibrary } from "./patches/ast/patch-vercel-og-library.js";
 import { patchWebpackRuntime } from "./patches/ast/webpack-runtime.js";
 import * as patches from "./patches/index.js";
 import { ContentUpdater } from "./patches/plugins/content-updater.js";
+import { patchFetchCacheSetMissingWaitUntil } from "./patches/plugins/fetch-cache-wait-until.js";
 import { patchLoadInstrumentation } from "./patches/plugins/load-instrumentation.js";
 import { handleOptionalDependencies } from "./patches/plugins/optional-deps.js";
 import { fixRequire } from "./patches/plugins/require.js";
@@ -87,6 +88,7 @@ export async function bundleServer(buildOpts: BuildOptions): Promise<void> {
       fixRequire(updater),
       handleOptionalDependencies(optionalDependencies),
       patchLoadInstrumentation(updater),
+      patchFetchCacheSetMissingWaitUntil(updater),
       // Apply updater updaters, must be the last plugin
       updater.plugin,
     ],

packages/cloudflare/src/cli/build/patches/plugins/fetch-cache-wait-until.spec.ts

@@ -0,0 +1,31 @@
+import { describe, expect, test } from "vitest";
+
+import { patchCode } from "../ast/util.js";
+import { rule } from "./fetch-cache-wait-until.js";
+
+describe("patchFetchCacheSetMissingWaitUntil", () => {
+  test("patch", () => {
+    const code = `
+{
+  let [o4, a2] = (0, d2.cloneResponse)(e3);
+  return o4.arrayBuffer().then(async (e4) => {
+    var a3;
+    let i4 = Buffer.from(e4), s3 = { headers: Object.fromEntries(o4.headers.entries()), body: i4.toString("base64"), status: o4.status, url: o4.url };
+    null == $ || null == (a3 = $.serverComponentsHmrCache) || a3.set(n2, s3), F && await H.set(n2, { kind: c2.CachedRouteKind.FETCH, data: s3, revalidate: t5 }, { fetchCache: true, revalidate: r4, fetchUrl: _, fetchIdx: q, tags: A2 });
+  }).catch((e4) => console.warn("Failed to set fetch cache", u4, e4)).finally(X), a2;
+}`;
+
+    expect(patchCode(code, rule)).toMatchInlineSnapshot(`
+      "{
+        let [o4, a2] = (0, d2.cloneResponse)(e3);
+        globalThis.__openNextAls.getStore().waitUntil(o4.arrayBuffer().then(async (e4) => {
+          var a3;
+          let i4 = Buffer.from(e4), s3 = { headers: Object.fromEntries(o4.headers.entries()), body: i4.toString("base64"), status: o4.status, url: o4.url };
+          null == $ || null == (a3 = $.serverComponentsHmrCache) || a3.set(n2, s3), F && await H.set(n2, { kind: c2.CachedRouteKind.FETCH, data: s3, revalidate: t5 }, { fetchCache: true, revalidate: r4, fetchUrl: _, fetchIdx: q, tags: A2 });
+        }).catch((e4) => console.warn("Failed to set fetch cache", u4, e4)).finally(X));
+      return a2;
+
+      }"
+    `);
+  });
+});

packages/cloudflare/src/cli/build/patches/plugins/fetch-cache-wait-until.ts

@@ -0,0 +1,42 @@
+import { patchCode } from "../ast/util.js";
+import type { ContentUpdater } from "./content-updater.js";
+
+/**
+ * The following Next.js code sets values in the incremental cache for fetch calls:
+ *  https://github.com/vercel/next.js/blob/e5fc495e3d4/packages/next/src/server/lib/patch-fetch.ts#L690-L728
+ *
+ * The issue here is that this promise is never awaited in the Next.js code (since in a standard node.js server
+ * the promise will eventually simply just run) but we do need to run it inside `waitUntil` (so that the worker
+ * is not killed before the promise is fully executed), without that this promise gets discarded and values
+ * don't get saved in the incremental cache.
+ *
+ * This function wraps the promise in a `waitUntil` call (retrieved from `globalThis.__openNextAls.getStore()`).
+ */
+export function patchFetchCacheSetMissingWaitUntil(updater: ContentUpdater) {
+  return updater.updateContent(
+    "patch-fetch-cache-set-missing-wait-until",
+    { filter: /\.(js|mjs|cjs|jsx|ts|tsx)$/ },
+    ({ contents }) => {
+      if (/Failed to set fetch cache/.test(contents)) {
+        return patchCode(contents, rule);
+      }
+    }
+  );
+}
+
+export const rule = `
+rule:
+  kind: return_statement
+  all:
+    - pattern: return $PROMISE, $CLONED2
+    - regex: Failed to set fetch cache
+    - follows:
+        kind: lexical_declaration
+        all:
+          - pattern: let [$CLONED1, $CLONED2]
+    
+
+fix: |
+  globalThis.__openNextAls.getStore().waitUntil($PROMISE);
+  return $CLONED2;
+`;