From fea1d999248d146b2e885aaf5394a5d79257ed3f Mon Sep 17 00:00:00 2001 From: Josh Story Date: Mon, 1 May 2023 13:55:05 -0700 Subject: [PATCH] Boolean props should coerce consistently between HostHoistable and HostComponent and Fizz equivalents --- .../src/client/ReactFiberConfigDOM.js | 31 ++++++++++++++----- .../src/server/ReactFizzConfigDOM.js | 10 ++++-- 2 files changed, 31 insertions(+), 10 deletions(-) diff --git a/packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js b/packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js index 67723652268dd..53d021e7bbfc9 100644 --- a/packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js +++ b/packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js @@ -1027,7 +1027,12 @@ export function isHydratableType(type: string, props: Props): boolean { if (enableFloat) { if (type === 'script') { const {async, onLoad, onError} = (props: any); - return !(async && (onLoad || onError)); + return !( + async && + (onLoad || onError) && + typeof async !== 'function' && + typeof async !== 'symbol' + ); } return true; } else { @@ -2455,9 +2460,15 @@ export function getResource( return null; } case 'script': { - if (typeof pendingProps.src === 'string' && pendingProps.async === true) { - const scriptProps: ScriptProps = pendingProps; - const key = getScriptKey(scriptProps.src); + const async = pendingProps.async; + const src = pendingProps.src; + if ( + typeof src === 'string' && + async && + typeof async !== 'function' && + typeof async !== 'symbol' + ) { + const key = getScriptKey(src); const scripts = getResourcesFromRoot(resourceRoot).hoistableScripts; let resource = scripts.get(key); @@ -3102,16 +3113,20 @@ export function isHostHoistableType( } } case 'script': { + const isAsync = + props.async && + typeof props.async !== 'function' && + typeof props.async !== 'symbol'; if ( - props.async !== true || + !isAsync || props.onLoad || props.onError || - typeof props.src !== 'string' || - !props.src + !props.src || + typeof props.src !== 'string' ) { if (__DEV__) { if (outsideHostContainerContext) { - if (props.async !== true) { + if (!isAsync) { console.error( 'Cannot render a sync or defer