diff --git a/compiled/facebook-www/REVISION b/compiled/facebook-www/REVISION index dd906bc893ced..a404c80f5997b 100644 --- a/compiled/facebook-www/REVISION +++ b/compiled/facebook-www/REVISION @@ -1 +1 @@ -afb3d51dc6310f0dbeffdd303eb3c6895e6f7db0 +51a7c45f8799cab903693fcfdd305ce84ba15273 diff --git a/compiled/facebook-www/React-dev.modern.js b/compiled/facebook-www/React-dev.modern.js index d311460335ab9..ee7762bb5db01 100644 --- a/compiled/facebook-www/React-dev.modern.js +++ b/compiled/facebook-www/React-dev.modern.js @@ -27,7 +27,7 @@ if ( } "use strict"; -var ReactVersion = "18.3.0-www-modern-b3a4de20"; +var ReactVersion = "18.3.0-www-modern-e3dcc95d"; // ATTENTION // When adding new symbols to this file, diff --git a/compiled/facebook-www/ReactART-dev.classic.js b/compiled/facebook-www/ReactART-dev.classic.js index b02cfc9ff0a70..ad85031365d35 100644 --- a/compiled/facebook-www/ReactART-dev.classic.js +++ b/compiled/facebook-www/ReactART-dev.classic.js @@ -69,7 +69,7 @@ function _assertThisInitialized(self) { return self; } -var ReactVersion = "18.3.0-www-classic-ac5037f5"; +var ReactVersion = "18.3.0-www-classic-7d98bb40"; var LegacyRoot = 0; var ConcurrentRoot = 1; @@ -7166,7 +7166,14 @@ function getShellBoundary() { function pushPrimaryTreeSuspenseHandler(handler) { // TODO: Pass as argument var current = handler.alternate; - var props = handler.pendingProps; // Experimental feature: Some Suspense boundaries are marked as having an + var props = handler.pendingProps; // Shallow Suspense context fields, like ForceSuspenseFallback, should only be + // propagated a single level. For example, when ForceSuspenseFallback is set, + // it should only force the nearest Suspense boundary into fallback mode. + + pushSuspenseListContext( + handler, + setDefaultShallowSuspenseListContext(suspenseStackCursor.current) + ); // Experimental feature: Some Suspense boundaries are marked as having an // undesirable fallback state. These have special behavior where we only // activate the fallback if there's no other boundary on the stack that we can // use instead. @@ -7218,6 +7225,11 @@ function pushFallbackTreeSuspenseHandler(fiber) { } function pushOffscreenSuspenseHandler(fiber) { if (fiber.tag === OffscreenComponent) { + // A SuspenseList context is only pushed here to avoid a push/pop mismatch. + // Reuse the current value on the stack. + // TODO: We can avoid needing to push here by by forking popSuspenseHandler + // into separate functions for Suspense and Offscreen. + pushSuspenseListContext(fiber, suspenseStackCursor.current); push(suspenseHandlerStackCursor, fiber, fiber); if (shellBoundary !== null); @@ -7240,6 +7252,7 @@ function pushOffscreenSuspenseHandler(fiber) { } } function reuseSuspenseHandlerOnStack(fiber) { + pushSuspenseListContext(fiber, suspenseStackCursor.current); push(suspenseHandlerStackCursor, getSuspenseHandler(), fiber); } function getSuspenseHandler() { @@ -7252,6 +7265,8 @@ function popSuspenseHandler(fiber) { // Popping back into the shell. shellBoundary = null; } + + popSuspenseListContext(fiber); } // SuspenseList context // TODO: Move to a separate module? We may change the SuspenseList // implementation to hide/show in the commit phase, anyway. @@ -14551,6 +14566,8 @@ function shouldRemainOnFallback(current, workInProgress, renderLanes) { // If we're already showing a fallback, there are cases where we need to // remain on that fallback regardless of whether the content has resolved. // For example, SuspenseList coordinates when nested content appears. + // TODO: For compatibility with offscreen prerendering, this should also check + // whether the current fiber (if it exists) was visible in the previous tree. if (current !== null) { var suspenseState = current.memoizedState; diff --git a/compiled/facebook-www/ReactART-dev.modern.js b/compiled/facebook-www/ReactART-dev.modern.js index 073c67ea13a62..b5f57a28e9d4a 100644 --- a/compiled/facebook-www/ReactART-dev.modern.js +++ b/compiled/facebook-www/ReactART-dev.modern.js @@ -69,7 +69,7 @@ function _assertThisInitialized(self) { return self; } -var ReactVersion = "18.3.0-www-modern-d114403d"; +var ReactVersion = "18.3.0-www-modern-34dd0fe8"; var LegacyRoot = 0; var ConcurrentRoot = 1; @@ -6922,7 +6922,14 @@ function getShellBoundary() { function pushPrimaryTreeSuspenseHandler(handler) { // TODO: Pass as argument var current = handler.alternate; - var props = handler.pendingProps; // Experimental feature: Some Suspense boundaries are marked as having an + var props = handler.pendingProps; // Shallow Suspense context fields, like ForceSuspenseFallback, should only be + // propagated a single level. For example, when ForceSuspenseFallback is set, + // it should only force the nearest Suspense boundary into fallback mode. + + pushSuspenseListContext( + handler, + setDefaultShallowSuspenseListContext(suspenseStackCursor.current) + ); // Experimental feature: Some Suspense boundaries are marked as having an // undesirable fallback state. These have special behavior where we only // activate the fallback if there's no other boundary on the stack that we can // use instead. @@ -6974,6 +6981,11 @@ function pushFallbackTreeSuspenseHandler(fiber) { } function pushOffscreenSuspenseHandler(fiber) { if (fiber.tag === OffscreenComponent) { + // A SuspenseList context is only pushed here to avoid a push/pop mismatch. + // Reuse the current value on the stack. + // TODO: We can avoid needing to push here by by forking popSuspenseHandler + // into separate functions for Suspense and Offscreen. + pushSuspenseListContext(fiber, suspenseStackCursor.current); push(suspenseHandlerStackCursor, fiber, fiber); if (shellBoundary !== null); @@ -6996,6 +7008,7 @@ function pushOffscreenSuspenseHandler(fiber) { } } function reuseSuspenseHandlerOnStack(fiber) { + pushSuspenseListContext(fiber, suspenseStackCursor.current); push(suspenseHandlerStackCursor, getSuspenseHandler(), fiber); } function getSuspenseHandler() { @@ -7008,6 +7021,8 @@ function popSuspenseHandler(fiber) { // Popping back into the shell. shellBoundary = null; } + + popSuspenseListContext(fiber); } // SuspenseList context // TODO: Move to a separate module? We may change the SuspenseList // implementation to hide/show in the commit phase, anyway. @@ -14246,6 +14261,8 @@ function shouldRemainOnFallback(current, workInProgress, renderLanes) { // If we're already showing a fallback, there are cases where we need to // remain on that fallback regardless of whether the content has resolved. // For example, SuspenseList coordinates when nested content appears. + // TODO: For compatibility with offscreen prerendering, this should also check + // whether the current fiber (if it exists) was visible in the previous tree. if (current !== null) { var suspenseState = current.memoizedState; diff --git a/compiled/facebook-www/ReactART-prod.classic.js b/compiled/facebook-www/ReactART-prod.classic.js index 58033a16a696e..2d7995d2ea04a 100644 --- a/compiled/facebook-www/ReactART-prod.classic.js +++ b/compiled/facebook-www/ReactART-prod.classic.js @@ -2248,8 +2248,10 @@ function popHiddenContext() { var suspenseHandlerStackCursor = createCursor(null), shellBoundary = null; function pushPrimaryTreeSuspenseHandler(handler) { - var current = handler.alternate; - !0 !== handler.pendingProps.unstable_avoidThisFallback || + var current = handler.alternate, + props = handler.pendingProps; + push(suspenseStackCursor, suspenseStackCursor.current & 1); + !0 !== props.unstable_avoidThisFallback || (null !== current && null === currentTreeHiddenStackCursor.current) ? (push(suspenseHandlerStackCursor, handler), null === shellBoundary && @@ -2262,20 +2264,26 @@ function pushPrimaryTreeSuspenseHandler(handler) { } function pushOffscreenSuspenseHandler(fiber) { if (22 === fiber.tag) { - if ((push(suspenseHandlerStackCursor, fiber), null === shellBoundary)) { + if ( + (push(suspenseStackCursor, suspenseStackCursor.current), + push(suspenseHandlerStackCursor, fiber), + null === shellBoundary) + ) { var current = fiber.alternate; null !== current && null !== current.memoizedState && (shellBoundary = fiber); } - } else reuseSuspenseHandlerOnStack(); + } else reuseSuspenseHandlerOnStack(fiber); } function reuseSuspenseHandlerOnStack() { + push(suspenseStackCursor, suspenseStackCursor.current); push(suspenseHandlerStackCursor, suspenseHandlerStackCursor.current); } function popSuspenseHandler(fiber) { pop(suspenseHandlerStackCursor); shellBoundary === fiber && (shellBoundary = null); + pop(suspenseStackCursor); } var suspenseStackCursor = createCursor(0); function findFirstSuspended(row) { @@ -3857,12 +3865,12 @@ function updateOffscreenComponent(current, workInProgress, renderLanes) { } pushTransition(workInProgress, nextProps, nextIsDetached); pushHiddenContext(workInProgress, prevState); - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); workInProgress.memoizedState = null; } else null !== current && pushTransition(workInProgress, null, null), reuseHiddenContextOnStack(), - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); reconcileChildren(current, workInProgress, nextChildren, renderLanes); return workInProgress.child; } @@ -4232,7 +4240,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { didSuspend = nextProps.fallback; if (showFallback) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (current = mountSuspenseFallbackChildren( workInProgress, current, @@ -4263,7 +4271,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { ); if ("number" === typeof nextProps.unstable_expectedLoadTime) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (current = mountSuspenseFallbackChildren( workInProgress, current, @@ -4294,7 +4302,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { ); } if (showFallback) { - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); showFallback = nextProps.fallback; didSuspend = workInProgress.mode; JSCompiler_temp = current.child; @@ -4469,12 +4477,12 @@ function updateDehydratedSuspenseComponent( ); if (null !== workInProgress.memoizedState) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (workInProgress.child = current.child), (workInProgress.flags |= 128), null ); - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); suspenseState = nextProps.fallback; didSuspend = workInProgress.mode; nextProps = createFiberFromOffscreen( @@ -9957,19 +9965,19 @@ var slice = Array.prototype.slice, }; return Text; })(React.Component), - devToolsConfig$jscomp$inline_1157 = { + devToolsConfig$jscomp$inline_1168 = { findFiberByHostInstance: function () { return null; }, bundleType: 0, - version: "18.3.0-www-classic-f03f0ae3", + version: "18.3.0-www-classic-52e77af5", rendererPackageName: "react-art" }; -var internals$jscomp$inline_1332 = { - bundleType: devToolsConfig$jscomp$inline_1157.bundleType, - version: devToolsConfig$jscomp$inline_1157.version, - rendererPackageName: devToolsConfig$jscomp$inline_1157.rendererPackageName, - rendererConfig: devToolsConfig$jscomp$inline_1157.rendererConfig, +var internals$jscomp$inline_1343 = { + bundleType: devToolsConfig$jscomp$inline_1168.bundleType, + version: devToolsConfig$jscomp$inline_1168.version, + rendererPackageName: devToolsConfig$jscomp$inline_1168.rendererPackageName, + rendererConfig: devToolsConfig$jscomp$inline_1168.rendererConfig, overrideHookState: null, overrideHookStateDeletePath: null, overrideHookStateRenamePath: null, @@ -9986,26 +9994,26 @@ var internals$jscomp$inline_1332 = { return null === fiber ? null : fiber.stateNode; }, findFiberByHostInstance: - devToolsConfig$jscomp$inline_1157.findFiberByHostInstance || + devToolsConfig$jscomp$inline_1168.findFiberByHostInstance || emptyFindFiberByHostInstance, findHostInstancesForRefresh: null, scheduleRefresh: null, scheduleRoot: null, setRefreshHandler: null, getCurrentFiber: null, - reconcilerVersion: "18.3.0-www-classic-f03f0ae3" + reconcilerVersion: "18.3.0-www-classic-52e77af5" }; if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) { - var hook$jscomp$inline_1333 = __REACT_DEVTOOLS_GLOBAL_HOOK__; + var hook$jscomp$inline_1344 = __REACT_DEVTOOLS_GLOBAL_HOOK__; if ( - !hook$jscomp$inline_1333.isDisabled && - hook$jscomp$inline_1333.supportsFiber + !hook$jscomp$inline_1344.isDisabled && + hook$jscomp$inline_1344.supportsFiber ) try { - (rendererID = hook$jscomp$inline_1333.inject( - internals$jscomp$inline_1332 + (rendererID = hook$jscomp$inline_1344.inject( + internals$jscomp$inline_1343 )), - (injectedHook = hook$jscomp$inline_1333); + (injectedHook = hook$jscomp$inline_1344); } catch (err) {} } var Path = Mode$1.Path; diff --git a/compiled/facebook-www/ReactART-prod.modern.js b/compiled/facebook-www/ReactART-prod.modern.js index 18a265719215d..5532a5e46dfc3 100644 --- a/compiled/facebook-www/ReactART-prod.modern.js +++ b/compiled/facebook-www/ReactART-prod.modern.js @@ -2054,8 +2054,10 @@ function popHiddenContext() { var suspenseHandlerStackCursor = createCursor(null), shellBoundary = null; function pushPrimaryTreeSuspenseHandler(handler) { - var current = handler.alternate; - !0 !== handler.pendingProps.unstable_avoidThisFallback || + var current = handler.alternate, + props = handler.pendingProps; + push(suspenseStackCursor, suspenseStackCursor.current & 1); + !0 !== props.unstable_avoidThisFallback || (null !== current && null === currentTreeHiddenStackCursor.current) ? (push(suspenseHandlerStackCursor, handler), null === shellBoundary && @@ -2068,20 +2070,26 @@ function pushPrimaryTreeSuspenseHandler(handler) { } function pushOffscreenSuspenseHandler(fiber) { if (22 === fiber.tag) { - if ((push(suspenseHandlerStackCursor, fiber), null === shellBoundary)) { + if ( + (push(suspenseStackCursor, suspenseStackCursor.current), + push(suspenseHandlerStackCursor, fiber), + null === shellBoundary) + ) { var current = fiber.alternate; null !== current && null !== current.memoizedState && (shellBoundary = fiber); } - } else reuseSuspenseHandlerOnStack(); + } else reuseSuspenseHandlerOnStack(fiber); } function reuseSuspenseHandlerOnStack() { + push(suspenseStackCursor, suspenseStackCursor.current); push(suspenseHandlerStackCursor, suspenseHandlerStackCursor.current); } function popSuspenseHandler(fiber) { pop(suspenseHandlerStackCursor); shellBoundary === fiber && (shellBoundary = null); + pop(suspenseStackCursor); } var suspenseStackCursor = createCursor(0); function findFirstSuspended(row) { @@ -3648,12 +3656,12 @@ function updateOffscreenComponent(current, workInProgress, renderLanes) { } pushTransition(workInProgress, nextProps, nextIsDetached); pushHiddenContext(workInProgress, prevState); - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); workInProgress.memoizedState = null; } else null !== current && pushTransition(workInProgress, null, null), reuseHiddenContextOnStack(), - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); reconcileChildren(current, workInProgress, nextChildren, renderLanes); return workInProgress.child; } @@ -3987,7 +3995,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { didSuspend = nextProps.fallback; if (showFallback) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (current = mountSuspenseFallbackChildren( workInProgress, current, @@ -4018,7 +4026,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { ); if ("number" === typeof nextProps.unstable_expectedLoadTime) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (current = mountSuspenseFallbackChildren( workInProgress, current, @@ -4049,7 +4057,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { ); } if (showFallback) { - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); showFallback = nextProps.fallback; didSuspend = workInProgress.mode; JSCompiler_temp = current.child; @@ -4224,12 +4232,12 @@ function updateDehydratedSuspenseComponent( ); if (null !== workInProgress.memoizedState) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (workInProgress.child = current.child), (workInProgress.flags |= 128), null ); - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); suspenseState = nextProps.fallback; didSuspend = workInProgress.mode; nextProps = createFiberFromOffscreen( @@ -9622,19 +9630,19 @@ var slice = Array.prototype.slice, }; return Text; })(React.Component), - devToolsConfig$jscomp$inline_1137 = { + devToolsConfig$jscomp$inline_1148 = { findFiberByHostInstance: function () { return null; }, bundleType: 0, - version: "18.3.0-www-modern-22ca78ee", + version: "18.3.0-www-modern-1925ba21", rendererPackageName: "react-art" }; -var internals$jscomp$inline_1312 = { - bundleType: devToolsConfig$jscomp$inline_1137.bundleType, - version: devToolsConfig$jscomp$inline_1137.version, - rendererPackageName: devToolsConfig$jscomp$inline_1137.rendererPackageName, - rendererConfig: devToolsConfig$jscomp$inline_1137.rendererConfig, +var internals$jscomp$inline_1323 = { + bundleType: devToolsConfig$jscomp$inline_1148.bundleType, + version: devToolsConfig$jscomp$inline_1148.version, + rendererPackageName: devToolsConfig$jscomp$inline_1148.rendererPackageName, + rendererConfig: devToolsConfig$jscomp$inline_1148.rendererConfig, overrideHookState: null, overrideHookStateDeletePath: null, overrideHookStateRenamePath: null, @@ -9651,26 +9659,26 @@ var internals$jscomp$inline_1312 = { return null === fiber ? null : fiber.stateNode; }, findFiberByHostInstance: - devToolsConfig$jscomp$inline_1137.findFiberByHostInstance || + devToolsConfig$jscomp$inline_1148.findFiberByHostInstance || emptyFindFiberByHostInstance, findHostInstancesForRefresh: null, scheduleRefresh: null, scheduleRoot: null, setRefreshHandler: null, getCurrentFiber: null, - reconcilerVersion: "18.3.0-www-modern-22ca78ee" + reconcilerVersion: "18.3.0-www-modern-1925ba21" }; if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) { - var hook$jscomp$inline_1313 = __REACT_DEVTOOLS_GLOBAL_HOOK__; + var hook$jscomp$inline_1324 = __REACT_DEVTOOLS_GLOBAL_HOOK__; if ( - !hook$jscomp$inline_1313.isDisabled && - hook$jscomp$inline_1313.supportsFiber + !hook$jscomp$inline_1324.isDisabled && + hook$jscomp$inline_1324.supportsFiber ) try { - (rendererID = hook$jscomp$inline_1313.inject( - internals$jscomp$inline_1312 + (rendererID = hook$jscomp$inline_1324.inject( + internals$jscomp$inline_1323 )), - (injectedHook = hook$jscomp$inline_1313); + (injectedHook = hook$jscomp$inline_1324); } catch (err) {} } var Path = Mode$1.Path; diff --git a/compiled/facebook-www/ReactDOM-dev.classic.js b/compiled/facebook-www/ReactDOM-dev.classic.js index 7435e403779b1..ca244b0c202c6 100644 --- a/compiled/facebook-www/ReactDOM-dev.classic.js +++ b/compiled/facebook-www/ReactDOM-dev.classic.js @@ -17247,7 +17247,14 @@ function getShellBoundary() { function pushPrimaryTreeSuspenseHandler(handler) { // TODO: Pass as argument var current = handler.alternate; - var props = handler.pendingProps; // Experimental feature: Some Suspense boundaries are marked as having an + var props = handler.pendingProps; // Shallow Suspense context fields, like ForceSuspenseFallback, should only be + // propagated a single level. For example, when ForceSuspenseFallback is set, + // it should only force the nearest Suspense boundary into fallback mode. + + pushSuspenseListContext( + handler, + setDefaultShallowSuspenseListContext(suspenseStackCursor.current) + ); // Experimental feature: Some Suspense boundaries are marked as having an // undesirable fallback state. These have special behavior where we only // activate the fallback if there's no other boundary on the stack that we can // use instead. @@ -17299,6 +17306,11 @@ function pushFallbackTreeSuspenseHandler(fiber) { } function pushOffscreenSuspenseHandler(fiber) { if (fiber.tag === OffscreenComponent) { + // A SuspenseList context is only pushed here to avoid a push/pop mismatch. + // Reuse the current value on the stack. + // TODO: We can avoid needing to push here by by forking popSuspenseHandler + // into separate functions for Suspense and Offscreen. + pushSuspenseListContext(fiber, suspenseStackCursor.current); push(suspenseHandlerStackCursor, fiber, fiber); if (shellBoundary !== null); @@ -17321,6 +17333,7 @@ function pushOffscreenSuspenseHandler(fiber) { } } function reuseSuspenseHandlerOnStack(fiber) { + pushSuspenseListContext(fiber, suspenseStackCursor.current); push(suspenseHandlerStackCursor, getSuspenseHandler(), fiber); } function getSuspenseHandler() { @@ -17333,6 +17346,8 @@ function popSuspenseHandler(fiber) { // Popping back into the shell. shellBoundary = null; } + + popSuspenseListContext(fiber); } // SuspenseList context // TODO: Move to a separate module? We may change the SuspenseList // implementation to hide/show in the commit phase, anyway. @@ -24924,6 +24939,8 @@ function shouldRemainOnFallback(current, workInProgress, renderLanes) { // If we're already showing a fallback, there are cases where we need to // remain on that fallback regardless of whether the content has resolved. // For example, SuspenseList coordinates when nested content appears. + // TODO: For compatibility with offscreen prerendering, this should also check + // whether the current fiber (if it exists) was visible in the previous tree. if (current !== null) { var suspenseState = current.memoizedState; @@ -39144,7 +39161,7 @@ function createFiberRoot( return root; } -var ReactVersion = "18.3.0-www-classic-51af468f"; +var ReactVersion = "18.3.0-www-classic-6ffc95f6"; function createPortal$1( children, diff --git a/compiled/facebook-www/ReactDOM-dev.modern.js b/compiled/facebook-www/ReactDOM-dev.modern.js index 923f473210e09..b5357c0ae709d 100644 --- a/compiled/facebook-www/ReactDOM-dev.modern.js +++ b/compiled/facebook-www/ReactDOM-dev.modern.js @@ -11704,7 +11704,14 @@ function getShellBoundary() { function pushPrimaryTreeSuspenseHandler(handler) { // TODO: Pass as argument var current = handler.alternate; - var props = handler.pendingProps; // Experimental feature: Some Suspense boundaries are marked as having an + var props = handler.pendingProps; // Shallow Suspense context fields, like ForceSuspenseFallback, should only be + // propagated a single level. For example, when ForceSuspenseFallback is set, + // it should only force the nearest Suspense boundary into fallback mode. + + pushSuspenseListContext( + handler, + setDefaultShallowSuspenseListContext(suspenseStackCursor.current) + ); // Experimental feature: Some Suspense boundaries are marked as having an // undesirable fallback state. These have special behavior where we only // activate the fallback if there's no other boundary on the stack that we can // use instead. @@ -11756,6 +11763,11 @@ function pushFallbackTreeSuspenseHandler(fiber) { } function pushOffscreenSuspenseHandler(fiber) { if (fiber.tag === OffscreenComponent) { + // A SuspenseList context is only pushed here to avoid a push/pop mismatch. + // Reuse the current value on the stack. + // TODO: We can avoid needing to push here by by forking popSuspenseHandler + // into separate functions for Suspense and Offscreen. + pushSuspenseListContext(fiber, suspenseStackCursor.current); push(suspenseHandlerStackCursor, fiber, fiber); if (shellBoundary !== null); @@ -11778,6 +11790,7 @@ function pushOffscreenSuspenseHandler(fiber) { } } function reuseSuspenseHandlerOnStack(fiber) { + pushSuspenseListContext(fiber, suspenseStackCursor.current); push(suspenseHandlerStackCursor, getSuspenseHandler(), fiber); } function getSuspenseHandler() { @@ -11790,6 +11803,8 @@ function popSuspenseHandler(fiber) { // Popping back into the shell. shellBoundary = null; } + + popSuspenseListContext(fiber); } // SuspenseList context // TODO: Move to a separate module? We may change the SuspenseList // implementation to hide/show in the commit phase, anyway. @@ -19320,6 +19335,8 @@ function shouldRemainOnFallback(current, workInProgress, renderLanes) { // If we're already showing a fallback, there are cases where we need to // remain on that fallback regardless of whether the content has resolved. // For example, SuspenseList coordinates when nested content appears. + // TODO: For compatibility with offscreen prerendering, this should also check + // whether the current fiber (if it exists) was visible in the previous tree. if (current !== null) { var suspenseState = current.memoizedState; @@ -33507,7 +33524,7 @@ function createFiberRoot( return root; } -var ReactVersion = "18.3.0-www-modern-22ca78ee"; +var ReactVersion = "18.3.0-www-modern-1925ba21"; function createPortal$1( children, diff --git a/compiled/facebook-www/ReactDOM-prod.classic.js b/compiled/facebook-www/ReactDOM-prod.classic.js index 2430e52a89b17..d4ab90cccbf02 100644 --- a/compiled/facebook-www/ReactDOM-prod.classic.js +++ b/compiled/facebook-www/ReactDOM-prod.classic.js @@ -4458,8 +4458,10 @@ function popHiddenContext() { var suspenseHandlerStackCursor = createCursor(null), shellBoundary = null; function pushPrimaryTreeSuspenseHandler(handler) { - var current = handler.alternate; - !0 !== handler.pendingProps.unstable_avoidThisFallback || + var current = handler.alternate, + props = handler.pendingProps; + push(suspenseStackCursor, suspenseStackCursor.current & 1); + !0 !== props.unstable_avoidThisFallback || (null !== current && null === currentTreeHiddenStackCursor.current) ? (push(suspenseHandlerStackCursor, handler), null === shellBoundary && @@ -4472,20 +4474,26 @@ function pushPrimaryTreeSuspenseHandler(handler) { } function pushOffscreenSuspenseHandler(fiber) { if (22 === fiber.tag) { - if ((push(suspenseHandlerStackCursor, fiber), null === shellBoundary)) { + if ( + (push(suspenseStackCursor, suspenseStackCursor.current), + push(suspenseHandlerStackCursor, fiber), + null === shellBoundary) + ) { var current = fiber.alternate; null !== current && null !== current.memoizedState && (shellBoundary = fiber); } - } else reuseSuspenseHandlerOnStack(); + } else reuseSuspenseHandlerOnStack(fiber); } function reuseSuspenseHandlerOnStack() { + push(suspenseStackCursor, suspenseStackCursor.current); push(suspenseHandlerStackCursor, suspenseHandlerStackCursor.current); } function popSuspenseHandler(fiber) { pop(suspenseHandlerStackCursor); shellBoundary === fiber && (shellBoundary = null); + pop(suspenseStackCursor); } var suspenseStackCursor = createCursor(0); function findFirstSuspended(row) { @@ -6136,12 +6144,12 @@ function updateOffscreenComponent(current, workInProgress, renderLanes) { } pushTransition(workInProgress, nextProps, nextIsDetached); pushHiddenContext(workInProgress, prevState); - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); workInProgress.memoizedState = null; } else null !== current && pushTransition(workInProgress, null, null), reuseHiddenContextOnStack(), - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); reconcileChildren(current, workInProgress, nextChildren, renderLanes); return workInProgress.child; } @@ -6527,7 +6535,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { if (isHydrating) { showFallback ? pushPrimaryTreeSuspenseHandler(workInProgress) - : reuseSuspenseHandlerOnStack(); + : reuseSuspenseHandlerOnStack(workInProgress); isHydrating && (((current = nextHydratableInstance), rootOrSingletonContext && advanceToFirstAttemptableSuspenseInstance(), @@ -6577,7 +6585,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { didSuspend = nextProps.fallback; if (showFallback) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (current = mountSuspenseFallbackChildren( workInProgress, current, @@ -6608,7 +6616,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { ); if ("number" === typeof nextProps.unstable_expectedLoadTime) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (current = mountSuspenseFallbackChildren( workInProgress, current, @@ -6639,7 +6647,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { ); } if (showFallback) { - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); showFallback = nextProps.fallback; didSuspend = workInProgress.mode; JSCompiler_temp = current.child; @@ -6811,12 +6819,12 @@ function updateDehydratedSuspenseComponent( ); if (null !== workInProgress.memoizedState) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (workInProgress.child = current.child), (workInProgress.flags |= 128), null ); - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); suspenseState = nextProps.fallback; suspenseInstance = workInProgress.mode; nextProps = createFiberFromOffscreen( @@ -13954,14 +13962,14 @@ var isInputEventSupported = !1; if (canUseDOM) { var JSCompiler_inline_result$jscomp$315; if (canUseDOM) { - var isSupported$jscomp$inline_1606 = "oninput" in document; - if (!isSupported$jscomp$inline_1606) { - var element$jscomp$inline_1607 = document.createElement("div"); - element$jscomp$inline_1607.setAttribute("oninput", "return;"); - isSupported$jscomp$inline_1606 = - "function" === typeof element$jscomp$inline_1607.oninput; + var isSupported$jscomp$inline_1617 = "oninput" in document; + if (!isSupported$jscomp$inline_1617) { + var element$jscomp$inline_1618 = document.createElement("div"); + element$jscomp$inline_1618.setAttribute("oninput", "return;"); + isSupported$jscomp$inline_1617 = + "function" === typeof element$jscomp$inline_1618.oninput; } - JSCompiler_inline_result$jscomp$315 = isSupported$jscomp$inline_1606; + JSCompiler_inline_result$jscomp$315 = isSupported$jscomp$inline_1617; } else JSCompiler_inline_result$jscomp$315 = !1; isInputEventSupported = JSCompiler_inline_result$jscomp$315 && @@ -14102,20 +14110,20 @@ function registerSimpleEvent(domEventName, reactName) { registerTwoPhaseEvent(reactName, [domEventName]); } for ( - var i$jscomp$inline_1619 = 0; - i$jscomp$inline_1619 < simpleEventPluginEvents.length; - i$jscomp$inline_1619++ + var i$jscomp$inline_1630 = 0; + i$jscomp$inline_1630 < simpleEventPluginEvents.length; + i$jscomp$inline_1630++ ) { - var eventName$jscomp$inline_1620 = - simpleEventPluginEvents[i$jscomp$inline_1619], - domEventName$jscomp$inline_1621 = - eventName$jscomp$inline_1620.toLowerCase(), - capitalizedEvent$jscomp$inline_1622 = - eventName$jscomp$inline_1620[0].toUpperCase() + - eventName$jscomp$inline_1620.slice(1); + var eventName$jscomp$inline_1631 = + simpleEventPluginEvents[i$jscomp$inline_1630], + domEventName$jscomp$inline_1632 = + eventName$jscomp$inline_1631.toLowerCase(), + capitalizedEvent$jscomp$inline_1633 = + eventName$jscomp$inline_1631[0].toUpperCase() + + eventName$jscomp$inline_1631.slice(1); registerSimpleEvent( - domEventName$jscomp$inline_1621, - "on" + capitalizedEvent$jscomp$inline_1622 + domEventName$jscomp$inline_1632, + "on" + capitalizedEvent$jscomp$inline_1633 ); } registerSimpleEvent(ANIMATION_END, "onAnimationEnd"); @@ -15805,17 +15813,17 @@ Internals.Events = [ restoreStateIfNeeded, batchedUpdates$1 ]; -var devToolsConfig$jscomp$inline_1775 = { +var devToolsConfig$jscomp$inline_1786 = { findFiberByHostInstance: getClosestInstanceFromNode, bundleType: 0, - version: "18.3.0-www-classic-1f5575cc", + version: "18.3.0-www-classic-9473b24a", rendererPackageName: "react-dom" }; -var internals$jscomp$inline_2155 = { - bundleType: devToolsConfig$jscomp$inline_1775.bundleType, - version: devToolsConfig$jscomp$inline_1775.version, - rendererPackageName: devToolsConfig$jscomp$inline_1775.rendererPackageName, - rendererConfig: devToolsConfig$jscomp$inline_1775.rendererConfig, +var internals$jscomp$inline_2166 = { + bundleType: devToolsConfig$jscomp$inline_1786.bundleType, + version: devToolsConfig$jscomp$inline_1786.version, + rendererPackageName: devToolsConfig$jscomp$inline_1786.rendererPackageName, + rendererConfig: devToolsConfig$jscomp$inline_1786.rendererConfig, overrideHookState: null, overrideHookStateDeletePath: null, overrideHookStateRenamePath: null, @@ -15831,26 +15839,26 @@ var internals$jscomp$inline_2155 = { return null === fiber ? null : fiber.stateNode; }, findFiberByHostInstance: - devToolsConfig$jscomp$inline_1775.findFiberByHostInstance || + devToolsConfig$jscomp$inline_1786.findFiberByHostInstance || emptyFindFiberByHostInstance, findHostInstancesForRefresh: null, scheduleRefresh: null, scheduleRoot: null, setRefreshHandler: null, getCurrentFiber: null, - reconcilerVersion: "18.3.0-www-classic-1f5575cc" + reconcilerVersion: "18.3.0-www-classic-9473b24a" }; if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) { - var hook$jscomp$inline_2156 = __REACT_DEVTOOLS_GLOBAL_HOOK__; + var hook$jscomp$inline_2167 = __REACT_DEVTOOLS_GLOBAL_HOOK__; if ( - !hook$jscomp$inline_2156.isDisabled && - hook$jscomp$inline_2156.supportsFiber + !hook$jscomp$inline_2167.isDisabled && + hook$jscomp$inline_2167.supportsFiber ) try { - (rendererID = hook$jscomp$inline_2156.inject( - internals$jscomp$inline_2155 + (rendererID = hook$jscomp$inline_2167.inject( + internals$jscomp$inline_2166 )), - (injectedHook = hook$jscomp$inline_2156); + (injectedHook = hook$jscomp$inline_2167); } catch (err) {} } assign(Internals, { @@ -16078,4 +16086,4 @@ exports.unstable_renderSubtreeIntoContainer = function ( ); }; exports.unstable_runWithPriority = runWithPriority; -exports.version = "18.3.0-www-classic-1f5575cc"; +exports.version = "18.3.0-www-classic-9473b24a"; diff --git a/compiled/facebook-www/ReactDOM-prod.modern.js b/compiled/facebook-www/ReactDOM-prod.modern.js index 22900be914286..2b6220b28a6b3 100644 --- a/compiled/facebook-www/ReactDOM-prod.modern.js +++ b/compiled/facebook-www/ReactDOM-prod.modern.js @@ -3141,8 +3141,10 @@ function popHiddenContext() { var suspenseHandlerStackCursor = createCursor(null), shellBoundary = null; function pushPrimaryTreeSuspenseHandler(handler) { - var current = handler.alternate; - !0 !== handler.pendingProps.unstable_avoidThisFallback || + var current = handler.alternate, + props = handler.pendingProps; + push(suspenseStackCursor, suspenseStackCursor.current & 1); + !0 !== props.unstable_avoidThisFallback || (null !== current && null === currentTreeHiddenStackCursor.current) ? (push(suspenseHandlerStackCursor, handler), null === shellBoundary && @@ -3155,20 +3157,26 @@ function pushPrimaryTreeSuspenseHandler(handler) { } function pushOffscreenSuspenseHandler(fiber) { if (22 === fiber.tag) { - if ((push(suspenseHandlerStackCursor, fiber), null === shellBoundary)) { + if ( + (push(suspenseStackCursor, suspenseStackCursor.current), + push(suspenseHandlerStackCursor, fiber), + null === shellBoundary) + ) { var current = fiber.alternate; null !== current && null !== current.memoizedState && (shellBoundary = fiber); } - } else reuseSuspenseHandlerOnStack(); + } else reuseSuspenseHandlerOnStack(fiber); } function reuseSuspenseHandlerOnStack() { + push(suspenseStackCursor, suspenseStackCursor.current); push(suspenseHandlerStackCursor, suspenseHandlerStackCursor.current); } function popSuspenseHandler(fiber) { pop(suspenseHandlerStackCursor); shellBoundary === fiber && (shellBoundary = null); + pop(suspenseStackCursor); } var suspenseStackCursor = createCursor(0); function findFirstSuspended(row) { @@ -4804,12 +4812,12 @@ function updateOffscreenComponent(current, workInProgress, renderLanes) { } pushTransition(workInProgress, nextProps, nextIsDetached); pushHiddenContext(workInProgress, prevState); - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); workInProgress.memoizedState = null; } else null !== current && pushTransition(workInProgress, null, null), reuseHiddenContextOnStack(), - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); reconcileChildren(current, workInProgress, nextChildren, renderLanes); return workInProgress.child; } @@ -5159,7 +5167,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { if (isHydrating) { showFallback ? pushPrimaryTreeSuspenseHandler(workInProgress) - : reuseSuspenseHandlerOnStack(); + : reuseSuspenseHandlerOnStack(workInProgress); isHydrating && (((current = nextHydratableInstance), rootOrSingletonContext && advanceToFirstAttemptableSuspenseInstance(), @@ -5209,7 +5217,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { didSuspend = nextProps.fallback; if (showFallback) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (current = mountSuspenseFallbackChildren( workInProgress, current, @@ -5240,7 +5248,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { ); if ("number" === typeof nextProps.unstable_expectedLoadTime) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (current = mountSuspenseFallbackChildren( workInProgress, current, @@ -5271,7 +5279,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { ); } if (showFallback) { - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); showFallback = nextProps.fallback; didSuspend = workInProgress.mode; JSCompiler_temp = current.child; @@ -5443,12 +5451,12 @@ function updateDehydratedSuspenseComponent( ); if (null !== workInProgress.memoizedState) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (workInProgress.child = current.child), (workInProgress.flags |= 128), null ); - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); suspenseState = nextProps.fallback; suspenseInstance = workInProgress.mode; nextProps = createFiberFromOffscreen( @@ -13157,14 +13165,14 @@ var isInputEventSupported = !1; if (canUseDOM) { var JSCompiler_inline_result$jscomp$298; if (canUseDOM) { - var isSupported$jscomp$inline_1525 = "oninput" in document; - if (!isSupported$jscomp$inline_1525) { - var element$jscomp$inline_1526 = document.createElement("div"); - element$jscomp$inline_1526.setAttribute("oninput", "return;"); - isSupported$jscomp$inline_1525 = - "function" === typeof element$jscomp$inline_1526.oninput; + var isSupported$jscomp$inline_1536 = "oninput" in document; + if (!isSupported$jscomp$inline_1536) { + var element$jscomp$inline_1537 = document.createElement("div"); + element$jscomp$inline_1537.setAttribute("oninput", "return;"); + isSupported$jscomp$inline_1536 = + "function" === typeof element$jscomp$inline_1537.oninput; } - JSCompiler_inline_result$jscomp$298 = isSupported$jscomp$inline_1525; + JSCompiler_inline_result$jscomp$298 = isSupported$jscomp$inline_1536; } else JSCompiler_inline_result$jscomp$298 = !1; isInputEventSupported = JSCompiler_inline_result$jscomp$298 && @@ -13476,20 +13484,20 @@ function registerSimpleEvent(domEventName, reactName) { registerTwoPhaseEvent(reactName, [domEventName]); } for ( - var i$jscomp$inline_1566 = 0; - i$jscomp$inline_1566 < simpleEventPluginEvents.length; - i$jscomp$inline_1566++ + var i$jscomp$inline_1577 = 0; + i$jscomp$inline_1577 < simpleEventPluginEvents.length; + i$jscomp$inline_1577++ ) { - var eventName$jscomp$inline_1567 = - simpleEventPluginEvents[i$jscomp$inline_1566], - domEventName$jscomp$inline_1568 = - eventName$jscomp$inline_1567.toLowerCase(), - capitalizedEvent$jscomp$inline_1569 = - eventName$jscomp$inline_1567[0].toUpperCase() + - eventName$jscomp$inline_1567.slice(1); + var eventName$jscomp$inline_1578 = + simpleEventPluginEvents[i$jscomp$inline_1577], + domEventName$jscomp$inline_1579 = + eventName$jscomp$inline_1578.toLowerCase(), + capitalizedEvent$jscomp$inline_1580 = + eventName$jscomp$inline_1578[0].toUpperCase() + + eventName$jscomp$inline_1578.slice(1); registerSimpleEvent( - domEventName$jscomp$inline_1568, - "on" + capitalizedEvent$jscomp$inline_1569 + domEventName$jscomp$inline_1579, + "on" + capitalizedEvent$jscomp$inline_1580 ); } registerSimpleEvent(ANIMATION_END, "onAnimationEnd"); @@ -15328,17 +15336,17 @@ Internals.Events = [ restoreStateIfNeeded, batchedUpdates$1 ]; -var devToolsConfig$jscomp$inline_1745 = { +var devToolsConfig$jscomp$inline_1756 = { findFiberByHostInstance: getClosestInstanceFromNode, bundleType: 0, - version: "18.3.0-www-modern-5315d9ff", + version: "18.3.0-www-modern-26b0d0b8", rendererPackageName: "react-dom" }; -var internals$jscomp$inline_2143 = { - bundleType: devToolsConfig$jscomp$inline_1745.bundleType, - version: devToolsConfig$jscomp$inline_1745.version, - rendererPackageName: devToolsConfig$jscomp$inline_1745.rendererPackageName, - rendererConfig: devToolsConfig$jscomp$inline_1745.rendererConfig, +var internals$jscomp$inline_2154 = { + bundleType: devToolsConfig$jscomp$inline_1756.bundleType, + version: devToolsConfig$jscomp$inline_1756.version, + rendererPackageName: devToolsConfig$jscomp$inline_1756.rendererPackageName, + rendererConfig: devToolsConfig$jscomp$inline_1756.rendererConfig, overrideHookState: null, overrideHookStateDeletePath: null, overrideHookStateRenamePath: null, @@ -15355,26 +15363,26 @@ var internals$jscomp$inline_2143 = { return null === fiber ? null : fiber.stateNode; }, findFiberByHostInstance: - devToolsConfig$jscomp$inline_1745.findFiberByHostInstance || + devToolsConfig$jscomp$inline_1756.findFiberByHostInstance || emptyFindFiberByHostInstance, findHostInstancesForRefresh: null, scheduleRefresh: null, scheduleRoot: null, setRefreshHandler: null, getCurrentFiber: null, - reconcilerVersion: "18.3.0-www-modern-5315d9ff" + reconcilerVersion: "18.3.0-www-modern-26b0d0b8" }; if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) { - var hook$jscomp$inline_2144 = __REACT_DEVTOOLS_GLOBAL_HOOK__; + var hook$jscomp$inline_2155 = __REACT_DEVTOOLS_GLOBAL_HOOK__; if ( - !hook$jscomp$inline_2144.isDisabled && - hook$jscomp$inline_2144.supportsFiber + !hook$jscomp$inline_2155.isDisabled && + hook$jscomp$inline_2155.supportsFiber ) try { - (rendererID = hook$jscomp$inline_2144.inject( - internals$jscomp$inline_2143 + (rendererID = hook$jscomp$inline_2155.inject( + internals$jscomp$inline_2154 )), - (injectedHook = hook$jscomp$inline_2144); + (injectedHook = hook$jscomp$inline_2155); } catch (err) {} } exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = Internals; @@ -15531,4 +15539,4 @@ exports.unstable_createEventHandle = function (type, options) { return eventHandle; }; exports.unstable_runWithPriority = runWithPriority; -exports.version = "18.3.0-www-modern-5315d9ff"; +exports.version = "18.3.0-www-modern-26b0d0b8"; diff --git a/compiled/facebook-www/ReactDOM-profiling.classic.js b/compiled/facebook-www/ReactDOM-profiling.classic.js index faa8d6147025c..ff4969b9af038 100644 --- a/compiled/facebook-www/ReactDOM-profiling.classic.js +++ b/compiled/facebook-www/ReactDOM-profiling.classic.js @@ -4602,8 +4602,10 @@ function popHiddenContext() { var suspenseHandlerStackCursor = createCursor(null), shellBoundary = null; function pushPrimaryTreeSuspenseHandler(handler) { - var current = handler.alternate; - !0 !== handler.pendingProps.unstable_avoidThisFallback || + var current = handler.alternate, + props = handler.pendingProps; + push(suspenseStackCursor, suspenseStackCursor.current & 1); + !0 !== props.unstable_avoidThisFallback || (null !== current && null === currentTreeHiddenStackCursor.current) ? (push(suspenseHandlerStackCursor, handler), null === shellBoundary && @@ -4616,20 +4618,26 @@ function pushPrimaryTreeSuspenseHandler(handler) { } function pushOffscreenSuspenseHandler(fiber) { if (22 === fiber.tag) { - if ((push(suspenseHandlerStackCursor, fiber), null === shellBoundary)) { + if ( + (push(suspenseStackCursor, suspenseStackCursor.current), + push(suspenseHandlerStackCursor, fiber), + null === shellBoundary) + ) { var current = fiber.alternate; null !== current && null !== current.memoizedState && (shellBoundary = fiber); } - } else reuseSuspenseHandlerOnStack(); + } else reuseSuspenseHandlerOnStack(fiber); } function reuseSuspenseHandlerOnStack() { + push(suspenseStackCursor, suspenseStackCursor.current); push(suspenseHandlerStackCursor, suspenseHandlerStackCursor.current); } function popSuspenseHandler(fiber) { pop(suspenseHandlerStackCursor); shellBoundary === fiber && (shellBoundary = null); + pop(suspenseStackCursor); } var suspenseStackCursor = createCursor(0); function findFirstSuspended(row) { @@ -6353,12 +6361,12 @@ function updateOffscreenComponent(current, workInProgress, renderLanes) { } pushTransition(workInProgress, nextProps, nextIsDetached); pushHiddenContext(workInProgress, prevState); - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); workInProgress.memoizedState = null; } else null !== current && pushTransition(workInProgress, null, null), reuseHiddenContextOnStack(), - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); reconcileChildren(current, workInProgress, nextChildren, renderLanes); return workInProgress.child; } @@ -6755,7 +6763,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { if (isHydrating) { showFallback ? pushPrimaryTreeSuspenseHandler(workInProgress) - : reuseSuspenseHandlerOnStack(); + : reuseSuspenseHandlerOnStack(workInProgress); isHydrating && (((current = nextHydratableInstance), rootOrSingletonContext && advanceToFirstAttemptableSuspenseInstance(), @@ -6805,7 +6813,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { didSuspend = nextProps.fallback; if (showFallback) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (current = mountSuspenseFallbackChildren( workInProgress, current, @@ -6836,7 +6844,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { ); if ("number" === typeof nextProps.unstable_expectedLoadTime) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (current = mountSuspenseFallbackChildren( workInProgress, current, @@ -6867,7 +6875,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { ); } if (showFallback) { - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); showFallback = nextProps.fallback; didSuspend = workInProgress.mode; JSCompiler_temp = current.child; @@ -7049,12 +7057,12 @@ function updateDehydratedSuspenseComponent( ); if (null !== workInProgress.memoizedState) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (workInProgress.child = current.child), (workInProgress.flags |= 128), null ); - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); suspenseState = nextProps.fallback; suspenseInstance = workInProgress.mode; nextProps = createFiberFromOffscreen( @@ -14725,14 +14733,14 @@ var isInputEventSupported = !1; if (canUseDOM) { var JSCompiler_inline_result$jscomp$336; if (canUseDOM) { - var isSupported$jscomp$inline_1686 = "oninput" in document; - if (!isSupported$jscomp$inline_1686) { - var element$jscomp$inline_1687 = document.createElement("div"); - element$jscomp$inline_1687.setAttribute("oninput", "return;"); - isSupported$jscomp$inline_1686 = - "function" === typeof element$jscomp$inline_1687.oninput; + var isSupported$jscomp$inline_1697 = "oninput" in document; + if (!isSupported$jscomp$inline_1697) { + var element$jscomp$inline_1698 = document.createElement("div"); + element$jscomp$inline_1698.setAttribute("oninput", "return;"); + isSupported$jscomp$inline_1697 = + "function" === typeof element$jscomp$inline_1698.oninput; } - JSCompiler_inline_result$jscomp$336 = isSupported$jscomp$inline_1686; + JSCompiler_inline_result$jscomp$336 = isSupported$jscomp$inline_1697; } else JSCompiler_inline_result$jscomp$336 = !1; isInputEventSupported = JSCompiler_inline_result$jscomp$336 && @@ -14873,20 +14881,20 @@ function registerSimpleEvent(domEventName, reactName) { registerTwoPhaseEvent(reactName, [domEventName]); } for ( - var i$jscomp$inline_1699 = 0; - i$jscomp$inline_1699 < simpleEventPluginEvents.length; - i$jscomp$inline_1699++ + var i$jscomp$inline_1710 = 0; + i$jscomp$inline_1710 < simpleEventPluginEvents.length; + i$jscomp$inline_1710++ ) { - var eventName$jscomp$inline_1700 = - simpleEventPluginEvents[i$jscomp$inline_1699], - domEventName$jscomp$inline_1701 = - eventName$jscomp$inline_1700.toLowerCase(), - capitalizedEvent$jscomp$inline_1702 = - eventName$jscomp$inline_1700[0].toUpperCase() + - eventName$jscomp$inline_1700.slice(1); + var eventName$jscomp$inline_1711 = + simpleEventPluginEvents[i$jscomp$inline_1710], + domEventName$jscomp$inline_1712 = + eventName$jscomp$inline_1711.toLowerCase(), + capitalizedEvent$jscomp$inline_1713 = + eventName$jscomp$inline_1711[0].toUpperCase() + + eventName$jscomp$inline_1711.slice(1); registerSimpleEvent( - domEventName$jscomp$inline_1701, - "on" + capitalizedEvent$jscomp$inline_1702 + domEventName$jscomp$inline_1712, + "on" + capitalizedEvent$jscomp$inline_1713 ); } registerSimpleEvent(ANIMATION_END, "onAnimationEnd"); @@ -16576,10 +16584,10 @@ Internals.Events = [ restoreStateIfNeeded, batchedUpdates$1 ]; -var devToolsConfig$jscomp$inline_1855 = { +var devToolsConfig$jscomp$inline_1866 = { findFiberByHostInstance: getClosestInstanceFromNode, bundleType: 0, - version: "18.3.0-www-classic-3bcc00dd", + version: "18.3.0-www-classic-0c67a0c2", rendererPackageName: "react-dom" }; (function (internals) { @@ -16597,10 +16605,10 @@ var devToolsConfig$jscomp$inline_1855 = { } catch (err) {} return hook.checkDCE ? !0 : !1; })({ - bundleType: devToolsConfig$jscomp$inline_1855.bundleType, - version: devToolsConfig$jscomp$inline_1855.version, - rendererPackageName: devToolsConfig$jscomp$inline_1855.rendererPackageName, - rendererConfig: devToolsConfig$jscomp$inline_1855.rendererConfig, + bundleType: devToolsConfig$jscomp$inline_1866.bundleType, + version: devToolsConfig$jscomp$inline_1866.version, + rendererPackageName: devToolsConfig$jscomp$inline_1866.rendererPackageName, + rendererConfig: devToolsConfig$jscomp$inline_1866.rendererConfig, overrideHookState: null, overrideHookStateDeletePath: null, overrideHookStateRenamePath: null, @@ -16616,14 +16624,14 @@ var devToolsConfig$jscomp$inline_1855 = { return null === fiber ? null : fiber.stateNode; }, findFiberByHostInstance: - devToolsConfig$jscomp$inline_1855.findFiberByHostInstance || + devToolsConfig$jscomp$inline_1866.findFiberByHostInstance || emptyFindFiberByHostInstance, findHostInstancesForRefresh: null, scheduleRefresh: null, scheduleRoot: null, setRefreshHandler: null, getCurrentFiber: null, - reconcilerVersion: "18.3.0-www-classic-3bcc00dd" + reconcilerVersion: "18.3.0-www-classic-0c67a0c2" }); assign(Internals, { ReactBrowserEventEmitter: { @@ -16850,7 +16858,7 @@ exports.unstable_renderSubtreeIntoContainer = function ( ); }; exports.unstable_runWithPriority = runWithPriority; -exports.version = "18.3.0-www-classic-3bcc00dd"; +exports.version = "18.3.0-www-classic-0c67a0c2"; /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */ if ( diff --git a/compiled/facebook-www/ReactDOM-profiling.modern.js b/compiled/facebook-www/ReactDOM-profiling.modern.js index 549358c20073a..5a70d2c779e20 100644 --- a/compiled/facebook-www/ReactDOM-profiling.modern.js +++ b/compiled/facebook-www/ReactDOM-profiling.modern.js @@ -3289,8 +3289,10 @@ function popHiddenContext() { var suspenseHandlerStackCursor = createCursor(null), shellBoundary = null; function pushPrimaryTreeSuspenseHandler(handler) { - var current = handler.alternate; - !0 !== handler.pendingProps.unstable_avoidThisFallback || + var current = handler.alternate, + props = handler.pendingProps; + push(suspenseStackCursor, suspenseStackCursor.current & 1); + !0 !== props.unstable_avoidThisFallback || (null !== current && null === currentTreeHiddenStackCursor.current) ? (push(suspenseHandlerStackCursor, handler), null === shellBoundary && @@ -3303,20 +3305,26 @@ function pushPrimaryTreeSuspenseHandler(handler) { } function pushOffscreenSuspenseHandler(fiber) { if (22 === fiber.tag) { - if ((push(suspenseHandlerStackCursor, fiber), null === shellBoundary)) { + if ( + (push(suspenseStackCursor, suspenseStackCursor.current), + push(suspenseHandlerStackCursor, fiber), + null === shellBoundary) + ) { var current = fiber.alternate; null !== current && null !== current.memoizedState && (shellBoundary = fiber); } - } else reuseSuspenseHandlerOnStack(); + } else reuseSuspenseHandlerOnStack(fiber); } function reuseSuspenseHandlerOnStack() { + push(suspenseStackCursor, suspenseStackCursor.current); push(suspenseHandlerStackCursor, suspenseHandlerStackCursor.current); } function popSuspenseHandler(fiber) { pop(suspenseHandlerStackCursor); shellBoundary === fiber && (shellBoundary = null); + pop(suspenseStackCursor); } var suspenseStackCursor = createCursor(0); function findFirstSuspended(row) { @@ -5025,12 +5033,12 @@ function updateOffscreenComponent(current, workInProgress, renderLanes) { } pushTransition(workInProgress, nextProps, nextIsDetached); pushHiddenContext(workInProgress, prevState); - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); workInProgress.memoizedState = null; } else null !== current && pushTransition(workInProgress, null, null), reuseHiddenContextOnStack(), - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); reconcileChildren(current, workInProgress, nextChildren, renderLanes); return workInProgress.child; } @@ -5385,7 +5393,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { if (isHydrating) { showFallback ? pushPrimaryTreeSuspenseHandler(workInProgress) - : reuseSuspenseHandlerOnStack(); + : reuseSuspenseHandlerOnStack(workInProgress); isHydrating && (((current = nextHydratableInstance), rootOrSingletonContext && advanceToFirstAttemptableSuspenseInstance(), @@ -5435,7 +5443,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { didSuspend = nextProps.fallback; if (showFallback) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (current = mountSuspenseFallbackChildren( workInProgress, current, @@ -5466,7 +5474,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { ); if ("number" === typeof nextProps.unstable_expectedLoadTime) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (current = mountSuspenseFallbackChildren( workInProgress, current, @@ -5497,7 +5505,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { ); } if (showFallback) { - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); showFallback = nextProps.fallback; didSuspend = workInProgress.mode; JSCompiler_temp = current.child; @@ -5679,12 +5687,12 @@ function updateDehydratedSuspenseComponent( ); if (null !== workInProgress.memoizedState) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (workInProgress.child = current.child), (workInProgress.flags |= 128), null ); - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); suspenseState = nextProps.fallback; suspenseInstance = workInProgress.mode; nextProps = createFiberFromOffscreen( @@ -13926,14 +13934,14 @@ var isInputEventSupported = !1; if (canUseDOM) { var JSCompiler_inline_result$jscomp$319; if (canUseDOM) { - var isSupported$jscomp$inline_1605 = "oninput" in document; - if (!isSupported$jscomp$inline_1605) { - var element$jscomp$inline_1606 = document.createElement("div"); - element$jscomp$inline_1606.setAttribute("oninput", "return;"); - isSupported$jscomp$inline_1605 = - "function" === typeof element$jscomp$inline_1606.oninput; - } - JSCompiler_inline_result$jscomp$319 = isSupported$jscomp$inline_1605; + var isSupported$jscomp$inline_1616 = "oninput" in document; + if (!isSupported$jscomp$inline_1616) { + var element$jscomp$inline_1617 = document.createElement("div"); + element$jscomp$inline_1617.setAttribute("oninput", "return;"); + isSupported$jscomp$inline_1616 = + "function" === typeof element$jscomp$inline_1617.oninput; + } + JSCompiler_inline_result$jscomp$319 = isSupported$jscomp$inline_1616; } else JSCompiler_inline_result$jscomp$319 = !1; isInputEventSupported = JSCompiler_inline_result$jscomp$319 && @@ -14245,20 +14253,20 @@ function registerSimpleEvent(domEventName, reactName) { registerTwoPhaseEvent(reactName, [domEventName]); } for ( - var i$jscomp$inline_1646 = 0; - i$jscomp$inline_1646 < simpleEventPluginEvents.length; - i$jscomp$inline_1646++ + var i$jscomp$inline_1657 = 0; + i$jscomp$inline_1657 < simpleEventPluginEvents.length; + i$jscomp$inline_1657++ ) { - var eventName$jscomp$inline_1647 = - simpleEventPluginEvents[i$jscomp$inline_1646], - domEventName$jscomp$inline_1648 = - eventName$jscomp$inline_1647.toLowerCase(), - capitalizedEvent$jscomp$inline_1649 = - eventName$jscomp$inline_1647[0].toUpperCase() + - eventName$jscomp$inline_1647.slice(1); + var eventName$jscomp$inline_1658 = + simpleEventPluginEvents[i$jscomp$inline_1657], + domEventName$jscomp$inline_1659 = + eventName$jscomp$inline_1658.toLowerCase(), + capitalizedEvent$jscomp$inline_1660 = + eventName$jscomp$inline_1658[0].toUpperCase() + + eventName$jscomp$inline_1658.slice(1); registerSimpleEvent( - domEventName$jscomp$inline_1648, - "on" + capitalizedEvent$jscomp$inline_1649 + domEventName$jscomp$inline_1659, + "on" + capitalizedEvent$jscomp$inline_1660 ); } registerSimpleEvent(ANIMATION_END, "onAnimationEnd"); @@ -16097,10 +16105,10 @@ Internals.Events = [ restoreStateIfNeeded, batchedUpdates$1 ]; -var devToolsConfig$jscomp$inline_1825 = { +var devToolsConfig$jscomp$inline_1836 = { findFiberByHostInstance: getClosestInstanceFromNode, bundleType: 0, - version: "18.3.0-www-modern-3344da1d", + version: "18.3.0-www-modern-8dc837cd", rendererPackageName: "react-dom" }; (function (internals) { @@ -16118,10 +16126,10 @@ var devToolsConfig$jscomp$inline_1825 = { } catch (err) {} return hook.checkDCE ? !0 : !1; })({ - bundleType: devToolsConfig$jscomp$inline_1825.bundleType, - version: devToolsConfig$jscomp$inline_1825.version, - rendererPackageName: devToolsConfig$jscomp$inline_1825.rendererPackageName, - rendererConfig: devToolsConfig$jscomp$inline_1825.rendererConfig, + bundleType: devToolsConfig$jscomp$inline_1836.bundleType, + version: devToolsConfig$jscomp$inline_1836.version, + rendererPackageName: devToolsConfig$jscomp$inline_1836.rendererPackageName, + rendererConfig: devToolsConfig$jscomp$inline_1836.rendererConfig, overrideHookState: null, overrideHookStateDeletePath: null, overrideHookStateRenamePath: null, @@ -16138,14 +16146,14 @@ var devToolsConfig$jscomp$inline_1825 = { return null === fiber ? null : fiber.stateNode; }, findFiberByHostInstance: - devToolsConfig$jscomp$inline_1825.findFiberByHostInstance || + devToolsConfig$jscomp$inline_1836.findFiberByHostInstance || emptyFindFiberByHostInstance, findHostInstancesForRefresh: null, scheduleRefresh: null, scheduleRoot: null, setRefreshHandler: null, getCurrentFiber: null, - reconcilerVersion: "18.3.0-www-modern-3344da1d" + reconcilerVersion: "18.3.0-www-modern-8dc837cd" }); exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = Internals; exports.createPortal = function (children, container) { @@ -16301,7 +16309,7 @@ exports.unstable_createEventHandle = function (type, options) { return eventHandle; }; exports.unstable_runWithPriority = runWithPriority; -exports.version = "18.3.0-www-modern-3344da1d"; +exports.version = "18.3.0-www-modern-8dc837cd"; /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */ if ( diff --git a/compiled/facebook-www/ReactDOMTesting-dev.classic.js b/compiled/facebook-www/ReactDOMTesting-dev.classic.js index f01b823dbd9ce..1fed275a7bfdd 100644 --- a/compiled/facebook-www/ReactDOMTesting-dev.classic.js +++ b/compiled/facebook-www/ReactDOMTesting-dev.classic.js @@ -14466,7 +14466,14 @@ function getShellBoundary() { function pushPrimaryTreeSuspenseHandler(handler) { // TODO: Pass as argument var current = handler.alternate; - var props = handler.pendingProps; // Experimental feature: Some Suspense boundaries are marked as having an + var props = handler.pendingProps; // Shallow Suspense context fields, like ForceSuspenseFallback, should only be + // propagated a single level. For example, when ForceSuspenseFallback is set, + // it should only force the nearest Suspense boundary into fallback mode. + + pushSuspenseListContext( + handler, + setDefaultShallowSuspenseListContext(suspenseStackCursor.current) + ); // Experimental feature: Some Suspense boundaries are marked as having an // undesirable fallback state. These have special behavior where we only // activate the fallback if there's no other boundary on the stack that we can // use instead. @@ -14518,6 +14525,11 @@ function pushFallbackTreeSuspenseHandler(fiber) { } function pushOffscreenSuspenseHandler(fiber) { if (fiber.tag === OffscreenComponent) { + // A SuspenseList context is only pushed here to avoid a push/pop mismatch. + // Reuse the current value on the stack. + // TODO: We can avoid needing to push here by by forking popSuspenseHandler + // into separate functions for Suspense and Offscreen. + pushSuspenseListContext(fiber, suspenseStackCursor.current); push(suspenseHandlerStackCursor, fiber, fiber); if (shellBoundary !== null); @@ -14540,6 +14552,7 @@ function pushOffscreenSuspenseHandler(fiber) { } } function reuseSuspenseHandlerOnStack(fiber) { + pushSuspenseListContext(fiber, suspenseStackCursor.current); push(suspenseHandlerStackCursor, getSuspenseHandler(), fiber); } function getSuspenseHandler() { @@ -14552,6 +14565,8 @@ function popSuspenseHandler(fiber) { // Popping back into the shell. shellBoundary = null; } + + popSuspenseListContext(fiber); } // SuspenseList context // TODO: Move to a separate module? We may change the SuspenseList // implementation to hide/show in the commit phase, anyway. @@ -22143,6 +22158,8 @@ function shouldRemainOnFallback(current, workInProgress, renderLanes) { // If we're already showing a fallback, there are cases where we need to // remain on that fallback regardless of whether the content has resolved. // For example, SuspenseList coordinates when nested content appears. + // TODO: For compatibility with offscreen prerendering, this should also check + // whether the current fiber (if it exists) was visible in the previous tree. if (current !== null) { var suspenseState = current.memoizedState; @@ -36848,7 +36865,7 @@ function createFiberRoot( return root; } -var ReactVersion = "18.3.0-www-classic-85dd84cf"; +var ReactVersion = "18.3.0-www-classic-ac60b8a6"; function createPortal$1( children, diff --git a/compiled/facebook-www/ReactDOMTesting-dev.modern.js b/compiled/facebook-www/ReactDOMTesting-dev.modern.js index e7b02971e2586..097bb63134764 100644 --- a/compiled/facebook-www/ReactDOMTesting-dev.modern.js +++ b/compiled/facebook-www/ReactDOMTesting-dev.modern.js @@ -11838,7 +11838,14 @@ function getShellBoundary() { function pushPrimaryTreeSuspenseHandler(handler) { // TODO: Pass as argument var current = handler.alternate; - var props = handler.pendingProps; // Experimental feature: Some Suspense boundaries are marked as having an + var props = handler.pendingProps; // Shallow Suspense context fields, like ForceSuspenseFallback, should only be + // propagated a single level. For example, when ForceSuspenseFallback is set, + // it should only force the nearest Suspense boundary into fallback mode. + + pushSuspenseListContext( + handler, + setDefaultShallowSuspenseListContext(suspenseStackCursor.current) + ); // Experimental feature: Some Suspense boundaries are marked as having an // undesirable fallback state. These have special behavior where we only // activate the fallback if there's no other boundary on the stack that we can // use instead. @@ -11890,6 +11897,11 @@ function pushFallbackTreeSuspenseHandler(fiber) { } function pushOffscreenSuspenseHandler(fiber) { if (fiber.tag === OffscreenComponent) { + // A SuspenseList context is only pushed here to avoid a push/pop mismatch. + // Reuse the current value on the stack. + // TODO: We can avoid needing to push here by by forking popSuspenseHandler + // into separate functions for Suspense and Offscreen. + pushSuspenseListContext(fiber, suspenseStackCursor.current); push(suspenseHandlerStackCursor, fiber, fiber); if (shellBoundary !== null); @@ -11912,6 +11924,7 @@ function pushOffscreenSuspenseHandler(fiber) { } } function reuseSuspenseHandlerOnStack(fiber) { + pushSuspenseListContext(fiber, suspenseStackCursor.current); push(suspenseHandlerStackCursor, getSuspenseHandler(), fiber); } function getSuspenseHandler() { @@ -11924,6 +11937,8 @@ function popSuspenseHandler(fiber) { // Popping back into the shell. shellBoundary = null; } + + popSuspenseListContext(fiber); } // SuspenseList context // TODO: Move to a separate module? We may change the SuspenseList // implementation to hide/show in the commit phase, anyway. @@ -19454,6 +19469,8 @@ function shouldRemainOnFallback(current, workInProgress, renderLanes) { // If we're already showing a fallback, there are cases where we need to // remain on that fallback regardless of whether the content has resolved. // For example, SuspenseList coordinates when nested content appears. + // TODO: For compatibility with offscreen prerendering, this should also check + // whether the current fiber (if it exists) was visible in the previous tree. if (current !== null) { var suspenseState = current.memoizedState; @@ -34124,7 +34141,7 @@ function createFiberRoot( return root; } -var ReactVersion = "18.3.0-www-modern-ecd5ecdb"; +var ReactVersion = "18.3.0-www-modern-c338eadf"; function createPortal$1( children, diff --git a/compiled/facebook-www/ReactDOMTesting-prod.classic.js b/compiled/facebook-www/ReactDOMTesting-prod.classic.js index e8dfe63828241..b01f5854d135d 100644 --- a/compiled/facebook-www/ReactDOMTesting-prod.classic.js +++ b/compiled/facebook-www/ReactDOMTesting-prod.classic.js @@ -3698,8 +3698,10 @@ function popHiddenContext() { var suspenseHandlerStackCursor = createCursor(null), shellBoundary = null; function pushPrimaryTreeSuspenseHandler(handler) { - var current = handler.alternate; - !0 !== handler.pendingProps.unstable_avoidThisFallback || + var current = handler.alternate, + props = handler.pendingProps; + push(suspenseStackCursor, suspenseStackCursor.current & 1); + !0 !== props.unstable_avoidThisFallback || (null !== current && null === currentTreeHiddenStackCursor.current) ? (push(suspenseHandlerStackCursor, handler), null === shellBoundary && @@ -3712,20 +3714,26 @@ function pushPrimaryTreeSuspenseHandler(handler) { } function pushOffscreenSuspenseHandler(fiber) { if (22 === fiber.tag) { - if ((push(suspenseHandlerStackCursor, fiber), null === shellBoundary)) { + if ( + (push(suspenseStackCursor, suspenseStackCursor.current), + push(suspenseHandlerStackCursor, fiber), + null === shellBoundary) + ) { var current = fiber.alternate; null !== current && null !== current.memoizedState && (shellBoundary = fiber); } - } else reuseSuspenseHandlerOnStack(); + } else reuseSuspenseHandlerOnStack(fiber); } function reuseSuspenseHandlerOnStack() { + push(suspenseStackCursor, suspenseStackCursor.current); push(suspenseHandlerStackCursor, suspenseHandlerStackCursor.current); } function popSuspenseHandler(fiber) { pop(suspenseHandlerStackCursor); shellBoundary === fiber && (shellBoundary = null); + pop(suspenseStackCursor); } var suspenseStackCursor = createCursor(0); function findFirstSuspended(row) { @@ -5376,12 +5384,12 @@ function updateOffscreenComponent(current, workInProgress, renderLanes) { } pushTransition(workInProgress, nextProps, nextIsDetached); pushHiddenContext(workInProgress, prevState); - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); workInProgress.memoizedState = null; } else null !== current && pushTransition(workInProgress, null, null), reuseHiddenContextOnStack(), - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); reconcileChildren(current, workInProgress, nextChildren, renderLanes); return workInProgress.child; } @@ -5767,7 +5775,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { if (isHydrating) { showFallback ? pushPrimaryTreeSuspenseHandler(workInProgress) - : reuseSuspenseHandlerOnStack(); + : reuseSuspenseHandlerOnStack(workInProgress); isHydrating && (((current = nextHydratableInstance), rootOrSingletonContext && advanceToFirstAttemptableSuspenseInstance(), @@ -5817,7 +5825,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { didSuspend = nextProps.fallback; if (showFallback) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (current = mountSuspenseFallbackChildren( workInProgress, current, @@ -5848,7 +5856,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { ); if ("number" === typeof nextProps.unstable_expectedLoadTime) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (current = mountSuspenseFallbackChildren( workInProgress, current, @@ -5879,7 +5887,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { ); } if (showFallback) { - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); showFallback = nextProps.fallback; didSuspend = workInProgress.mode; JSCompiler_temp = current.child; @@ -6051,12 +6059,12 @@ function updateDehydratedSuspenseComponent( ); if (null !== workInProgress.memoizedState) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (workInProgress.child = current.child), (workInProgress.flags |= 128), null ); - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); suspenseState = nextProps.fallback; suspenseInstance = workInProgress.mode; nextProps = createFiberFromOffscreen( @@ -13089,17 +13097,17 @@ Internals.Events = [ restoreStateIfNeeded, batchedUpdates$1 ]; -var devToolsConfig$jscomp$inline_1638 = { +var devToolsConfig$jscomp$inline_1649 = { findFiberByHostInstance: getClosestInstanceFromNode, bundleType: 0, - version: "18.3.0-www-classic-ac5037f5", + version: "18.3.0-www-classic-7d98bb40", rendererPackageName: "react-dom" }; -var internals$jscomp$inline_2196 = { - bundleType: devToolsConfig$jscomp$inline_1638.bundleType, - version: devToolsConfig$jscomp$inline_1638.version, - rendererPackageName: devToolsConfig$jscomp$inline_1638.rendererPackageName, - rendererConfig: devToolsConfig$jscomp$inline_1638.rendererConfig, +var internals$jscomp$inline_2207 = { + bundleType: devToolsConfig$jscomp$inline_1649.bundleType, + version: devToolsConfig$jscomp$inline_1649.version, + rendererPackageName: devToolsConfig$jscomp$inline_1649.rendererPackageName, + rendererConfig: devToolsConfig$jscomp$inline_1649.rendererConfig, overrideHookState: null, overrideHookStateDeletePath: null, overrideHookStateRenamePath: null, @@ -13115,26 +13123,26 @@ var internals$jscomp$inline_2196 = { return null === fiber ? null : fiber.stateNode; }, findFiberByHostInstance: - devToolsConfig$jscomp$inline_1638.findFiberByHostInstance || + devToolsConfig$jscomp$inline_1649.findFiberByHostInstance || emptyFindFiberByHostInstance, findHostInstancesForRefresh: null, scheduleRefresh: null, scheduleRoot: null, setRefreshHandler: null, getCurrentFiber: null, - reconcilerVersion: "18.3.0-www-classic-ac5037f5" + reconcilerVersion: "18.3.0-www-classic-7d98bb40" }; if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) { - var hook$jscomp$inline_2197 = __REACT_DEVTOOLS_GLOBAL_HOOK__; + var hook$jscomp$inline_2208 = __REACT_DEVTOOLS_GLOBAL_HOOK__; if ( - !hook$jscomp$inline_2197.isDisabled && - hook$jscomp$inline_2197.supportsFiber + !hook$jscomp$inline_2208.isDisabled && + hook$jscomp$inline_2208.supportsFiber ) try { - (rendererID = hook$jscomp$inline_2197.inject( - internals$jscomp$inline_2196 + (rendererID = hook$jscomp$inline_2208.inject( + internals$jscomp$inline_2207 )), - (injectedHook = hook$jscomp$inline_2197); + (injectedHook = hook$jscomp$inline_2208); } catch (err) {} } var Dispatcher = Internals.Dispatcher, @@ -14516,14 +14524,14 @@ var isInputEventSupported = !1; if (canUseDOM) { var JSCompiler_inline_result$jscomp$324; if (canUseDOM) { - var isSupported$jscomp$inline_1715 = "oninput" in document; - if (!isSupported$jscomp$inline_1715) { - var element$jscomp$inline_1716 = document.createElement("div"); - element$jscomp$inline_1716.setAttribute("oninput", "return;"); - isSupported$jscomp$inline_1715 = - "function" === typeof element$jscomp$inline_1716.oninput; + var isSupported$jscomp$inline_1726 = "oninput" in document; + if (!isSupported$jscomp$inline_1726) { + var element$jscomp$inline_1727 = document.createElement("div"); + element$jscomp$inline_1727.setAttribute("oninput", "return;"); + isSupported$jscomp$inline_1726 = + "function" === typeof element$jscomp$inline_1727.oninput; } - JSCompiler_inline_result$jscomp$324 = isSupported$jscomp$inline_1715; + JSCompiler_inline_result$jscomp$324 = isSupported$jscomp$inline_1726; } else JSCompiler_inline_result$jscomp$324 = !1; isInputEventSupported = JSCompiler_inline_result$jscomp$324 && @@ -14664,20 +14672,20 @@ function registerSimpleEvent(domEventName, reactName) { registerTwoPhaseEvent(reactName, [domEventName]); } for ( - var i$jscomp$inline_1728 = 0; - i$jscomp$inline_1728 < simpleEventPluginEvents.length; - i$jscomp$inline_1728++ + var i$jscomp$inline_1739 = 0; + i$jscomp$inline_1739 < simpleEventPluginEvents.length; + i$jscomp$inline_1739++ ) { - var eventName$jscomp$inline_1729 = - simpleEventPluginEvents[i$jscomp$inline_1728], - domEventName$jscomp$inline_1730 = - eventName$jscomp$inline_1729.toLowerCase(), - capitalizedEvent$jscomp$inline_1731 = - eventName$jscomp$inline_1729[0].toUpperCase() + - eventName$jscomp$inline_1729.slice(1); + var eventName$jscomp$inline_1740 = + simpleEventPluginEvents[i$jscomp$inline_1739], + domEventName$jscomp$inline_1741 = + eventName$jscomp$inline_1740.toLowerCase(), + capitalizedEvent$jscomp$inline_1742 = + eventName$jscomp$inline_1740[0].toUpperCase() + + eventName$jscomp$inline_1740.slice(1); registerSimpleEvent( - domEventName$jscomp$inline_1730, - "on" + capitalizedEvent$jscomp$inline_1731 + domEventName$jscomp$inline_1741, + "on" + capitalizedEvent$jscomp$inline_1742 ); } registerSimpleEvent(ANIMATION_END, "onAnimationEnd"); @@ -16554,4 +16562,4 @@ exports.unstable_renderSubtreeIntoContainer = function ( ); }; exports.unstable_runWithPriority = runWithPriority; -exports.version = "18.3.0-www-classic-ac5037f5"; +exports.version = "18.3.0-www-classic-7d98bb40"; diff --git a/compiled/facebook-www/ReactDOMTesting-prod.modern.js b/compiled/facebook-www/ReactDOMTesting-prod.modern.js index 7e82f0dcab00e..330d595437d11 100644 --- a/compiled/facebook-www/ReactDOMTesting-prod.modern.js +++ b/compiled/facebook-www/ReactDOMTesting-prod.modern.js @@ -3282,8 +3282,10 @@ function popHiddenContext() { var suspenseHandlerStackCursor = createCursor(null), shellBoundary = null; function pushPrimaryTreeSuspenseHandler(handler) { - var current = handler.alternate; - !0 !== handler.pendingProps.unstable_avoidThisFallback || + var current = handler.alternate, + props = handler.pendingProps; + push(suspenseStackCursor, suspenseStackCursor.current & 1); + !0 !== props.unstable_avoidThisFallback || (null !== current && null === currentTreeHiddenStackCursor.current) ? (push(suspenseHandlerStackCursor, handler), null === shellBoundary && @@ -3296,20 +3298,26 @@ function pushPrimaryTreeSuspenseHandler(handler) { } function pushOffscreenSuspenseHandler(fiber) { if (22 === fiber.tag) { - if ((push(suspenseHandlerStackCursor, fiber), null === shellBoundary)) { + if ( + (push(suspenseStackCursor, suspenseStackCursor.current), + push(suspenseHandlerStackCursor, fiber), + null === shellBoundary) + ) { var current = fiber.alternate; null !== current && null !== current.memoizedState && (shellBoundary = fiber); } - } else reuseSuspenseHandlerOnStack(); + } else reuseSuspenseHandlerOnStack(fiber); } function reuseSuspenseHandlerOnStack() { + push(suspenseStackCursor, suspenseStackCursor.current); push(suspenseHandlerStackCursor, suspenseHandlerStackCursor.current); } function popSuspenseHandler(fiber) { pop(suspenseHandlerStackCursor); shellBoundary === fiber && (shellBoundary = null); + pop(suspenseStackCursor); } var suspenseStackCursor = createCursor(0); function findFirstSuspended(row) { @@ -4945,12 +4953,12 @@ function updateOffscreenComponent(current, workInProgress, renderLanes) { } pushTransition(workInProgress, nextProps, nextIsDetached); pushHiddenContext(workInProgress, prevState); - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); workInProgress.memoizedState = null; } else null !== current && pushTransition(workInProgress, null, null), reuseHiddenContextOnStack(), - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); reconcileChildren(current, workInProgress, nextChildren, renderLanes); return workInProgress.child; } @@ -5300,7 +5308,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { if (isHydrating) { showFallback ? pushPrimaryTreeSuspenseHandler(workInProgress) - : reuseSuspenseHandlerOnStack(); + : reuseSuspenseHandlerOnStack(workInProgress); isHydrating && (((current = nextHydratableInstance), rootOrSingletonContext && advanceToFirstAttemptableSuspenseInstance(), @@ -5350,7 +5358,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { didSuspend = nextProps.fallback; if (showFallback) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (current = mountSuspenseFallbackChildren( workInProgress, current, @@ -5381,7 +5389,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { ); if ("number" === typeof nextProps.unstable_expectedLoadTime) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (current = mountSuspenseFallbackChildren( workInProgress, current, @@ -5412,7 +5420,7 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { ); } if (showFallback) { - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); showFallback = nextProps.fallback; didSuspend = workInProgress.mode; JSCompiler_temp = current.child; @@ -5584,12 +5592,12 @@ function updateDehydratedSuspenseComponent( ); if (null !== workInProgress.memoizedState) return ( - reuseSuspenseHandlerOnStack(), + reuseSuspenseHandlerOnStack(workInProgress), (workInProgress.child = current.child), (workInProgress.flags |= 128), null ); - reuseSuspenseHandlerOnStack(); + reuseSuspenseHandlerOnStack(workInProgress); suspenseState = nextProps.fallback; suspenseInstance = workInProgress.mode; nextProps = createFiberFromOffscreen( @@ -13484,14 +13492,14 @@ var isInputEventSupported = !1; if (canUseDOM) { var JSCompiler_inline_result$jscomp$300; if (canUseDOM) { - var isSupported$jscomp$inline_1554 = "oninput" in document; - if (!isSupported$jscomp$inline_1554) { - var element$jscomp$inline_1555 = document.createElement("div"); - element$jscomp$inline_1555.setAttribute("oninput", "return;"); - isSupported$jscomp$inline_1554 = - "function" === typeof element$jscomp$inline_1555.oninput; + var isSupported$jscomp$inline_1565 = "oninput" in document; + if (!isSupported$jscomp$inline_1565) { + var element$jscomp$inline_1566 = document.createElement("div"); + element$jscomp$inline_1566.setAttribute("oninput", "return;"); + isSupported$jscomp$inline_1565 = + "function" === typeof element$jscomp$inline_1566.oninput; } - JSCompiler_inline_result$jscomp$300 = isSupported$jscomp$inline_1554; + JSCompiler_inline_result$jscomp$300 = isSupported$jscomp$inline_1565; } else JSCompiler_inline_result$jscomp$300 = !1; isInputEventSupported = JSCompiler_inline_result$jscomp$300 && @@ -13803,20 +13811,20 @@ function registerSimpleEvent(domEventName, reactName) { registerTwoPhaseEvent(reactName, [domEventName]); } for ( - var i$jscomp$inline_1595 = 0; - i$jscomp$inline_1595 < simpleEventPluginEvents.length; - i$jscomp$inline_1595++ + var i$jscomp$inline_1606 = 0; + i$jscomp$inline_1606 < simpleEventPluginEvents.length; + i$jscomp$inline_1606++ ) { - var eventName$jscomp$inline_1596 = - simpleEventPluginEvents[i$jscomp$inline_1595], - domEventName$jscomp$inline_1597 = - eventName$jscomp$inline_1596.toLowerCase(), - capitalizedEvent$jscomp$inline_1598 = - eventName$jscomp$inline_1596[0].toUpperCase() + - eventName$jscomp$inline_1596.slice(1); + var eventName$jscomp$inline_1607 = + simpleEventPluginEvents[i$jscomp$inline_1606], + domEventName$jscomp$inline_1608 = + eventName$jscomp$inline_1607.toLowerCase(), + capitalizedEvent$jscomp$inline_1609 = + eventName$jscomp$inline_1607[0].toUpperCase() + + eventName$jscomp$inline_1607.slice(1); registerSimpleEvent( - domEventName$jscomp$inline_1597, - "on" + capitalizedEvent$jscomp$inline_1598 + domEventName$jscomp$inline_1608, + "on" + capitalizedEvent$jscomp$inline_1609 ); } registerSimpleEvent(ANIMATION_END, "onAnimationEnd"); @@ -15712,17 +15720,17 @@ Internals.Events = [ restoreStateIfNeeded, batchedUpdates$1 ]; -var devToolsConfig$jscomp$inline_1774 = { +var devToolsConfig$jscomp$inline_1785 = { findFiberByHostInstance: getClosestInstanceFromNode, bundleType: 0, - version: "18.3.0-www-modern-b3a4de20", + version: "18.3.0-www-modern-e3dcc95d", rendererPackageName: "react-dom" }; -var internals$jscomp$inline_2177 = { - bundleType: devToolsConfig$jscomp$inline_1774.bundleType, - version: devToolsConfig$jscomp$inline_1774.version, - rendererPackageName: devToolsConfig$jscomp$inline_1774.rendererPackageName, - rendererConfig: devToolsConfig$jscomp$inline_1774.rendererConfig, +var internals$jscomp$inline_2188 = { + bundleType: devToolsConfig$jscomp$inline_1785.bundleType, + version: devToolsConfig$jscomp$inline_1785.version, + rendererPackageName: devToolsConfig$jscomp$inline_1785.rendererPackageName, + rendererConfig: devToolsConfig$jscomp$inline_1785.rendererConfig, overrideHookState: null, overrideHookStateDeletePath: null, overrideHookStateRenamePath: null, @@ -15739,26 +15747,26 @@ var internals$jscomp$inline_2177 = { return null === fiber ? null : fiber.stateNode; }, findFiberByHostInstance: - devToolsConfig$jscomp$inline_1774.findFiberByHostInstance || + devToolsConfig$jscomp$inline_1785.findFiberByHostInstance || emptyFindFiberByHostInstance, findHostInstancesForRefresh: null, scheduleRefresh: null, scheduleRoot: null, setRefreshHandler: null, getCurrentFiber: null, - reconcilerVersion: "18.3.0-www-modern-b3a4de20" + reconcilerVersion: "18.3.0-www-modern-e3dcc95d" }; if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) { - var hook$jscomp$inline_2178 = __REACT_DEVTOOLS_GLOBAL_HOOK__; + var hook$jscomp$inline_2189 = __REACT_DEVTOOLS_GLOBAL_HOOK__; if ( - !hook$jscomp$inline_2178.isDisabled && - hook$jscomp$inline_2178.supportsFiber + !hook$jscomp$inline_2189.isDisabled && + hook$jscomp$inline_2189.supportsFiber ) try { - (rendererID = hook$jscomp$inline_2178.inject( - internals$jscomp$inline_2177 + (rendererID = hook$jscomp$inline_2189.inject( + internals$jscomp$inline_2188 )), - (injectedHook = hook$jscomp$inline_2178); + (injectedHook = hook$jscomp$inline_2189); } catch (err) {} } exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = Internals; @@ -16066,4 +16074,4 @@ exports.unstable_createEventHandle = function (type, options) { return eventHandle; }; exports.unstable_runWithPriority = runWithPriority; -exports.version = "18.3.0-www-modern-b3a4de20"; +exports.version = "18.3.0-www-modern-e3dcc95d"; diff --git a/compiled/facebook-www/ReactTestRenderer-dev.classic.js b/compiled/facebook-www/ReactTestRenderer-dev.classic.js index 94177ba73766e..4060244064d2e 100644 --- a/compiled/facebook-www/ReactTestRenderer-dev.classic.js +++ b/compiled/facebook-www/ReactTestRenderer-dev.classic.js @@ -6133,7 +6133,14 @@ function getShellBoundary() { function pushPrimaryTreeSuspenseHandler(handler) { // TODO: Pass as argument var current = handler.alternate; - var props = handler.pendingProps; // Experimental feature: Some Suspense boundaries are marked as having an + var props = handler.pendingProps; // Shallow Suspense context fields, like ForceSuspenseFallback, should only be + // propagated a single level. For example, when ForceSuspenseFallback is set, + // it should only force the nearest Suspense boundary into fallback mode. + + pushSuspenseListContext( + handler, + setDefaultShallowSuspenseListContext(suspenseStackCursor.current) + ); // Experimental feature: Some Suspense boundaries are marked as having an // undesirable fallback state. These have special behavior where we only // activate the fallback if there's no other boundary on the stack that we can // use instead. @@ -6185,6 +6192,11 @@ function pushFallbackTreeSuspenseHandler(fiber) { } function pushOffscreenSuspenseHandler(fiber) { if (fiber.tag === OffscreenComponent) { + // A SuspenseList context is only pushed here to avoid a push/pop mismatch. + // Reuse the current value on the stack. + // TODO: We can avoid needing to push here by by forking popSuspenseHandler + // into separate functions for Suspense and Offscreen. + pushSuspenseListContext(fiber, suspenseStackCursor.current); push(suspenseHandlerStackCursor, fiber, fiber); if (shellBoundary !== null); @@ -6207,6 +6219,7 @@ function pushOffscreenSuspenseHandler(fiber) { } } function reuseSuspenseHandlerOnStack(fiber) { + pushSuspenseListContext(fiber, suspenseStackCursor.current); push(suspenseHandlerStackCursor, getSuspenseHandler(), fiber); } function getSuspenseHandler() { @@ -6219,6 +6232,8 @@ function popSuspenseHandler(fiber) { // Popping back into the shell. shellBoundary = null; } + + popSuspenseListContext(fiber); } // SuspenseList context // TODO: Move to a separate module? We may change the SuspenseList // implementation to hide/show in the commit phase, anyway. @@ -12676,6 +12691,8 @@ function shouldRemainOnFallback(current, workInProgress, renderLanes) { // If we're already showing a fallback, there are cases where we need to // remain on that fallback regardless of whether the content has resolved. // For example, SuspenseList coordinates when nested content appears. + // TODO: For compatibility with offscreen prerendering, this should also check + // whether the current fiber (if it exists) was visible in the previous tree. if (current !== null) { var suspenseState = current.memoizedState; @@ -24242,7 +24259,7 @@ function createFiberRoot( return root; } -var ReactVersion = "18.3.0-www-classic-0c193767"; +var ReactVersion = "18.3.0-www-classic-769176f5"; // Might add PROFILE later. diff --git a/compiled/facebook-www/ReactTestRenderer-dev.modern.js b/compiled/facebook-www/ReactTestRenderer-dev.modern.js index c397b40c268d6..904863b3b8a1a 100644 --- a/compiled/facebook-www/ReactTestRenderer-dev.modern.js +++ b/compiled/facebook-www/ReactTestRenderer-dev.modern.js @@ -6133,7 +6133,14 @@ function getShellBoundary() { function pushPrimaryTreeSuspenseHandler(handler) { // TODO: Pass as argument var current = handler.alternate; - var props = handler.pendingProps; // Experimental feature: Some Suspense boundaries are marked as having an + var props = handler.pendingProps; // Shallow Suspense context fields, like ForceSuspenseFallback, should only be + // propagated a single level. For example, when ForceSuspenseFallback is set, + // it should only force the nearest Suspense boundary into fallback mode. + + pushSuspenseListContext( + handler, + setDefaultShallowSuspenseListContext(suspenseStackCursor.current) + ); // Experimental feature: Some Suspense boundaries are marked as having an // undesirable fallback state. These have special behavior where we only // activate the fallback if there's no other boundary on the stack that we can // use instead. @@ -6185,6 +6192,11 @@ function pushFallbackTreeSuspenseHandler(fiber) { } function pushOffscreenSuspenseHandler(fiber) { if (fiber.tag === OffscreenComponent) { + // A SuspenseList context is only pushed here to avoid a push/pop mismatch. + // Reuse the current value on the stack. + // TODO: We can avoid needing to push here by by forking popSuspenseHandler + // into separate functions for Suspense and Offscreen. + pushSuspenseListContext(fiber, suspenseStackCursor.current); push(suspenseHandlerStackCursor, fiber, fiber); if (shellBoundary !== null); @@ -6207,6 +6219,7 @@ function pushOffscreenSuspenseHandler(fiber) { } } function reuseSuspenseHandlerOnStack(fiber) { + pushSuspenseListContext(fiber, suspenseStackCursor.current); push(suspenseHandlerStackCursor, getSuspenseHandler(), fiber); } function getSuspenseHandler() { @@ -6219,6 +6232,8 @@ function popSuspenseHandler(fiber) { // Popping back into the shell. shellBoundary = null; } + + popSuspenseListContext(fiber); } // SuspenseList context // TODO: Move to a separate module? We may change the SuspenseList // implementation to hide/show in the commit phase, anyway. @@ -12676,6 +12691,8 @@ function shouldRemainOnFallback(current, workInProgress, renderLanes) { // If we're already showing a fallback, there are cases where we need to // remain on that fallback regardless of whether the content has resolved. // For example, SuspenseList coordinates when nested content appears. + // TODO: For compatibility with offscreen prerendering, this should also check + // whether the current fiber (if it exists) was visible in the previous tree. if (current !== null) { var suspenseState = current.memoizedState; @@ -24242,7 +24259,7 @@ function createFiberRoot( return root; } -var ReactVersion = "18.3.0-www-modern-b3a4de20"; +var ReactVersion = "18.3.0-www-modern-e3dcc95d"; // Might add PROFILE later.