Skip to content

Commit 4159cc9

Browse files
sebmarkbagesebmarkbage
committed
Move Hydration Warnings from the DOM Config into the Fiber reconciliation (#28476)
Stacked on #28458. This doesn't actually really change the messages yet, it's just a refactor. Hydration warnings can be presented either as HTML or React JSX format. If presented as HTML it makes more sense to make that a DOM specific concept, however, I think it's actually better to present it in terms of React JSX. Most of the time the errors aren't going to be something messing with them at the HTML/HTTP layer. It's because the JS code does something different. Most of the time you're working in just React. People don't necessarily even know what the HTML form of it looks like. So this takes the approach that the warnings are presented in React JSX in their rich object form. Therefore, I'm moving the approach to yield diff data to the reconciler but it's the reconciler that's actually printing all the warnings. DiffTrain build for commit 4b8dfd6.
1 parent ab96eb3 commit 4159cc9

File tree

10 files changed

+178
-277
lines changed

10 files changed

+178
-277
lines changed

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react-test-renderer/cjs/ReactTestRenderer-dev.js‎

Lines changed: 5 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<c87024931f160e9769cdcf58bdec1a68>>
10+
* @generated SignedSource<<76f5e861be11fcf494a0e765f9e7dd59>>
1111
*/
1212

1313
"use strict";
@@ -2019,13 +2019,14 @@ if (__DEV__) {
20192019
"Please file an issue."
20202020
);
20212021
} // Hydration (when unsupported)
2022+
2023+
var supportsHydration = false;
20222024
var isSuspenseInstancePending = shim$1;
20232025
var isSuspenseInstanceFallback = shim$1;
20242026
var getSuspenseInstanceFallbackErrorDetails = shim$1;
20252027
var registerSuspenseInstanceRetry = shim$1;
20262028
var clearSuspenseBoundary = shim$1;
20272029
var clearSuspenseBoundaryFromContainer = shim$1;
2028-
var errorHydratingContainer = shim$1;
20292030

