diff --git a/packages/next/pages/_document.tsx b/packages/next/pages/_document.tsx index cac934af2801bcc..c1c00608dc5fb65 100644 --- a/packages/next/pages/_document.tsx +++ b/packages/next/pages/_document.tsx @@ -756,15 +756,11 @@ export class Head extends Component< } } -export function Main({ - children, -}: { - children?: (content: JSX.Element) => JSX.Element -}) { - const { docComponentsRendered, useMainContent } = useContext(HtmlContext) - const content = useMainContent(children) +export function Main() { + const { docComponentsRendered } = useContext(HtmlContext) docComponentsRendered.Main = true - return content + // @ts-ignore + return } export class NextScript extends Component { diff --git a/packages/next/server/render.tsx b/packages/next/server/render.tsx index 00d6546ec15a2f2..f5b30f9b5d77545 100644 --- a/packages/next/server/render.tsx +++ b/packages/next/server/render.tsx @@ -1048,20 +1048,6 @@ export async function renderToHTML( return inAmpMode ? children :
{children}
} - const appWrappers: Array<(content: JSX.Element) => JSX.Element> = [] - const getWrappedApp = (app: JSX.Element) => { - // Prevent wrappers from reading/writing props by rendering inside an - // opaque component. Wrappers should use context instead. - const InnerApp = () => app - return ( - - {appWrappers.reduceRight((innerContent, fn) => { - return fn(innerContent) - }, )} - - ) - } - /** * Rules of Static & Dynamic HTML: * @@ -1106,13 +1092,13 @@ export async function renderToHTML( const html = ReactDOMServer.renderToString( - {getWrappedApp( + - )} + ) return { html, head } @@ -1137,15 +1123,6 @@ export async function renderToHTML( documentElement: (htmlProps: HtmlProps) => ( ), - useMainContent: (fn?: (content: JSX.Element) => JSX.Element) => { - if (fn) { - throw new Error( - 'The `children` property is not supported by non-functional custom Document components' - ) - } - // @ts-ignore - return - }, head: docProps.head, headTags: await headTags(documentCtx), styles: docProps.styles, @@ -1164,9 +1141,9 @@ export async function renderToHTML( ) : ( - {getWrappedApp( + - )} + ) return process.browser @@ -1181,9 +1158,9 @@ export async function renderToHTML( ) : ( - {getWrappedApp( + - )} + ) // for non-concurrent rendering we need to ensure App is rendered @@ -1196,13 +1173,6 @@ export async function renderToHTML( return { bodyResult, documentElement: () => (Document as any)(), - useMainContent: (fn?: (_content: JSX.Element) => JSX.Element) => { - if (fn) { - appWrappers.push(fn) - } - // @ts-ignore - return - }, head, headTags: [], styles: jsxStyleRegistry.styles(), @@ -1243,7 +1213,7 @@ export async function renderToHTML( locales, runtimeConfig, } = renderOpts - const htmlProps: any = { + const htmlProps: HtmlProps = { __NEXT_DATA__: { props, // The result of getInitialProps page: pathname, // The rendered page @@ -1297,7 +1267,6 @@ export async function renderToHTML( head: documentResult.head, headTags: documentResult.headTags, styles: documentResult.styles, - useMainContent: documentResult.useMainContent, useMaybeDeferContent, crossOrigin: renderOpts.crossOrigin, optimizeCss: renderOpts.optimizeCss, diff --git a/packages/next/shared/lib/utils.ts b/packages/next/shared/lib/utils.ts index bb4104ada7721bb..8c2cd3ff7cbc378 100644 --- a/packages/next/shared/lib/utils.ts +++ b/packages/next/shared/lib/utils.ts @@ -221,7 +221,6 @@ export type HtmlProps = { styles?: React.ReactElement[] | React.ReactFragment head?: Array useMaybeDeferContent: MaybeDeferContentHook - useMainContent: (fn?: (content: JSX.Element) => JSX.Element) => JSX.Element crossOrigin?: string optimizeCss?: boolean optimizeFonts?: boolean diff --git a/test/integration/document-functional-render-prop/app/lib/context.js b/test/integration/document-functional-render-prop/app/lib/context.js deleted file mode 100644 index 229e13653eb1c0d..000000000000000 --- a/test/integration/document-functional-render-prop/app/lib/context.js +++ /dev/null @@ -1,3 +0,0 @@ -import { createContext } from 'react' - -export default createContext(null) diff --git a/test/integration/document-functional-render-prop/app/next.config.js b/test/integration/document-functional-render-prop/app/next.config.js deleted file mode 100644 index 704dfdcd9eed8bf..000000000000000 --- a/test/integration/document-functional-render-prop/app/next.config.js +++ /dev/null @@ -1,7 +0,0 @@ -const withReact18 = require('../../react-18/test/with-react-18') - -module.exports = withReact18({ - experimental: { - concurrentFeatures: true, - }, -}) diff --git a/test/integration/document-functional-render-prop/app/package.json b/test/integration/document-functional-render-prop/app/package.json deleted file mode 100644 index f9dafc993a79cae..000000000000000 --- a/test/integration/document-functional-render-prop/app/package.json +++ /dev/null @@ -1,12 +0,0 @@ -{ - "scripts": { - "next": "node -r ../test/require-hook.js ../../../../packages/next/dist/bin/next", - "dev": "yarn next dev", - "build": "yarn next build", - "start": "yarn next start" - }, - "dependencies": { - "react": "*", - "react-dom": "*" - } -} diff --git a/test/integration/document-functional-render-prop/app/pages/_document.js b/test/integration/document-functional-render-prop/app/pages/_document.js deleted file mode 100644 index 6f7199c4e6d00f4..000000000000000 --- a/test/integration/document-functional-render-prop/app/pages/_document.js +++ /dev/null @@ -1,20 +0,0 @@ -import { Html, Head, Main, NextScript } from 'next/document' -import Context from '../lib/context' - -export default function Document() { - return ( - - - -
- {(children) => ( - - {children} - - )} -
- - - - ) -} diff --git a/test/integration/document-functional-render-prop/app/pages/index.js b/test/integration/document-functional-render-prop/app/pages/index.js deleted file mode 100644 index d00fe7fc70a6b5d..000000000000000 --- a/test/integration/document-functional-render-prop/app/pages/index.js +++ /dev/null @@ -1,7 +0,0 @@ -import { useContext } from 'react' -import Context from '../lib/context' - -export default function MainRenderProp() { - const value = useContext(Context) - return {value} -} diff --git a/test/integration/document-functional-render-prop/tests/index.test.js b/test/integration/document-functional-render-prop/tests/index.test.js deleted file mode 100644 index c843082feed935e..000000000000000 --- a/test/integration/document-functional-render-prop/tests/index.test.js +++ /dev/null @@ -1,25 +0,0 @@ -/* eslint-env jest */ - -import { join } from 'path' -import { findPort, launchApp, killApp, renderViaHTTP } from 'next-test-utils' - -const nodeArgs = ['-r', join(__dirname, '../../react-18/test/require-hook.js')] -const appDir = join(__dirname, '../app') -let appPort -let app - -describe('Functional Custom Document', () => { - describe('development mode', () => { - beforeAll(async () => { - appPort = await findPort() - app = await launchApp(appDir, appPort, { nodeArgs }) - }) - - afterAll(() => killApp(app)) - - it('supports render props', async () => { - const html = await renderViaHTTP(appPort, '/') - expect(html).toMatch(/from render prop<\/span>/) - }) - }) -})