Fix document head with react 18 (#37443)

Fix custom head on getInitialProps works with React 18

## Bug

- [ ] Related issues linked using `fixes #number`
- [x] Integration tests added
- [ ] Errors have helpful link attached, see `contributing.md`

Co-authored-by: Jiachi Liu <4800338+huozhi@users.noreply.github.com>

packages/next/server/render.tsx

@@ -1455,6 +1455,7 @@ export async function renderToHTML(
       let styles
       if (hasDocumentGetInitialProps) {
         styles = docProps.styles
+        head = docProps.head
       } else {
         styles = jsxStyleRegistry.styles()
         jsxStyleRegistry.flush()

test/e2e/next-head/app/pages/_document.js

@@ -1,4 +1,4 @@
-import { Html, Head, Main, NextScript } from 'next/document'
+import Document, { Html, Head, Main, NextScript } from 'next/document'
 
 export default function MyDocument() {
   return (
@@ -11,3 +11,15 @@ export default function MyDocument() {
     </Html>
   )
 }
+
+MyDocument.getInitialProps = async (context) => {
+  const initialProps = await Document.getInitialProps(context)
+
+  return {
+    ...initialProps,
+    head: [
+      ...(initialProps?.head ?? []),
+      <meta name="test-head-initial-props" content="hello" />,
+    ],
+  }
+}

test/e2e/next-head/index.test.ts

@@ -14,10 +14,6 @@ describe('should set-up next', () => {
         pages: new FileRef(join(__dirname, 'app/pages')),
         components: new FileRef(join(__dirname, 'app/components')),
       },
-      dependencies: {
-        react: '17',
-        'react-dom': '17',
-      },
     })
   })
   afterAll(() => next.destroy())
@@ -62,4 +58,13 @@ describe('should set-up next', () => {
       ).toBe('hello')
     }
   })
+
+  it('should have current head tags from a _document getInitialProps', async () => {
+    const html = await renderViaHTTP(next.url, '/')
+    const $ = cheerio.load(html)
+
+    expect($(`meta[name="test-head-initial-props"]`).attr()['content']).toBe(
+      'hello'
+    )
+  })
 })