20302031
// Renderers that don't support hydration
20312032
// can re-export everything from this module.
@@ -2547,14 +2548,6 @@ if (__DEV__) {
25472548

25482549
var objectIs = typeof Object.is === "function" ? Object.is : is; // $FlowFixMe[method-unbinding]
25492550

2550-
// This is imported by the event replaying implementation in React DOM. It's
2551-
// in a separate file to break a circular dependency between the renderer and
2552-
// the reconciler.
2553-
function isRootDehydrated(root) {
2554-
var currentState = root.current.memoizedState;
2555-
return currentState.isDehydrated;
2556-
}
2557-
25582551
var contextStackCursor = createCursor(null);
25592552
var contextFiberStackCursor = createCursor(null);
25602553
var rootInstanceStackCursor = createCursor(null); // Represents the nearest host transition provider (in React DOM, a <form />)
@@ -21790,27 +21783,7 @@ if (__DEV__) {
2179021783
// back to client side render.
2179121784
// Before rendering again, save the errors from the previous attempt.
2179221785
var errorsFromFirstAttempt = workInProgressRootConcurrentErrors;
21793-
var wasRootDehydrated = isRootDehydrated(root);
21794-
21795-
if (wasRootDehydrated) {
21796-
// The shell failed to hydrate. Set a flag to force a client rendering
21797-
// during the next attempt. To do this, we call prepareFreshStack now
21798-
// to create the root work-in-progress fiber. This is a bit weird in terms
21799-
// of factoring, because it relies on renderRootSync not calling
21800-
// prepareFreshStack again in the call below, which happens because the
21801-
// root and lanes haven't changed.
21802-
//
21803-
// TODO: I think what we should do is set ForceClientRender inside
21804-
// throwException, like we do for nested Suspense boundaries. The reason
21805-
// it's here instead is so we can switch to the synchronous work loop, too.
21806-
// Something to consider for a future refactor.
21807-
var rootWorkInProgress = prepareFreshStack(root, errorRetryLanes);
21808-
rootWorkInProgress.flags |= ForceClientRender;
21809-
21810-
{
21811-
errorHydratingContainer();
21812-
}
21813-
}
21786+
var wasRootDehydrated = supportsHydration;
2181421787

2181521788
var exitStatus = renderRootSync(root, errorRetryLanes);
2181621789

@@ -25509,7 +25482,7 @@ if (__DEV__) {
2550925482
return root;
2551025483
}
2551125484

25512-
var ReactVersion = "19.0.0-canary-ab33cef8";
25485+
var ReactVersion = "19.0.0-canary-57dfa024";
2551325486

2551425487
// Might add PROFILE later.
2551525488

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react-test-renderer/cjs/ReactTestRenderer-prod.js‎

Lines changed: 18 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<9e59b85bab1889d947c7a99fc106a97b>>
10+
* @generated SignedSource<<078314ad2b64a452a5faeecab26ced6f>>
1111
*/
1212

1313
"use strict";
@@ -7624,13 +7624,10 @@ function recoverFromConcurrentError(
76247624
originallyAttemptedLanes,
76257625
errorRetryLanes
76267626
) {
7627-
var errorsFromFirstAttempt = workInProgressRootConcurrentErrors,
7628-
JSCompiler_inline_result;
7629-
(JSCompiler_inline_result = root.current.memoizedState.isDehydrated) &&
7630-
(prepareFreshStack(root, errorRetryLanes).flags |= 256);
7627+
var errorsFromFirstAttempt = workInProgressRootConcurrentErrors;
76317628
errorRetryLanes = renderRootSync(root, errorRetryLanes);
76327629
if (2 !== errorRetryLanes) {
7633-
if (workInProgressRootDidAttachPingListener && !JSCompiler_inline_result)
7630+
if (workInProgressRootDidAttachPingListener)
76347631
return (
76357632
(root.errorRecoveryDisabledLanes |= originallyAttemptedLanes),
76367633
(workInProgressRootInterleavedUpdatedLanes |= originallyAttemptedLanes),
@@ -9154,19 +9151,19 @@ function wrapFiber(fiber) {
91549151
fiberToWrapper.set(fiber, wrapper));
91559152
return wrapper;
91569153
}
9157-
var devToolsConfig$jscomp$inline_1023 = {
9154+
var devToolsConfig$jscomp$inline_1019 = {
91589155
findFiberByHostInstance: function () {
91599156
throw Error("TestRenderer does not support findFiberByHostInstance()");
91609157
},
91619158
bundleType: 0,
9162-
version: "19.0.0-canary-f55d214e",
9159+
version: "19.0.0-canary-bd6c6cc2",
91639160
rendererPackageName: "react-test-renderer"
91649161
};
9165-
var internals$jscomp$inline_1213 = {
9166-
bundleType: devToolsConfig$jscomp$inline_1023.bundleType,
9167-
version: devToolsConfig$jscomp$inline_1023.version,
9168-
rendererPackageName: devToolsConfig$jscomp$inline_1023.rendererPackageName,
9169-
rendererConfig: devToolsConfig$jscomp$inline_1023.rendererConfig,
9162+
var internals$jscomp$inline_1209 = {
9163+
bundleType: devToolsConfig$jscomp$inline_1019.bundleType,
9164+
version: devToolsConfig$jscomp$inline_1019.version,
9165+
rendererPackageName: devToolsConfig$jscomp$inline_1019.rendererPackageName,
9166+
rendererConfig: devToolsConfig$jscomp$inline_1019.rendererConfig,
91709167
overrideHookState: null,
91719168
overrideHookStateDeletePath: null,
91729169
overrideHookStateRenamePath: null,
@@ -9183,26 +9180,26 @@ var internals$jscomp$inline_1213 = {
91839180
return null === fiber ? null : fiber.stateNode;
91849181
},
91859182
findFiberByHostInstance:
9186-
devToolsConfig$jscomp$inline_1023.findFiberByHostInstance ||
9183+
devToolsConfig$jscomp$inline_1019.findFiberByHostInstance ||
91879184
emptyFindFiberByHostInstance,
91889185
findHostInstancesForRefresh: null,
91899186
scheduleRefresh: null,
91909187
scheduleRoot: null,
91919188
setRefreshHandler: null,
91929189
getCurrentFiber: null,
9193-
reconcilerVersion: "19.0.0-canary-f55d214e"
9190+
reconcilerVersion: "19.0.0-canary-bd6c6cc2"
91949191
};
91959192
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
9196-
var hook$jscomp$inline_1214 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
9193+
var hook$jscomp$inline_1210 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
91979194
if (
9198-
!hook$jscomp$inline_1214.isDisabled &&
9199-
hook$jscomp$inline_1214.supportsFiber
9195+
!hook$jscomp$inline_1210.isDisabled &&
9196+
hook$jscomp$inline_1210.supportsFiber
92009197
)
92019198
try {
9202-
(rendererID = hook$jscomp$inline_1214.inject(
9203-
internals$jscomp$inline_1213
9199+
(rendererID = hook$jscomp$inline_1210.inject(
9200+
internals$jscomp$inline_1209
92049201
)),
9205-
(injectedHook = hook$jscomp$inline_1214);
9202+
(injectedHook = hook$jscomp$inline_1210);
92069203
} catch (err) {}
92079204
}
92089205
exports._Scheduler = Scheduler;

‎compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react-test-renderer/cjs/ReactTestRenderer-profiling.js‎

Lines changed: 18 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<b2573824248edd9931bd15024b146aaa>>
10+
* @generated SignedSource<<df0e5a7bb66d4bac537671923b9def69>>
1111
*/
1212

1313
"use strict";
@@ -7968,13 +7968,10 @@ function recoverFromConcurrentError(
79687968
originallyAttemptedLanes,
79697969
errorRetryLanes
79707970
) {
7971-
var errorsFromFirstAttempt = workInProgressRootConcurrentErrors,
7972-
JSCompiler_inline_result;
7973-
(JSCompiler_inline_result = root.current.memoizedState.isDehydrated) &&
7974-
(prepareFreshStack(root, errorRetryLanes).flags |= 256);
7971+
var errorsFromFirstAttempt = workInProgressRootConcurrentErrors;
79757972
errorRetryLanes = renderRootSync(root, errorRetryLanes);
79767973
if (2 !== errorRetryLanes) {
7977-
if (workInProgressRootDidAttachPingListener && !JSCompiler_inline_result)
7974+
if (workInProgressRootDidAttachPingListener)
79787975
return (
79797976
(root.errorRecoveryDisabledLanes |= originallyAttemptedLanes),
79807977
(workInProgressRootInterleavedUpdatedLanes |= originallyAttemptedLanes),
@@ -9580,19 +9577,19 @@ function wrapFiber(fiber) {
95809577
fiberToWrapper.set(fiber, wrapper));
95819578
return wrapper;
95829579
}
9583-
var devToolsConfig$jscomp$inline_1065 = {
9580+
var devToolsConfig$jscomp$inline_1061 = {
95849581
findFiberByHostInstance: function () {
95859582
throw Error("TestRenderer does not support findFiberByHostInstance()");
95869583
},
95879584
bundleType: 0,
9588-
version: "19.0.0-canary-cdabf445",
9585+
version: "19.0.0-canary-1f27a620",
95899586
rendererPackageName: "react-test-renderer"
95909587
};
9591-
var internals$jscomp$inline_1254 = {
9592-
bundleType: devToolsConfig$jscomp$inline_1065.bundleType,
9593-
version: devToolsConfig$jscomp$inline_1065.version,
9594-
rendererPackageName: devToolsConfig$jscomp$inline_1065.rendererPackageName,
9595-
rendererConfig: devToolsConfig$jscomp$inline_1065.rendererConfig,
9588+
var internals$jscomp$inline_1250 = {
9589+
bundleType: devToolsConfig$jscomp$inline_1061.bundleType,
9590+
version: devToolsConfig$jscomp$inline_1061.version,
9591+
rendererPackageName: devToolsConfig$jscomp$inline_1061.rendererPackageName,
9592+
rendererConfig: devToolsConfig$jscomp$inline_1061.rendererConfig,
95969593
overrideHookState: null,
95979594
overrideHookStateDeletePath: null,
95989595
overrideHookStateRenamePath: null,
@@ -9609,26 +9606,26 @@ var internals$jscomp$inline_1254 = {
96099606
return null === fiber ? null : fiber.stateNode;
96109607
},
96119608
findFiberByHostInstance:
9612-
devToolsConfig$jscomp$inline_1065.findFiberByHostInstance ||
9609+
devToolsConfig$jscomp$inline_1061.findFiberByHostInstance ||
96139610
emptyFindFiberByHostInstance,
96149611
findHostInstancesForRefresh: null,
96159612
scheduleRefresh: null,
96169613
scheduleRoot: null,
96179614
setRefreshHandler: null,
96189615
getCurrentFiber: null,
9619-
reconcilerVersion: "19.0.0-canary-cdabf445"
9616+
reconcilerVersion: "19.0.0-canary-1f27a620"
96209617
};
96219618
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
9622-
var hook$jscomp$inline_1255 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
9619+
var hook$jscomp$inline_1251 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
96239620
if (
9624-
!hook$jscomp$inline_1255.isDisabled &&
9625-
hook$jscomp$inline_1255.supportsFiber
9621+
!hook$jscomp$inline_1251.isDisabled &&
9622+
hook$jscomp$inline_1251.supportsFiber
96269623
)
96279624
try {
9628-
(rendererID = hook$jscomp$inline_1255.inject(
9629-
internals$jscomp$inline_1254
9625+
(rendererID = hook$jscomp$inline_1251.inject(
9626+
internals$jscomp$inline_1250
96309627
)),
9631-
(injectedHook = hook$jscomp$inline_1255);
9628+
(injectedHook = hook$jscomp$inline_1251);
96329629
} catch (err) {}
96339630
}
96349631
exports._Scheduler = Scheduler;

‎compiled-rn/facebook-fbsource/xplat/js/react-native-github/Libraries/Renderer/REVISION‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
bb66aa3cef4e42aee790200d03cf7a82659da121
1+
4b8dfd6215bf855402ae1a94cb0ae4f467afca9a

‎compiled-rn/facebook-fbsource/xplat/js/react-native-github/Libraries/Renderer/implementations/ReactFabric-dev.fb.js‎

Lines changed: 5 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<59c12b288a18fed81de38ef7de7f9286>>
10+
* @generated SignedSource<<e76d28cbba11aa5c7a3d0b92eb6ca0f0>>
1111
*/
1212

1313
"use strict";
@@ -4701,11 +4701,12 @@ to return true:wantsResponderID| |
47014701
"Please file an issue."
47024702
);
47034703
} // Hydration (when unsupported)
4704+
4705+
var supportsHydration = false;
47044706
var isSuspenseInstancePending = shim$1;
47054707
var isSuspenseInstanceFallback = shim$1;
47064708
var getSuspenseInstanceFallbackErrorDetails = shim$1;
47074709
var registerSuspenseInstanceRetry = shim$1;
4708-
var errorHydratingContainer = shim$1;
47094710

47104711
// Renderers that don't support hydration
47114712
// can re-export everything from this module.
@@ -6027,14 +6028,6 @@ to return true:wantsResponderID| |
60276028

60286029
var objectIs = typeof Object.is === "function" ? Object.is : is; // $FlowFixMe[method-unbinding]
60296030

6030-
// This is imported by the event replaying implementation in React DOM. It's
6031-
// in a separate file to break a circular dependency between the renderer and
6032-
// the reconciler.
6033-
function isRootDehydrated(root) {
6034-
var currentState = root.current.memoizedState;
6035-
return currentState.isDehydrated;
6036-
}
6037-
60386031
var contextStackCursor = createCursor(null);
60396032
var contextFiberStackCursor = createCursor(null);
60406033
var rootInstanceStackCursor = createCursor(null); // Represents the nearest host transition provider (in React DOM, a <form />)
@@ -25837,27 +25830,7 @@ to return true:wantsResponderID| |
2583725830
// back to client side render.
2583825831
// Before rendering again, save the errors from the previous attempt.
2583925832
var errorsFromFirstAttempt = workInProgressRootConcurrentErrors;
25840-
var wasRootDehydrated = isRootDehydrated(root);
25841-
25842-
if (wasRootDehydrated) {
25843-
// The shell failed to hydrate. Set a flag to force a client rendering
25844-
// during the next attempt. To do this, we call prepareFreshStack now
25845-
// to create the root work-in-progress fiber. This is a bit weird in terms
25846-
// of factoring, because it relies on renderRootSync not calling
25847-
// prepareFreshStack again in the call below, which happens because the
25848-
// root and lanes haven't changed.
25849-
//
25850-
// TODO: I think what we should do is set ForceClientRender inside
25851-
// throwException, like we do for nested Suspense boundaries. The reason
25852-
// it's here instead is so we can switch to the synchronous work loop, too.
25853-
// Something to consider for a future refactor.
25854-
var rootWorkInProgress = prepareFreshStack(root, errorRetryLanes);
25855-
rootWorkInProgress.flags |= ForceClientRender;
25856-
25857-
{
25858-
errorHydratingContainer();
25859-
}
25860-
}
25833+
var wasRootDehydrated = supportsHydration;
2586125834

2586225835
var exitStatus = renderRootSync(root, errorRetryLanes);
2586325836

@@ -29856,7 +29829,7 @@ to return true:wantsResponderID| |
2985629829
return root;
2985729830
}
2985829831

29859-
var ReactVersion = "19.0.0-canary-6e1959ee";
29832+
var ReactVersion = "19.0.0-canary-1559f120";
2986029833

2986129834
function createPortal$1(
2986229835
children,

0 commit comments

Comments
 (0)