diff --git a/packages/next/src/client/components/router-reducer/reducers/find-head-in-cache.ts b/packages/next/src/client/components/router-reducer/reducers/find-head-in-cache.ts
index db6f9eb66502d..471b1804e7ac3 100644
--- a/packages/next/src/client/components/router-reducer/reducers/find-head-in-cache.ts
+++ b/packages/next/src/client/components/router-reducer/reducers/find-head-in-cache.ts
@@ -1,5 +1,6 @@
 import type { FlightRouterState } from '../../../../server/app-render/types'
 import type { CacheNode } from '../../../../shared/lib/app-router-context.shared-runtime'
+import { DEFAULT_SEGMENT_KEY } from '../../../../shared/lib/segment'
 import { createRouterCacheKey } from '../create-router-cache-key'
 
 export function findHeadInCache(
@@ -22,28 +23,22 @@ function findHeadInCacheImpl(
 
   // First try the 'children' parallel route if it exists
   // when starting from the "root", this corresponds with the main page component
-  if (parallelRoutes.children) {
-    const [segment, childParallelRoutes] = parallelRoutes.children
-    const childSegmentMap = cache.parallelRoutes.get('children')
-    if (childSegmentMap) {
-      const cacheKey = createRouterCacheKey(segment)
-      const cacheNode = childSegmentMap.get(cacheKey)
-      if (cacheNode) {
-        const item = findHeadInCacheImpl(
-          cacheNode,
-          childParallelRoutes,
-          keyPrefix + '/' + cacheKey
-        )
-        if (item) return item
-      }
-    }
-  }
+  const parallelRoutesKeys = Object.keys(parallelRoutes).filter(
+    (key) => key !== 'children'
+  )
 
-  // if we didn't find metadata in the page slot, check the other parallel routes
-  for (const key in parallelRoutes) {
-    if (key === 'children') continue // already checked above
+  // if we are at the root, we need to check the children slot first
+  if ('children' in parallelRoutes) {
+    parallelRoutesKeys.unshift('children')
+  }
 
+  for (const key of parallelRoutesKeys) {
     const [segment, childParallelRoutes] = parallelRoutes[key]
+    // If the parallel is not matched and using the default segment,
+    // skip searching the head from it.
+    if (segment === DEFAULT_SEGMENT_KEY) {
+      continue
+    }
     const childSegmentMap = cache.parallelRoutes.get(key)
     if (!childSegmentMap) {
       continue
diff --git a/packages/next/src/lib/metadata/metadata.tsx b/packages/next/src/lib/metadata/metadata.tsx
index 9b8c593abec53..1413bc4f11078 100644
--- a/packages/next/src/lib/metadata/metadata.tsx
+++ b/packages/next/src/lib/metadata/metadata.tsx
@@ -206,9 +206,11 @@ export function createMetadataComponents({
     const promise = resolveFinalMetadata()
     if (serveStreamingMetadata) {
       return (
-        <Suspense fallback={null}>
-          <AsyncMetadata promise={promise} />
-        </Suspense>
+        <div hidden>
+          <Suspense fallback={null}>
+            <AsyncMetadata promise={promise} />
+          </Suspense>
+        </div>
       )
     }
     const metadataState = await promise
diff --git a/packages/next/src/server/app-render/app-render.tsx b/packages/next/src/server/app-render/app-render.tsx
index 5e9d8da2e616b..9e334353965ed 100644
--- a/packages/next/src/server/app-render/app-render.tsx
+++ b/packages/next/src/server/app-render/app-render.tsx
@@ -245,6 +245,8 @@ interface ParseRequestHeadersOptions {
 }
 
 const flightDataPathHeadKey = 'h'
+const getFlightViewportKey = (requestId: string) => requestId + 'v'
+const getFlightMetadataKey = (requestId: string) => requestId + 'm'
 
 interface ParsedRequestHeaders {
   /**
@@ -336,30 +338,6 @@ function createNotFoundLoaderTree(loaderTree: LoaderTree): LoaderTree {
   ]
 }
 
-function createDivergedMetadataComponents(
-  Metadata: React.ComponentType,
-  serveStreamingMetadata: boolean
-): {
-  StaticMetadata: React.ComponentType<{}>
-  StreamingMetadata: React.ComponentType<{}> | null
-} {
-  function EmptyMetadata() {
-    return null
-  }
-  const StreamingMetadata: React.ComponentType | null = serveStreamingMetadata
-    ? Metadata
-    : null
-
-  const StaticMetadata: React.ComponentType<{}> = serveStreamingMetadata
-    ? EmptyMetadata
-    : Metadata
-
-  return {
-    StaticMetadata,
-    StreamingMetadata,
-  }
-}
-
 /**
  * Returns a function that parses the dynamic segment and return the associated value.
  */
@@ -527,14 +505,6 @@ async function generateDynamicRSCPayload(
       serveStreamingMetadata,
     })
 
-    const { StreamingMetadata, StaticMetadata } =
-      createDivergedMetadataComponents(() => {
-        return (
-          // Adding requestId as react key to make metadata remount for each render
-          <MetadataTree key={requestId} />
-        )
-      }, serveStreamingMetadata)
-
     flightData = (
       await walkTreeWithFlightRouterState({
         ctx,
@@ -551,9 +521,9 @@ async function generateDynamicRSCPayload(
               isPossibleServerAction={ctx.isPossibleServerAction}
             />
             {/* Adding requestId as react key to make metadata remount for each render */}
-            <ViewportTree key={requestId} />
-            {StreamingMetadata ? <StreamingMetadata /> : null}
-            <StaticMetadata />
+            <ViewportTree key={getFlightViewportKey(requestId)} />
+            {/* Not add requestId as react key to ensure segment prefetch could result consistently if nothing changed */}
+            <MetadataTree key={getFlightMetadataKey(requestId)} />
           </React.Fragment>
         ),
         injectedCSS: new Set(),
@@ -857,14 +827,6 @@ async function getRSCPayload(
 
   const preloadCallbacks: PreloadCallbacks = []
 
-  const { StreamingMetadata, StaticMetadata } =
-    createDivergedMetadataComponents(() => {
-      return (
-        // Not add requestId as react key to ensure segment prefetch could result consistently if nothing changed
-        <MetadataTree />
-      )
-    }, serveStreamingMetadata)
-
   const seedData = await createComponentTree({
     ctx,
     loaderTree: tree,
@@ -878,7 +840,6 @@ async function getRSCPayload(
     missingSlots,
     preloadCallbacks,
     authInterrupts: ctx.renderOpts.experimental.authInterrupts,
-    StreamingMetadata,
     StreamingMetadataOutlet,
   })
 
@@ -896,8 +857,9 @@ async function getRSCPayload(
         statusCode={ctx.res.statusCode}
         isPossibleServerAction={ctx.isPossibleServerAction}
       />
-      <ViewportTree key={ctx.requestId} />
-      <StaticMetadata />
+      <ViewportTree key={getFlightViewportKey(ctx.requestId)} />
+      {/* Not add requestId as react key to ensure segment prefetch could result consistently if nothing changed */}
+      <MetadataTree />
     </React.Fragment>
   )
 
@@ -984,16 +946,8 @@ async function getErrorRSCPayload(
     serveStreamingMetadata: serveStreamingMetadata,
   })
 
-  const { StreamingMetadata, StaticMetadata } =
-    createDivergedMetadataComponents(
-      () => (
-        <React.Fragment key={flightDataPathHeadKey}>
-          {/* Adding requestId as react key to make metadata remount for each render */}
-          <MetadataTree key={requestId} />
-        </React.Fragment>
-      ),
-      serveStreamingMetadata
-    )
+  // {/* Adding requestId as react key to make metadata remount for each render */}
+  const metadata = <MetadataTree key={getFlightMetadataKey(requestId)} />
 
   const initialHead = (
     <React.Fragment key={flightDataPathHeadKey}>
@@ -1003,12 +957,11 @@ async function getErrorRSCPayload(
         isPossibleServerAction={ctx.isPossibleServerAction}
       />
       {/* Adding requestId as react key to make metadata remount for each render */}
-      <ViewportTree key={requestId} />
+      <ViewportTree key={getFlightViewportKey(requestId)} />
       {process.env.NODE_ENV === 'development' && (
         <meta name="next-error" content="not-found" />
       )}
-      {StreamingMetadata ? <StreamingMetadata /> : null}
-      <StaticMetadata />
+      {metadata}
     </React.Fragment>
   )
 
@@ -1028,10 +981,7 @@ async function getErrorRSCPayload(
   const seedData: CacheNodeSeedData = [
     initialTree[0],
     <html id="__next_error__">
-      <head>
-        {StreamingMetadata ? <StreamingMetadata /> : null}
-        <StaticMetadata />
-      </head>
+      <head>{metadata}</head>
       <body>
         {process.env.NODE_ENV !== 'production' && err ? (
           <template
diff --git a/packages/next/src/server/app-render/create-component-tree.tsx b/packages/next/src/server/app-render/create-component-tree.tsx
index 17e1bb060fb74..7a1cea2b90b90 100644
--- a/packages/next/src/server/app-render/create-component-tree.tsx
+++ b/packages/next/src/server/app-render/create-component-tree.tsx
@@ -39,7 +39,6 @@ export function createComponentTree(props: {
   missingSlots?: Set<string>
   preloadCallbacks: PreloadCallbacks
   authInterrupts: boolean
-  StreamingMetadata: React.ComponentType | null
   StreamingMetadataOutlet: React.ComponentType
 }): Promise<CacheNodeSeedData> {
   return getTracer().trace(
@@ -76,7 +75,6 @@ async function createComponentTreeInternal({
   missingSlots,
   preloadCallbacks,
   authInterrupts,
-  StreamingMetadata,
   StreamingMetadataOutlet,
 }: {
   loaderTree: LoaderTree
@@ -91,7 +89,6 @@ async function createComponentTreeInternal({
   missingSlots?: Set<string>
   preloadCallbacks: PreloadCallbacks
   authInterrupts: boolean
-  StreamingMetadata: React.ComponentType | null
   StreamingMetadataOutlet: React.ComponentType | null
 }): Promise<CacheNodeSeedData> {
   const {
@@ -390,7 +387,6 @@ async function createComponentTreeInternal({
 
   // Resolve the segment param
   const actualSegment = segmentParam ? segmentParam.treeSegment : segment
-  const metadata = StreamingMetadata ? <StreamingMetadata /> : undefined
 
   // Use the same condition to render metadataOutlet as metadata
   const metadataOutlet = StreamingMetadataOutlet ? (
@@ -513,7 +509,6 @@ async function createComponentTreeInternal({
             missingSlots,
             preloadCallbacks,
             authInterrupts,
-            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
@@ -699,12 +694,6 @@ async function createComponentTreeInternal({
       actualSegment,
       <React.Fragment key={cacheNodeKey}>
         {pageElement}
-        {/*
-         * The order here matters since a parent might call findDOMNode().
-         * findDOMNode() will return the first child if multiple children are rendered.
-         * But React will hoist metadata into <head> which breaks scroll handling.
-         */}
-        {metadata}
         {layerAssets}
         <OutletBoundary>
           <MetadataOutlet ready={getViewportReady} />
diff --git a/packages/next/src/server/app-render/walk-tree-with-flight-router-state.tsx b/packages/next/src/server/app-render/walk-tree-with-flight-router-state.tsx
index 5dffcc577c69b..d90beba53fcd5 100644
--- a/packages/next/src/server/app-render/walk-tree-with-flight-router-state.tsx
+++ b/packages/next/src/server/app-render/walk-tree-with-flight-router-state.tsx
@@ -202,7 +202,6 @@ export async function walkTreeWithFlightRouterState({
         getMetadataReady,
         preloadCallbacks,
         authInterrupts: experimental.authInterrupts,
-        StreamingMetadata: null,
         StreamingMetadataOutlet,
       }
     )
diff --git a/test/e2e/app-dir/metadata-streaming-parallel-routes/app/layout.tsx b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/layout.tsx
index 3d424723b93b1..1f882fc919b72 100644
--- a/test/e2e/app-dir/metadata-streaming-parallel-routes/app/layout.tsx
+++ b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/layout.tsx
@@ -14,6 +14,11 @@ export default function Root({ children }: { children: ReactNode }) {
             {`to /parallel-routes-default`}
           </Link>
           <br />
+
+          <Link href="/parallel-routes-no-children" id="to-no-children">
+            {`to /parallel-routes-no-children`}
+          </Link>
+          <br />
         </div>
         {children}
       </body>
diff --git a/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@bar/default.tsx b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@bar/default.tsx
new file mode 100644
index 0000000000000..e355998a4433c
--- /dev/null
+++ b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@bar/default.tsx
@@ -0,0 +1,3 @@
+export default function Page() {
+  return 'default @bar'
+}
diff --git a/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@bar/first/page.tsx b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@bar/first/page.tsx
new file mode 100644
index 0000000000000..85375256fc6db
--- /dev/null
+++ b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@bar/first/page.tsx
@@ -0,0 +1,7 @@
+export default function Page() {
+  return <p id="bar-page">test-page @bar - 1</p>
+}
+
+export const metadata = {
+  title: 'first page - @bar',
+}
diff --git a/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@bar/layout.tsx b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@bar/layout.tsx
new file mode 100644
index 0000000000000..1e18e748cf81e
--- /dev/null
+++ b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@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>
+  )
+}
diff --git a/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@bar/page.tsx b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@bar/page.tsx
new file mode 100644
index 0000000000000..eb4a3e2e9df71
--- /dev/null
+++ b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@bar/page.tsx
@@ -0,0 +1,3 @@
+export default function Page() {
+  return 'page @bar'
+}
diff --git a/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@bar/second/page.tsx b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@bar/second/page.tsx
new file mode 100644
index 0000000000000..ce3b2fa487590
--- /dev/null
+++ b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@bar/second/page.tsx
@@ -0,0 +1,7 @@
+export default function Page() {
+  return <p id="bar-page">test-page @bar - 2</p>
+}
+
+export const metadata = {
+  title: 'second page - @bar',
+}
diff --git a/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@foo/default.tsx b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@foo/default.tsx
new file mode 100644
index 0000000000000..408576f1876b5
--- /dev/null
+++ b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@foo/default.tsx
@@ -0,0 +1,3 @@
+export default function Page() {
+  return 'default @foo'
+}
diff --git a/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@foo/layout.tsx b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@foo/layout.tsx
new file mode 100644
index 0000000000000..05a3bda4f7be8
--- /dev/null
+++ b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@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>
+  )
+}
diff --git a/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@foo/no-bar/page.tsx b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@foo/no-bar/page.tsx
new file mode 100644
index 0000000000000..44ab40e2ddfce
--- /dev/null
+++ b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@foo/no-bar/page.tsx
@@ -0,0 +1,3 @@
+export default function Page() {
+  return 'no-bar @foo'
+}
diff --git a/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@foo/page.tsx b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@foo/page.tsx
new file mode 100644
index 0000000000000..3536981cea3ff
--- /dev/null
+++ b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@foo/page.tsx
@@ -0,0 +1,3 @@
+export default function Page() {
+  return 'page @foo'
+}
diff --git a/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@foo/test-page/page.tsx b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@foo/test-page/page.tsx
new file mode 100644
index 0000000000000..8eff01dbe6dec
--- /dev/null
+++ b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/@foo/test-page/page.tsx
@@ -0,0 +1,3 @@
+export default function Page() {
+  return 'test-page @foo'
+}
diff --git a/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/layout.tsx b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/layout.tsx
new file mode 100644
index 0000000000000..90ff6a8eb8042
--- /dev/null
+++ b/test/e2e/app-dir/metadata-streaming-parallel-routes/app/parallel-routes-no-children/layout.tsx
@@ -0,0 +1,34 @@
+import { connection } from 'next/server'
+import Link from 'next/link'
+
+// skip rendering children
+export default function Layout({ bar, foo }) {
+  return (
+    <div>
+      <h1>Parallel Routes Layout - No Children</h1>
+
+      <Link href="/parallel-routes-no-children/first" id="to-no-children-first">
+        {`to /parallel-routes-no-children/first`}
+      </Link>
+      <br />
+      <Link
+        href="/parallel-routes-no-children/second"
+        id="to-no-children-second"
+      >
+        {`to /parallel-routes-no-children/second`}
+      </Link>
+      <br />
+
+      <div id="foo-slot">{foo}</div>
+      <div id="bar-slot">{bar}</div>
+    </div>
+  )
+}
+
+export async function generateMetadata() {
+  await connection()
+  await new Promise((resolve) => setTimeout(resolve, 300))
+  return {
+    title: 'parallel-routes-default layout title',
+  }
+}
diff --git a/test/e2e/app-dir/metadata-streaming-parallel-routes/metadata-streaming-parallel-routes.test.ts b/test/e2e/app-dir/metadata-streaming-parallel-routes/metadata-streaming-parallel-routes.test.ts
index 08f8469bb503c..36e10dff4ab3d 100644
--- a/test/e2e/app-dir/metadata-streaming-parallel-routes/metadata-streaming-parallel-routes.test.ts
+++ b/test/e2e/app-dir/metadata-streaming-parallel-routes/metadata-streaming-parallel-routes.test.ts
@@ -57,4 +57,29 @@ describe('app-dir - metadata-streaming', () => {
     expect($('title').length).toBe(1)
     expect($('body title').text()).toBe('parallel-routes-default layout title')
   })
+
+  it('should change metadata when navigating between two pages under a slot when children is not rendered', async () => {
+    // first page is /parallel-routes-no-children/first,
+    // second page is /parallel-routes-no-children/second
+    // navigating between them should change the title metadata
+    const browser = await next.browser('/parallel-routes-no-children/first')
+    await retry(async () => {
+      expect(await browser.elementByCss('title').text()).toBe(
+        'first page - @bar'
+      )
+    })
+    // go to second page
+    await browser
+      .elementByCss('[href="/parallel-routes-no-children/second"]')
+      .click()
+    // wait for navigation to finish
+    await retry(async () => {
+      expect(await browser.elementByCss('#bar-page').text()).toBe(
+        'test-page @bar - 2'
+      )
+    })
+    expect(await browser.elementByCss('title').text()).toBe(
+      'second page - @bar'
+    )
+  })
 })
diff --git a/test/e2e/esm-externals/app/client/page.js b/test/e2e/esm-externals/app/client/page.js
index ba89668ed4573..f24644af006a4 100644
--- a/test/e2e/esm-externals/app/client/page.js
+++ b/test/e2e/esm-externals/app/client/page.js
@@ -6,8 +6,8 @@ import World3 from 'app-cjs-esm-package/entry'
 
 export default function Index() {
   return (
-    <div>
+    <p>
       Hello {World1}+{World2}+{World3}
-    </div>
+    </p>
   )
 }
diff --git a/test/e2e/esm-externals/app/server/page.js b/test/e2e/esm-externals/app/server/page.js
index 1a60cabec1618..cf273aaaa9179 100644
--- a/test/e2e/esm-externals/app/server/page.js
+++ b/test/e2e/esm-externals/app/server/page.js
@@ -4,8 +4,8 @@ import World3 from 'app-cjs-esm-package/entry'
 
 export default function Page() {
   return (
-    <div>
+    <p>
       Hello {World1}+{World2}+{World3}
-    </div>
+    </p>
   )
 }
diff --git a/test/e2e/esm-externals/esm-externals.test.ts b/test/e2e/esm-externals/esm-externals.test.ts
index dc6d827129669..9dc981eb3d989 100644
--- a/test/e2e/esm-externals/esm-externals.test.ts
+++ b/test/e2e/esm-externals/esm-externals.test.ts
@@ -28,15 +28,13 @@ describe('esm-externals', () => {
 
     it('should return the correct SSR HTML', async () => {
       const $ = await next.render$(url)
-      const body = $('body > div > div').html()
+      const body = $('body p').html()
       expect(normalize(body)).toEqual(expectedHtml)
     })
 
     it('should render the correct page', async () => {
       const browser = await next.browser(url)
-      expect(await browser.elementByCss('body > div').text()).toEqual(
-        expectedText
-      )
+      expect(await browser.elementByCss('body p').text()).toEqual(expectedText)
     })
   })
 
@@ -54,13 +52,13 @@ describe('esm-externals', () => {
 
     it('should return the correct SSR HTML', async () => {
       const $ = await next.render$(url)
-      const body = $('body > div').html()
+      const body = $('body > p').html()
       expect(normalize(body)).toEqual(expectedHtml)
     })
 
     it('should render the correct page', async () => {
       const browser = await next.browser(url)
-      expect(await browser.elementByCss('body > div').text()).toEqual(
+      expect(await browser.elementByCss('body > p').text()).toEqual(
         expectedText
       )
     })
diff --git a/test/e2e/esm-externals/pages/ssg.js b/test/e2e/esm-externals/pages/ssg.js
index fff2c7fbb6ebe..b1c438f8820c6 100644
--- a/test/e2e/esm-externals/pages/ssg.js
+++ b/test/e2e/esm-externals/pages/ssg.js
@@ -13,8 +13,8 @@ export async function getStaticProps() {
 
 export default function Index({ worlds }) {
   return (
-    <div>
+    <p>
       Hello {World1}+{World2}+{World3}+{worlds}
-    </div>
+    </p>
   )
 }
diff --git a/test/e2e/esm-externals/pages/ssr.js b/test/e2e/esm-externals/pages/ssr.js
index e937db62b3586..a7a6350d6f504 100644
--- a/test/e2e/esm-externals/pages/ssr.js
+++ b/test/e2e/esm-externals/pages/ssr.js
@@ -13,8 +13,8 @@ export function getServerSideProps() {
 
 export default function Index({ worlds }) {
   return (
-    <div>
+    <p>
       Hello {World1}+{World2}+{World3}+{worlds}
-    </div>
+    </p>
   )
 }
diff --git a/test/e2e/esm-externals/pages/static.js b/test/e2e/esm-externals/pages/static.js
index 34fb44743670c..523919c09cc97 100644
--- a/test/e2e/esm-externals/pages/static.js
+++ b/test/e2e/esm-externals/pages/static.js
@@ -7,8 +7,8 @@ const worlds = 'World+World+World'
 
 export default function Index() {
   return (
-    <div>
+    <p>
       Hello {World1}+{World2}+{World3}+{worlds}
-    </div>
+    </p>
   )
 }