first commit

2026-03-10 19:37:31 +03:30
commit 61f56f997c
27684 changed files with 2784175 additions and 0 deletions
--- a/test/e2e/app-dir/ppr-root-param-fallback/app/[locale]/blog/[slug]/page.tsx
+++ b/test/e2e/app-dir/ppr-root-param-fallback/app/[locale]/blog/[slug]/page.tsx
@@ -0,0 +1,78 @@
+import { Suspense } from 'react'
+import { cookies } from 'next/headers'
+import Link from 'next/link'
+
+async function getBlogPost(locale: string, slug: string) {
+  'use cache'
+  await new Promise((resolve) => setTimeout(resolve, 700))
+  return {
+    title: `Blog Post: ${slug}`,
+    locale,
+    content: 'This content was fetched from the CMS...',
+    relatedPosts: ['Related Post 1', 'Related Post 2', 'Related Post 3'],
+  }
+}
+
+export default async function BlogPost({
+  params,
+}: {
+  params: Promise<{ locale: string; slug: string }>
+}) {
+  return (
+    <main>
+      <div id="static-blog-header">Blog Article</div>
+      <div id="static-reading-time">Estimated reading time: 5 minutes</div>
+
+      <Suspense fallback={<div id="blog-loading">Loading article...</div>}>
+        <BlogContent params={params} />
+      </Suspense>
+
+      <Suspense fallback={<div id="dynamic-loading">Loading comments...</div>}>
+        <DynamicComments />
+      </Suspense>
+    </main>
+  )
+}
+
+// This component depends on locale and slug, so it's in Suspense
+async function BlogContent({
+  params,
+}: {
+  params: Promise<{ locale: string; slug: string }>
+}) {
+  const { locale, slug } = await params
+  const post = await getBlogPost(locale, slug)
+  return (
+    <>
+      <article id="blog-content">
+        <h1>{post.title}</h1>
+        <p>Locale: {post.locale}</p>
+        <p>{post.content}</p>
+      </article>
+      <aside id="related-posts">
+        <h2>Related Posts ({post.locale})</h2>
+        <ul>
+          {post.relatedPosts.map((title, i) => (
+            <li key={i}>
+              <Link href={`/en/blog/${i}`}>{title}</Link>
+            </li>
+          ))}
+        </ul>
+      </aside>
+    </>
+  )
+}
+
+async function DynamicComments() {
+  const cookieStore = await cookies()
+  const user = cookieStore.get('user')?.value || 'anonymous'
+  return (
+    <section id="comments">
+      <h3>Comments</h3>
+      <p>Viewing as: {user}</p>
+    </section>
+  )
+}
+export function generateStaticParams() {
+  return [{ slug: 'hello-world' }, { slug: 'getting-started' }]
+}
--- a/test/e2e/app-dir/ppr-root-param-fallback/app/[locale]/layout.tsx
+++ b/test/e2e/app-dir/ppr-root-param-fallback/app/[locale]/layout.tsx
@@ -0,0 +1,76 @@
+import { Suspense } from 'react'
+import { cookies } from 'next/headers'
+
+async function getLocaleConfig(localeParam: string) {
+  'use cache'
+  await new Promise((resolve) => setTimeout(resolve, 800))
+  return {
+    locale: localeParam,
+    translations: {
+      home: `Home (${localeParam})`,
+      blog: `Blog (${localeParam})`,
+      about: `About (${localeParam})`,
+    },
+  }
+}
+
+export default async function LocaleLayout({
+  children,
+  params,
+}: {
+  children: React.ReactNode
+  params: Promise<{ locale: string }>
+}) {
+  return (
+    <html>
+      <body>
+        <div id="static-header">Welcome to our Blog Platform</div>
+        <nav id="static-nav">
+          <ul>
+            <li>Home</li>
+            <li>Blog</li>
+            <li>About</li>
+          </ul>
+        </nav>
+
+        <Suspense
+          fallback={<div id="locale-loading">Loading locale info...</div>}
+        >
+          <LocaleInfo params={params} />
+        </Suspense>
+
+        <Suspense fallback={<div id="dynamic-loading">Loading user...</div>}>
+          <UserInfo />
+        </Suspense>
+
+        {children}
+      </body>
+    </html>
+  )
+}
+
+// This component depends on locale, so it's in Suspense
+async function LocaleInfo({ params }: { params: Promise<{ locale: string }> }) {
+  const { locale } = await params
+  const config = await getLocaleConfig(locale)
+
+  return (
+    <header id="locale-header">
+      <span>Locale: {config.locale}</span>
+      <div id="translations">
+        {config.translations.home} | {config.translations.blog} |{' '}
+        {config.translations.about}
+      </div>
+    </header>
+  )
+}
+
+async function UserInfo() {
+  const cookieStore = await cookies()
+  const user = cookieStore.get('user')?.value || 'anonymous'
+  return <div id="user-info">Logged in as: {user}</div>
+}
+
+export function generateStaticParams() {
+  return [{ locale: 'en' }, { locale: 'fr' }]
+}
--- a/test/e2e/app-dir/ppr-root-param-fallback/app/[locale]/page.tsx
+++ b/test/e2e/app-dir/ppr-root-param-fallback/app/[locale]/page.tsx
@@ -0,0 +1,10 @@
+export default function Home() {
+  return (
+    <main>
+      <div id="home-content">
+        <h1>Home</h1>
+        <p>Welcome!</p>
+      </div>
+    </main>
+  )
+}
--- a/test/e2e/app-dir/ppr-root-param-fallback/next.config.js
+++ b/test/e2e/app-dir/ppr-root-param-fallback/next.config.js
@@ -0,0 +1,8 @@
+/**
+ * @type {import('next').NextConfig}
+ */
+const nextConfig = {
+  cacheComponents: true,
+}
+
+module.exports = nextConfig
--- a/test/e2e/app-dir/ppr-root-param-fallback/ppr-root-param-fallback.test.ts
+++ b/test/e2e/app-dir/ppr-root-param-fallback/ppr-root-param-fallback.test.ts
@@ -0,0 +1,30 @@
+import { nextTestSetup } from 'e2e-utils'
+
+describe('ppr-root-param-fallback', () => {
+  const { next } = nextTestSetup({
+    files: __dirname,
+  })
+
+  it('should have use-cache content in fallback shells for all pregenerated locales', async () => {
+    // Setup: The app has a [locale] param with generateStaticParams returning
+    // ['en', 'fr'], and a nested /[locale]/blog/[slug] route. The layout uses
+    // a 'use cache' function to fetch locale-specific translations.
+    //
+    // This test ensures that we generate fallback shells with the correct locale
+    // filled in for all pregenerated locales.
+
+    for (const locale of ['en', 'fr']) {
+      // next.render$ doesn't stream, so we get just the shell content
+      const $ = await next.render$(`/${locale}/blog/new-post`)
+
+      // The shell should have the locale-header with cached content,
+      // NOT the locale-loading Suspense fallback
+      expect($('#locale-header').length).toBe(1)
+      expect($('#locale-header').text()).toContain(`Locale: ${locale}`)
+      expect($('#translations').text()).toContain(`Home (${locale})`)
+
+      // The Suspense fallback should NOT be in the shell
+      expect($('#locale-loading').length).toBe(0)
+    }
+  })
+})