add e2e for dynamicparams in app-router

examples/app-router/app/isr/dynamic-params-false/[id]/page.tsx

@@ -0,0 +1,43 @@
+export const dynamicParams = false; // or true, to make it try SSR unknown paths
+
+interface Post {
+  id: string;
+  title: string;
+  content: string;
+}
+
+const POSTS = Array.from({ length: 20 }, (_, i) => ({
+  id: String(i + 1),
+  title: `Post ${i + 1}`,
+  content: `This is post ${i + 1}`,
+}));
+
+async function fakeGetPostsFetch() {
+  return POSTS.slice(0, 10);
+}
+
+async function fakeGetPostFetch(id: string) {
+  return POSTS.find((post) => post.id === id);
+}
+
+export async function generateStaticParams() {
+  const fakePosts = await fakeGetPostsFetch();
+  return fakePosts.map((post) => ({
+    id: post.id,
+  }));
+}
+
+export default async function Page({
+  params,
+}: {
+  params: Promise<{ id: string }>;
+}) {
+  const { id } = await params;
+  const post = (await fakeGetPostFetch(id)) as Post;
+  return (
+    <main>
+      <h1 data-testid="title">{post.title}</h1>
+      <p data-testid="content">{post.content}</p>
+    </main>
+  );
+}

examples/app-router/app/isr/dynamic-params-true/[id]/page.tsx

@@ -0,0 +1,46 @@
+// We'll prerender only the params from `generateStaticParams` at build time.
+// If a request comes in for a path that hasn't been generated,
+// Next.js will server-render the page on-demand.
+export const dynamicParams = true; // or false, to 404 on unknown paths
+
+interface Post {
+  id: string;
+  title: string;
+  content: string;
+}
+
+const POSTS = Array.from({ length: 20 }, (_, i) => ({
+  id: String(i + 1),
+  title: `Post ${i + 1}`,
+  content: `This is post ${i + 1}`,
+}));
+
+async function fakeGetPostsFetch() {
+  return POSTS.slice(0, 10);
+}
+
+async function fakeGetPostFetch(id: string) {
+  return POSTS.find((post) => post.id === id);
+}
+
+export async function generateStaticParams() {
+  const fakePosts = await fakeGetPostsFetch();
+  return fakePosts.map((post) => ({
+    id: post.id,
+  }));
+}
+
+export default async function Page({
+  params,
+}: {
+  params: Promise<{ id: string }>;
+}) {
+  const { id } = await params;
+  const post = (await fakeGetPostFetch(id)) as Post;
+  return (
+    <main>
+      <h1 data-testid="title">{post.title}</h1>
+      <p data-testid="content">{post.content}</p>
+    </main>
+  );
+}

packages/tests-e2e/tests/appRouter/isr.test.ts

@@ -93,3 +93,47 @@ test("Incremental Static Regeneration with data cache", async ({ page }) => {
   expect(originalCachedDate).toEqual(finalCachedDate);
   expect(originalFetchedDate).toEqual(finalFetchedDate);
 });
+
+test("dynamicParams set to true", async ({ page }) => {
+  const res = await page.goto("/isr/dynamic-params-true/1");
+  expect(res?.status()).toEqual(200);
+  expect(res?.headers()["x-nextjs-cache"]).toEqual("HIT");
+  const title = await page.getByTestId("title").textContent();
+  const content = await page.getByTestId("content").textContent();
+  expect(title).toEqual("Post 1");
+  expect(content).toEqual("This is post 1");
+
+  // should SSR for a path that has not been generated
+  const res2 = await page.goto("/isr/dynamic-params-true/11");
+  expect(res2?.headers()["x-nextjs-cache"]).toEqual("MISS");
+  const title2 = await page.getByTestId("title").textContent();
+  const content2 = await page.getByTestId("content").textContent();
+  expect(title2).toEqual("Post 11");
+  expect(content2).toEqual("This is post 11");
+
+  // should 500 for a non-existing path
+  const res3 = await page.goto("/isr/dynamic-params-true/21");
+  expect(res3?.status()).toEqual(500);
+  expect(res3?.headers()["cache-control"]).toBe(
+    "private, no-cache, no-store, max-age=0, must-revalidate",
+  );
+});
+
+test("dynamicParams set to false", async ({ page }) => {
+  // should return 200 and x-nextjs-cache HIT for an existing path
+  const res = await page.goto("/isr/dynamic-params-false/1");
+  expect(res?.status()).toEqual(200);
+  expect(res?.headers()["x-nextjs-cache"]).toEqual("HIT");
+  const title = await page.getByTestId("title").textContent();
+  const content = await page.getByTestId("content").textContent();
+  expect(title).toEqual("Post 1");
+  expect(content).toEqual("This is post 1");
+
+  // should return 404 for a non-existing path
+  const res2 = await page.goto("/isr/dynamic-params-false/11");
+  expect(res2?.status()).toEqual(404);
+  expect(res2?.headers()["cache-control"]).toBe(
+    "private, no-cache, no-store, max-age=0, must-revalidate",
+  );
+  await expect(await page.getByText("404")).toBeAttached();
+});