diff --git a/examples/experimental/src/app/use-cache/ssr/page.tsx b/examples/experimental/src/app/use-cache/ssr/page.tsx
index 41a413d1b..b0133f2ee 100644
--- a/examples/experimental/src/app/use-cache/ssr/page.tsx
+++ b/examples/experimental/src/app/use-cache/ssr/page.tsx
@@ -1,4 +1,8 @@
-import { FullyCachedComponent, ISRComponent } from "@/components/cached";
+import {
+ FullyCachedComponent,
+ FullyCachedComponentWithTag,
+ ISRComponent,
+} from "@/components/cached";
import { headers } from "next/headers";
import { Suspense } from "react";
@@ -12,6 +16,9 @@ export default async function Page() {
Loading...
}>
+ Loading...}>
+
+
Loading...}>
diff --git a/examples/experimental/src/components/cached.tsx b/examples/experimental/src/components/cached.tsx
index 7abaa010c..4e8228595 100644
--- a/examples/experimental/src/components/cached.tsx
+++ b/examples/experimental/src/components/cached.tsx
@@ -1,11 +1,20 @@
import { unstable_cacheLife, unstable_cacheTag } from "next/cache";
export async function FullyCachedComponent() {
+ "use cache";
+ return (
+
+ );
+}
+
+export async function FullyCachedComponentWithTag() {
"use cache";
unstable_cacheTag("fullyTagged");
return (
-
{Date.now()}
+
{Date.now()}
);
}
diff --git a/packages/tests-e2e/tests/experimental/use-cache.test.ts b/packages/tests-e2e/tests/experimental/use-cache.test.ts
index 378c496b2..9d38c6323 100644
--- a/packages/tests-e2e/tests/experimental/use-cache.test.ts
+++ b/packages/tests-e2e/tests/experimental/use-cache.test.ts
@@ -3,7 +3,7 @@ import { expect, test } from "@playwright/test";
test.describe("Composable Cache", () => {
test("cached component should work in ssr", async ({ page }) => {
await page.goto("/use-cache/ssr");
- let fullyCachedElt = page.getByTestId("fullyCached");
+ let fullyCachedElt = page.getByTestId("fully-cached");
let isrElt = page.getByTestId("isr");
await expect(fullyCachedElt).toBeVisible();
await expect(isrElt).toBeVisible();
@@ -15,7 +15,7 @@ test.describe("Composable Cache", () => {
do {
await page.reload();
- fullyCachedElt = page.getByTestId("fullyCached");
+ fullyCachedElt = page.getByTestId("fully-cached");
isrElt = page.getByTestId("isr");
await expect(fullyCachedElt).toBeVisible();
await expect(isrElt).toBeVisible();
@@ -31,7 +31,7 @@ test.describe("Composable Cache", () => {
request,
}) => {
await page.goto("/use-cache/ssr");
- const fullyCachedElt = page.getByTestId("fullyCached");
+ const fullyCachedElt = page.getByTestId("fully-cached-with-tag");
await expect(fullyCachedElt).toBeVisible();
const initialFullyCachedText = await fullyCachedElt.textContent();
@@ -49,7 +49,7 @@ test.describe("Composable Cache", () => {
test("cached component should work in isr", async ({ page }) => {
await page.goto("/use-cache/isr");
- let fullyCachedElt = page.getByTestId("fullyCached");
+ let fullyCachedElt = page.getByTestId("fully-cached");
let isrElt = page.getByTestId("isr");
await expect(fullyCachedElt).toBeVisible();
@@ -65,7 +65,7 @@ test.describe("Composable Cache", () => {
while (isrText === initialIsrText) {
await page.reload();
isrElt = page.getByTestId("isr");
- fullyCachedElt = page.getByTestId("fullyCached");
+ fullyCachedElt = page.getByTestId("fully-cached");
await expect(isrElt).toBeVisible();
isrText = await isrElt.textContent();
await expect(fullyCachedElt).toBeVisible();
@@ -76,7 +76,7 @@ test.describe("Composable Cache", () => {
do {
await page.reload();
- fullyCachedElt = page.getByTestId("fullyCached");
+ fullyCachedElt = page.getByTestId("fully-cached");
isrElt = page.getByTestId("isr");
await expect(fullyCachedElt).toBeVisible();
await expect(isrElt).toBeVisible();