patch use cache for ISR

Author: conico974

packages/open-next/src/build/createServerBundle.ts

@@ -28,6 +28,7 @@ import {
   patchFetchCacheSetMissingWaitUntil,
   patchNextServer,
   patchUnstableCacheForISR,
+  patchUseCacheForISR,
 } from "./patch/patches/index.js";
 
 interface CodeCustomization {
@@ -212,6 +213,7 @@ async function generateBundle(
     patchNextServer,
     patchEnvVars,
     patchBackgroundRevalidation,
+    patchUseCacheForISR,
     ...additionalCodePatches,
   ]);
 

packages/open-next/src/build/patch/patches/index.ts

@@ -3,6 +3,7 @@ export { patchNextServer } from "./patchNextServer.js";
 export {
   patchFetchCacheForISR,
   patchUnstableCacheForISR,
+  patchUseCacheForISR,
 } from "./patchFetchCacheISR.js";
 export { patchFetchCacheSetMissingWaitUntil } from "./patchFetchCacheWaitUntil.js";
 export { patchBackgroundRevalidation } from "./patchBackgroundRevalidation.js";

packages/open-next/src/build/patch/patches/patchFetchCacheISR.ts

@@ -78,6 +78,29 @@ fix:
   ($STORE_OR_CACHE.isOnDemandRevalidate && !globalThis.__openNextAls?.getStore()?.isISRRevalidation)
 `;
 
+export const useCacheRule = `
+rule:
+  kind: member_expression
+  pattern: $STORE_OR_CACHE.isOnDemandRevalidate
+  inside:
+    kind: binary_expression
+    has: 
+      kind: member_expression
+      pattern: $STORE_OR_CACHE.isDraftMode
+    inside:
+      kind: if_statement
+      stopBy: end
+      has: 
+        kind: return_statement
+        any:
+          - has:
+              kind: 'true'
+          - has:
+              regex: '!0'
+        stopBy: end
+fix:
+  '($STORE_OR_CACHE.isOnDemandRevalidate && !globalThis.__openNextAls?.getStore()?.isISRRevalidation)'`;
+
 export const patchFetchCacheForISR: CodePatcher = {
   name: "patch-fetch-cache-for-isr",
   patches: [
@@ -111,3 +134,20 @@ export const patchUnstableCacheForISR: CodePatcher = {
     },
   ],
 };
+
+export const patchUseCacheForISR: CodePatcher = {
+  name: "patch-use-cache-for-isr",
+  patches: [
+    {
+      versions: ">=15.3.0",
+      field: {
+        pathFilter: getCrossPlatformPathRegex(
+          String.raw`(server/chunks/.*\.js|.*\.runtime\..*\.js|use-cache/use-cache-wrapper\.js)$`,
+          { escape: false },
+        ),
+        contentFilter: /\.isOnDemandRevalidate/,
+        patchCode: createPatchCode(useCacheRule, Lang.JavaScript),
+      },
+    },
+  ],
+};

packages/tests-e2e/tests/experimental/use-cache.test.ts

@@ -21,9 +21,8 @@ test("cached component should work in ssr", async ({ page }) => {
     isrText = await isrElt.textContent();
     await page.waitForTimeout(1000);
   } while (isrText === initialIsrText);
-
-  expect(fullyCachedElt).toHaveText(initialFullyCachedText ?? "");
-  expect(isrElt).not.toHaveText(initialIsrText ?? "");
+  const fullyCachedText = await fullyCachedElt.textContent();
+  expect(fullyCachedText).toEqual(initialFullyCachedText);
 });
 
 test("revalidateTag should work for fullyCached component", async ({
@@ -42,5 +41,47 @@ test("revalidateTag should work for fullyCached component", async ({
 
   await page.reload();
   await expect(fullyCachedElt).toBeVisible();
-  expect(fullyCachedElt).not.toHaveText(initialFullyCachedText ?? "");
+  const newFullyCachedText = await fullyCachedElt.textContent();
+  expect(newFullyCachedText).not.toEqual(initialFullyCachedText);
+});
+
+test("cached component should work in isr", async ({ page }) => {
+  await page.goto("/use-cache/isr");
+
+  let fullyCachedElt = page.getByTestId("fullyCached");
+  let isrElt = page.getByTestId("isr");
+
+  await expect(fullyCachedElt).toBeVisible();
+  await expect(isrElt).toBeVisible();
+
+  let initialFullyCachedText = await fullyCachedElt.textContent();
+  let initialIsrText = await isrElt.textContent();
+
+  // We have to force reload until ISR has triggered at least once, otherwise the test will be flakey
+
+  let isrText = initialIsrText;
+
+  while (isrText === initialIsrText) {
+    await page.reload();
+    isrElt = page.getByTestId("isr");
+    fullyCachedElt = page.getByTestId("fullyCached");
+    await expect(isrElt).toBeVisible();
+    isrText = await isrElt.textContent();
+    await expect(fullyCachedElt).toBeVisible();
+    initialFullyCachedText = await fullyCachedElt.textContent();
+    await page.waitForTimeout(1000);
+  }
+  initialIsrText = isrText;
+
+  do {
+    await page.reload();
+    fullyCachedElt = page.getByTestId("fullyCached");
+    isrElt = page.getByTestId("isr");
+    await expect(fullyCachedElt).toBeVisible();
+    await expect(isrElt).toBeVisible();
+    isrText = await isrElt.textContent();
+    await page.waitForTimeout(1000);
+  } while (isrText === initialIsrText);
+  const fullyCachedText = await fullyCachedElt.textContent();
+  expect(fullyCachedText).toEqual(initialFullyCachedText);
 });

packages/tests-unit/tests/build/patch/patches/patchFetchCacheISR.test.ts

@@ -2,6 +2,7 @@ import { patchCode } from "@opennextjs/aws/build/patch/astCodePatcher.js";
 import {
   fetchRule,
   unstable_cacheRule,
+  useCacheRule,
 } from "@opennextjs/aws/build/patch/patches/patchFetchCacheISR.js";
 import { describe } from "vitest";
 
@@ -54,6 +55,24 @@ const patchFetchCacheCodeMinifiedNext15 = `
 let t=P.isOnDemandRevalidate?null:await V.get(n,{kind:l.IncrementalCacheKind.FETCH,revalidate:_,fetchUrl:y,fetchIdx:X,tags:N,softTags:C});
 `;
 
+const patchUseCacheUnminified = `
+function shouldForceRevalidate(workStore, workUnitStore) {
+    if (workStore.isOnDemandRevalidate || workStore.isDraftMode) {
+        return true;
+    }
+    if (workStore.dev && workUnitStore) {
+        if (workUnitStore.type === 'request') {
+            return workUnitStore.headers.get('cache-control') === 'no-cache';
+        }
+        if (workUnitStore.type === 'cache') {
+            return workUnitStore.forceRevalidate;
+        }
+    }
+    return false;
+}`;
+const patchUseCacheMinified = `
+function D(e,t){if(e.isOnDemandRevalidate||e.isDraftMode)return!0;if(e.dev&&t){if("request"===t.type)return"no-cache"===t.headers.get("cache-control");if("cache"===t.type)return t.forceRevalidate}return!1}`;
+
 describe("patchUnstableCacheForISR", () => {
   test("on unminified code", async () => {
     expect(
@@ -124,3 +143,32 @@ describe("patchFetchCacheISR", () => {
   });
   //TODO: Add test for Next 14.2.24
 });
+
+describe("patchUseCache", () => {
+  test("on unminified code", async () => {
+    expect(
+      patchCode(patchUseCacheUnminified, useCacheRule),
+    ).toMatchInlineSnapshot(`
+"function shouldForceRevalidate(workStore, workUnitStore) {
+    if ((workStore.isOnDemandRevalidate && !globalThis.__openNextAls?.getStore()?.isISRRevalidation) || workStore.isDraftMode) {
+        return true;
+    }
+    if (workStore.dev && workUnitStore) {
+        if (workUnitStore.type === 'request') {
+            return workUnitStore.headers.get('cache-control') === 'no-cache';
+        }
+        if (workUnitStore.type === 'cache') {
+            return workUnitStore.forceRevalidate;
+        }
+    }
+    return false;
+}"`);
+  });
+  test("on minified code", async () => {
+    expect(
+      patchCode(patchUseCacheMinified, useCacheRule),
+    ).toMatchInlineSnapshot(`
+"function D(e,t){if((e.isOnDemandRevalidate && !globalThis.__openNextAls?.getStore()?.isISRRevalidation)||e.isDraftMode)return!0;if(e.dev&&t){if("request"===t.type)return"no-cache"===t.headers.get("cache-control");if("cache"===t.type)return t.forceRevalidate}return!1}"
+`);
+  });
+});