[metadata] fix duplicate metadata for parallel routes (#76669)

Author: huozhi

packages/next/src/server/app-render/create-component-tree.tsx

@@ -527,7 +527,7 @@ async function createComponentTreeInternal({
             missingSlots,
             preloadCallbacks,
             authInterrupts,
-            StreamingMetadata,
+            StreamingMetadata: isChildrenRouteKey ? StreamingMetadata : null,
             // `StreamingMetadataOutlet` is used to conditionally throw. In the case of parallel routes we will have more than one page
             // but we only want to throw on the first one.
             StreamingMetadataOutlet: isChildrenRouteKey

test/e2e/app-dir/metadata-streaming/app/parallel-routes/@bar/default.tsx

@@ -0,0 +1,3 @@
+export default function Page() {
+  return 'default @bar'
+}

test/e2e/app-dir/metadata-streaming/app/parallel-routes/@bar/layout.tsx

@@ -0,0 +1,8 @@
+export default function Layout({ children }) {
+  return (
+    <div>
+      <h2>@bar Layout</h2>
+      <div id="bar-children">{children}</div>
+    </div>
+  )
+}

test/e2e/app-dir/metadata-streaming/app/parallel-routes/@bar/page.tsx

@@ -0,0 +1,3 @@
+export default function Page() {
+  return 'page @bar'
+}

test/e2e/app-dir/metadata-streaming/app/parallel-routes/@foo/default.tsx

@@ -0,0 +1,3 @@
+export default function Page() {
+  return 'default @foo'
+}

test/e2e/app-dir/metadata-streaming/app/parallel-routes/@foo/layout.tsx

@@ -0,0 +1,8 @@
+export default function Layout({ children }) {
+  return (
+    <div>
+      <h2>@foo Layout</h2>
+      <div id="foo-children">{children}</div>
+    </div>
+  )
+}

test/e2e/app-dir/metadata-streaming/app/parallel-routes/@foo/page.tsx

@@ -0,0 +1,3 @@
+export default function Page() {
+  return 'page @foo'
+}

test/e2e/app-dir/metadata-streaming/app/parallel-routes/layout.tsx

@@ -0,0 +1,10 @@
+export default function Layout({ children, bar, foo }) {
+  return (
+    <div>
+      <h1>Parallel Routes Layout</h1>
+      <div id="nested-children">{children}</div>
+      <div id="foo-slot">{foo}</div>
+      <div id="bar-slot">{bar}</div>
+    </div>
+  )
+}

test/e2e/app-dir/metadata-streaming/app/parallel-routes/page.tsx

@@ -0,0 +1,7 @@
+export default function Page() {
+  return <div>Hello from Nested</div>
+}
+
+export const metadata = {
+  title: 'parallel title',
+}

test/e2e/app-dir/metadata-streaming/metadata-streaming.test.ts

@@ -88,6 +88,16 @@ describe('app-dir - metadata-streaming', () => {
     expect((await browser.elementsByCss('body meta')).length).toBe(9)
   })
 
+  it('should only insert metadata once for parallel routes', async () => {
+    const browser = await next.browser('/parallel-routes')
+
+    expect((await browser.elementsByCss('head title')).length).toBe(1)
+    expect((await browser.elementsByCss('body title')).length).toBe(0)
+
+    const $ = await next.render$('/parallel-routes')
+    expect($('title').length).toBe(1)
+  })
+
   describe('dynamic api', () => {
     it('should render metadata to body', async () => {
       const $ = await next.render$('/dynamic-api')