Fix nested unstable_cache revalidating (vercel#57316)

This ensures when we call `revalidateTag` and there are nested `unstable_cache` entries we properly revalidate.

Author: ijjk

packages/next/src/server/web/spec-extension/unstable-cache.ts

@@ -82,6 +82,9 @@ export function unstable_cache<T extends Callback>(
         const cacheKey = await incrementalCache?.fetchCacheKey(joinedKey)
         const cacheEntry =
           cacheKey &&
+          // when we are nested inside of other unstable_cache's
+          // we should bypass cache similar to fetches
+          store?.fetchCache !== 'force-no-store' &&
           !(
             store?.isOnDemandRevalidate || incrementalCache.isOnDemandRevalidate
           ) &&

test/e2e/app-dir/app-static/app-static.test.ts

@@ -222,6 +222,7 @@ createNextDescribe(
           const $ = cheerio.load(html)
           const initLayoutData = $('#layout-data').text()
           const initPageData = $('#page-data').text()
+          const initNestedCacheData = $('#nested-cache').text()
 
           const routeHandlerRes = await next.fetch(
             '/route-handler/revalidate-360'
@@ -254,6 +255,7 @@ createNextDescribe(
             const new$ = cheerio.load(newHtml)
             const newLayoutData = new$('#layout-data').text()
             const newPageData = new$('#page-data').text()
+            const newNestedCacheData = new$('#nested-cache').text()
 
             const newRouteHandlerRes = await next.fetch(
               '/route-handler/revalidate-360'
@@ -271,6 +273,7 @@ createNextDescribe(
             expect(newEdgeRouteHandlerData).toBeTruthy()
             expect(newLayoutData).not.toBe(initLayoutData)
             expect(newPageData).not.toBe(initPageData)
+            expect(newNestedCacheData).not.toBe(initNestedCacheData)
             expect(newRouteHandlerData).not.toEqual(initRouteHandlerData)
             expect(newEdgeRouteHandlerData).not.toEqual(initEdgeRouteHandlerRes)
             return 'success'

test/e2e/app-dir/app-static/app/variable-revalidate/revalidate-360/page.js

@@ -54,6 +54,33 @@ export default async function Page() {
     }
   )()
 
+  const cacheInner = unstable_cache(
+    async () => {
+      console.log('calling cacheInner')
+      const data = await fetch(
+        'https://next-data-api-endpoint.vercel.app/api/random?something',
+        {
+          next: { revalidate: 15, tags: ['thankyounext'] },
+        }
+      ).then((res) => res.text())
+      return data
+    },
+    [],
+    { revalidate: 360 }
+  )
+
+  const cacheOuter = unstable_cache(
+    () => {
+      console.log('cacheOuter')
+      return cacheInner()
+    },
+    [],
+    {
+      revalidate: 1000,
+      tags: ['thankyounext'],
+    }
+  )()
+
   return (
     <>
       <p id="page">/variable-revalidate/revalidate-360</p>
@@ -65,6 +92,7 @@ export default async function Page() {
         revalidate 10 (tags: thankyounext): {JSON.stringify(cachedData)}
       </p>
       <p id="now">{Date.now()}</p>
+      <p id="nested-cache">nested cache: {cacheOuter}</p>
     </>
   )
 }