Root layout head not required (vercel#41621)

Remove head as required in root layout. ## Bug - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Errors have a helpful link attached, see `contributing.md` ## Feature - [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR. - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Documentation added - [ ] Telemetry added. In case of a feature if it's used or not. - [ ] Errors have a helpful link attached, see `contributing.md` ## Documentation / Examples - [ ] Make sure the linting passes by running `pnpm lint` - [ ] The "examples guidelines" are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)
Kikobeats · Oct 24, 2022 · 5798f7d · 5798f7d
1 parent fccb265
commit 5798f7d
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 16 deletions.
diff --git a/packages/next/client/components/react-dev-overlay/internal/container/RootLayoutError.tsx b/packages/next/client/components/react-dev-overlay/internal/container/RootLayoutError.tsx
@@ -14,7 +14,7 @@ export type RootLayoutErrorProps = { missingTags: string[] }
 export const RootLayoutError: React.FC<RootLayoutErrorProps> =
   function BuildError({ missingTags }) {
     const message =
-      'Please make sure to include the following tags in your root layout: <html>, <head>, <body>.\n\n' +
+      'Please make sure to include the following tags in your root layout: <html>, <body>.\n\n' +
       `Missing required root layout tag${
         missingTags.length === 1 ? '' : 's'
       }: ` +

diff --git a/packages/next/server/node-web-streams-helper.ts b/packages/next/server/node-web-streams-helper.ts
@@ -263,19 +263,15 @@ export function createRootLayoutValidatorStream(
   getTree: () => FlightRouterState
 ): TransformStream<Uint8Array, Uint8Array> {
   let foundHtml = false
-  let foundHead = false
   let foundBody = false
 
   return new TransformStream({
     async transform(chunk, controller) {
-      if (!foundHtml || !foundHead || !foundBody) {
+      if (!foundHtml || !foundBody) {
         const content = decodeText(chunk)
         if (!foundHtml && content.includes('<html')) {
           foundHtml = true
         }
-        if (!foundHead && content.includes('<head')) {
-          foundHead = true
-        }
         if (!foundBody && content.includes('<body')) {
           foundBody = true
         }
@@ -285,7 +281,6 @@ export function createRootLayoutValidatorStream(
     flush(controller) {
       const missingTags = [
         foundHtml ? null : 'html',
-        foundHead ? null : 'head',
         foundBody ? null : 'body',
       ].filter(nonNullable)
 

diff --git a/test/e2e/app-dir/root-layout.test.ts b/test/e2e/app-dir/root-layout.test.ts
@@ -43,9 +43,9 @@ describe('app-dir root layout', () => {
 
         expect(await hasRedbox(browser, true)).toBe(true)
         expect(await getRedboxSource(browser)).toMatchInlineSnapshot(`
-          "Please make sure to include the following tags in your root layout: <html>, <head>, <body>.
+          "Please make sure to include the following tags in your root layout: <html>, <body>.
 
-          Missing required root layout tags: html, head, body"
+          Missing required root layout tags: html, body"
         `)
       })
 
@@ -57,9 +57,9 @@ describe('app-dir root layout', () => {
 
         expect(await hasRedbox(browser, true)).toBe(true)
         expect(await getRedboxSource(browser)).toMatchInlineSnapshot(`
-          "Please make sure to include the following tags in your root layout: <html>, <head>, <body>.
+          "Please make sure to include the following tags in your root layout: <html>, <body>.
 
-          Missing required root layout tags: html, head, body"
+          Missing required root layout tags: html, body"
         `)
       })
 
@@ -70,9 +70,9 @@ describe('app-dir root layout', () => {
 
         expect(await hasRedbox(browser, true)).toBe(true)
         expect(await getRedboxSource(browser)).toMatchInlineSnapshot(`
-          "Please make sure to include the following tags in your root layout: <html>, <head>, <body>.
+          "Please make sure to include the following tags in your root layout: <html>, <body>.
 
-          Missing required root layout tags: html, head, body"
+          Missing required root layout tags: html, body"
         `)
       })
     })

diff --git a/test/e2e/app-dir/root-layout/app/(required-tags)/has-tags/layout.js b/test/e2e/app-dir/root-layout/app/(required-tags)/has-tags/layout.js
@@ -4,9 +4,6 @@ export const revalidate = 0
 export default function Root({ children }) {
   return (
     <html>
-      <head>
-        <title>Hello World</title>
-      </head>
       <body>{children}</body>
     </html>
   )