From 9c2949a95021d95f8a661b0c4529c01ab64a2111 Mon Sep 17 00:00:00 2001 From: OJ Kwon Date: Fri, 18 Mar 2022 02:44:56 -0700 Subject: [PATCH] fix(document): accepts nodearray for head's children (#35424) This PR attempts to amends #35390. There's new property 'children' in `OriginProps` : https://github.com/vercel/next.js/blob/canary/packages/next/pages/_document.tsx#L22 which overwrites default prop's children defined at https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/react/index.d.ts#L504. Those 2 are incompatible, especially new one doesn't allow iterable children which results multiple children in head tag makes compilation fails. PR matches type of new property same as default, then apply some workaround to bend over internal check logics. I'm not sure if it's worth to apply strict types as much or just bend it via `any` casting, PR tried to be strict as much. ## Bug - closes https://github.com/vercel/next.js/issues/35390 - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Errors have 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 helpful link attached, see `contributing.md` ## Documentation / Examples - [ ] Make sure the linting passes by running `yarn lint` --- packages/next/pages/_document.tsx | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/packages/next/pages/_document.tsx b/packages/next/pages/_document.tsx index adc58bf357df..57a5f4a24af3 100644 --- a/packages/next/pages/_document.tsx +++ b/packages/next/pages/_document.tsx @@ -19,7 +19,7 @@ export { DocumentContext, DocumentInitialProps, DocumentProps } export type OriginProps = { nonce?: string crossOrigin?: string - children?: React.ReactElement + children?: React.ReactNode } type DocumentFiles = { @@ -72,6 +72,10 @@ function getPolyfillScripts(context: HtmlProps, props: OriginProps) { )) } +function hasComponentProps(child: any): child is React.ReactElement { + return !!child && !!child.props +} + function getPreNextWorkerScripts(context: HtmlProps, props: OriginProps) { const { assetPrefix, scriptLoader, crossOrigin, nextScriptWorkers } = context @@ -88,7 +92,8 @@ function getPreNextWorkerScripts(context: HtmlProps, props: OriginProps) { // Check to see if the user has defined their own Partytown configuration const userDefinedConfig = children.find( - (child: React.ReactElement) => + (child) => + hasComponentProps(child) && child?.props?.dangerouslySetInnerHTML?.__html.length && 'data-partytown-config' in child.props )