Skip to content

Commit e4244f4

Browse files
committed
Remove legacy hydration mode
1 parent 239d06e commit e4244f4

12 files changed

+32
-344
lines changed

packages/react-dom-bindings/src/client/ReactDOMComponent.js

+4-15
Original file line numberDiff line numberDiff line change
@@ -327,7 +327,6 @@ function normalizeMarkupForTextOrAttribute(markup: mixed): string {
327327
export function checkForUnmatchedText(
328328
serverText: string,
329329
clientText: string | number,
330-
isConcurrentMode: boolean,
331330
shouldWarnDev: boolean,
332331
) {
333332
const normalizedClientText = normalizeMarkupForTextOrAttribute(clientText);
@@ -349,7 +348,7 @@ export function checkForUnmatchedText(
349348
}
350349
}
351350

352-
if (isConcurrentMode && enableClientRenderFallbackOnTextMismatch) {
351+
if (enableClientRenderFallbackOnTextMismatch) {
353352
// In concurrent roots, we throw when there's a text mismatch and revert to
354353
// client rendering, up to the nearest Suspense boundary.
355354
throw new Error('Text content does not match server-rendered HTML.');
@@ -2706,7 +2705,6 @@ export function diffHydratedProperties(
27062705
domElement: Element,
27072706
tag: string,
27082707
props: Object,
2709-
isConcurrentMode: boolean,
27102708
shouldWarnDev: boolean,
27112709
hostContext: HostContext,
27122710
): void {
@@ -2820,14 +2818,9 @@ export function diffHydratedProperties(
28202818
if (typeof children === 'string' || typeof children === 'number') {
28212819
if (domElement.textContent !== '' + children) {
28222820
if (props.suppressHydrationWarning !== true) {
2823-
checkForUnmatchedText(
2824-
domElement.textContent,
2825-
children,
2826-
isConcurrentMode,
2827-
shouldWarnDev,
2828-
);
2821+
checkForUnmatchedText(domElement.textContent, children, shouldWarnDev);
28292822
}
2830-
if (!isConcurrentMode || !enableClientRenderFallbackOnTextMismatch) {
2823+
if (!enableClientRenderFallbackOnTextMismatch) {
28312824
// We really should be patching this in the commit phase but since
28322825
// this only affects legacy mode hydration which is deprecated anyway
28332826
// we can get away with it.
@@ -2896,11 +2889,7 @@ export function diffHydratedProperties(
28962889
}
28972890
}
28982891

2899-
export function diffHydratedText(
2900-
textNode: Text,
2901-
text: string,
2902-
isConcurrentMode: boolean,
2903-
): boolean {
2892+
export function diffHydratedText(textNode: Text, text: string): boolean {
29042893
const isDifferent = textNode.nodeValue !== text;
29052894
return isDifferent;
29062895
}

packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js

+12-52
Original file line numberDiff line numberDiff line change
@@ -31,8 +31,6 @@ import type {
3131
import {NotPending} from 'react-dom-bindings/src/shared/ReactDOMFormActions';
3232
import {getCurrentRootHostContainer} from 'react-reconciler/src/ReactFiberHostContext';
3333
import {DefaultEventPriority} from 'react-reconciler/src/ReactEventPriorities';
34-
// TODO: Remove this deep import when we delete the legacy root API
35-
import {ConcurrentMode, NoMode} from 'react-reconciler/src/ReactTypeOfMode';
3634

3735
import hasOwnProperty from 'shared/hasOwnProperty';
3836
import {checkAttributeStringCoercion} from 'shared/CheckStringCoercion';
@@ -1381,19 +1379,7 @@ export function hydrateInstance(
13811379
// get attached.
13821380
updateFiberProps(instance, props);
13831381

1384-
// TODO: Temporary hack to check if we're in a concurrent root. We can delete
1385-
// when the legacy root API is removed.
1386-
const isConcurrentMode =
1387-
((internalInstanceHandle: Fiber).mode & ConcurrentMode) !== NoMode;
1388-
1389-
diffHydratedProperties(
1390-
instance,
1391-
type,
1392-
props,
1393-
isConcurrentMode,
1394-
shouldWarnDev,
1395-
hostContext,
1396-
);
1382+
diffHydratedProperties(instance, type, props, shouldWarnDev, hostContext);
13971383
}
13981384

13991385
export function validateHydratableTextInstance(
@@ -1418,12 +1404,7 @@ export function hydrateTextInstance(
14181404
): boolean {
14191405
precacheFiberNode(internalInstanceHandle, textInstance);
14201406

1421-
// TODO: Temporary hack to check if we're in a concurrent root. We can delete
1422-
// when the legacy root API is removed.
1423-
const isConcurrentMode =
1424-
((internalInstanceHandle: Fiber).mode & ConcurrentMode) !== NoMode;
1425-
1426-
return diffHydratedText(textInstance, text, isConcurrentMode);
1407+
return diffHydratedText(textInstance, text);
14271408
}
14281409

14291410
export function hydrateSuspenseInstance(
@@ -1521,15 +1502,9 @@ export function didNotMatchHydratedContainerTextInstance(
15211502
parentContainer: Container,
15221503
textInstance: TextInstance,
15231504
text: string,
1524-
isConcurrentMode: boolean,
15251505
shouldWarnDev: boolean,
15261506
) {
1527-
checkForUnmatchedText(
1528-
textInstance.nodeValue,
1529-
text,
1530-
isConcurrentMode,
1531-
shouldWarnDev,
1532-
);
1507+
checkForUnmatchedText(textInstance.nodeValue, text, shouldWarnDev);
15331508
}
15341509

15351510
export function didNotMatchHydratedTextInstance(
@@ -1538,16 +1513,10 @@ export function didNotMatchHydratedTextInstance(
15381513
parentInstance: Instance,
15391514
textInstance: TextInstance,
15401515
text: string,
1541-
isConcurrentMode: boolean,
15421516
shouldWarnDev: boolean,
15431517
) {
15441518
if (parentProps[SUPPRESS_HYDRATION_WARNING] !== true) {
1545-
checkForUnmatchedText(
1546-
textInstance.nodeValue,
1547-
text,
1548-
isConcurrentMode,
1549-
shouldWarnDev,
1550-
);
1519+
checkForUnmatchedText(textInstance.nodeValue, text, shouldWarnDev);
15511520
}
15521521
}
15531522

@@ -1590,17 +1559,14 @@ export function didNotHydrateInstance(
15901559
parentProps: Props,
15911560
parentInstance: Instance,
15921561
instance: HydratableInstance,
1593-
isConcurrentMode: boolean,
15941562
) {
15951563
if (__DEV__) {
1596-
if (isConcurrentMode || parentProps[SUPPRESS_HYDRATION_WARNING] !== true) {
1597-
if (instance.nodeType === ELEMENT_NODE) {
1598-
warnForDeletedHydratableElement(parentInstance, (instance: any));
1599-
} else if (instance.nodeType === COMMENT_NODE) {
1600-
// TODO: warnForDeletedHydratableSuspenseBoundary
1601-
} else {
1602-
warnForDeletedHydratableText(parentInstance, (instance: any));
1603-
}
1564+
if (instance.nodeType === ELEMENT_NODE) {
1565+
warnForDeletedHydratableElement(parentInstance, (instance: any));
1566+
} else if (instance.nodeType === COMMENT_NODE) {
1567+
// TODO: warnForDeletedHydratableSuspenseBoundary
1568+
} else {
1569+
warnForDeletedHydratableText(parentInstance, (instance: any));
16041570
}
16051571
}
16061572
}
@@ -1671,12 +1637,9 @@ export function didNotFindHydratableInstance(
16711637
parentInstance: Instance,
16721638
type: string,
16731639
props: Props,
1674-
isConcurrentMode: boolean,
16751640
) {
16761641
if (__DEV__) {
1677-
if (isConcurrentMode || parentProps[SUPPRESS_HYDRATION_WARNING] !== true) {
1678-
warnForInsertedHydratedElement(parentInstance, type, props);
1679-
}
1642+
warnForInsertedHydratedElement(parentInstance, type, props);
16801643
}
16811644
}
16821645

@@ -1685,12 +1648,9 @@ export function didNotFindHydratableTextInstance(
16851648
parentProps: Props,
16861649
parentInstance: Instance,
16871650
text: string,
1688-
isConcurrentMode: boolean,
16891651
) {
16901652
if (__DEV__) {
1691-
if (isConcurrentMode || parentProps[SUPPRESS_HYDRATION_WARNING] !== true) {
1692-
warnForInsertedHydratedText(parentInstance, text);
1693-
}
1653+
warnForInsertedHydratedText(parentInstance, text);
16941654
}
16951655
}
16961656

packages/react-dom/index.classic.fb.js

-1
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,6 @@ export {
2424
hydrateRoot,
2525
findDOMNode,
2626
flushSync,
27-
hydrate,
2827
render,
2928
unmountComponentAtNode,
3029
unstable_batchedUpdates,

packages/react-dom/index.experimental.js

-1
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,6 @@ export {
1414
hydrateRoot,
1515
findDOMNode,
1616
flushSync,
17-
hydrate,
1817
render,
1918
unmountComponentAtNode,
2019
unstable_batchedUpdates,

packages/react-dom/index.js

-1
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,6 @@ export {
1616
hydrateRoot,
1717
findDOMNode,
1818
flushSync,
19-
hydrate,
2019
render,
2120
unmountComponentAtNode,
2221
unstable_batchedUpdates,

packages/react-dom/index.stable.js

-1
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,6 @@ export {
1414
hydrateRoot,
1515
findDOMNode,
1616
flushSync,
17-
hydrate,
1817
render,
1918
unmountComponentAtNode,
2019
unstable_batchedUpdates,

packages/react-dom/src/client/ReactDOM.js

-2
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,6 @@ import type {
2121
import {
2222
findDOMNode,
2323
render,
24-
hydrate,
2524
unstable_renderSubtreeIntoContainer,
2625
unmountComponentAtNode,
2726
} from './ReactDOMLegacy';
@@ -172,7 +171,6 @@ export {
172171
ReactVersion as version,
173172
// Disabled behind disableLegacyReactDOMAPIs
174173
findDOMNode,
175-
hydrate,
176174
render,
177175
unmountComponentAtNode,
178176
// exposeConcurrentModeAPIs

packages/react-dom/src/client/ReactDOMLegacy.js

-40
Original file line numberDiff line numberDiff line change
@@ -259,46 +259,6 @@ export function findDOMNode(
259259
return findHostInstance(componentOrElement);
260260
}
261261

262-
export function hydrate(
263-
element: React$Node,
264-
container: Container,
265-
callback: ?Function,
266-
): React$Component<any, any> | PublicInstance | null {
267-
if (__DEV__) {
268-
console.error(
269-
'ReactDOM.hydrate is no longer supported in React 18. Use hydrateRoot ' +
270-
'instead. Until you switch to the new API, your app will behave as ' +
271-
"if it's running React 17. Learn " +
272-
'more: https://reactjs.org/link/switch-to-createroot',
273-
);
274-
}
275-
276-
if (!isValidContainerLegacy(container)) {
277-
throw new Error('Target container is not a DOM element.');
278-
}
279-
280-
if (__DEV__) {
281-
const isModernRoot =
282-
isContainerMarkedAsRoot(container) &&
283-
container._reactRootContainer === undefined;
284-
if (isModernRoot) {
285-
console.error(
286-
'You are calling ReactDOM.hydrate() on a container that was previously ' +
287-
'passed to ReactDOMClient.createRoot(). This is not supported. ' +
288-
'Did you mean to call hydrateRoot(container, element)?',
289-
);
290-
}
291-
}
292-
// TODO: throw or warn if we couldn't hydrate?
293-
return legacyRenderSubtreeIntoContainer(
294-
null,
295-
element,
296-
container,
297-
true,
298-
callback,
299-
);
300-
}
301-
302262
export function render(
303263
element: React$Element<any>,
304264
container: Container,

packages/react-dom/unstable_testing.classic.fb.js

-1
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@ export {
1111
createPortal,
1212
findDOMNode,
1313
flushSync,
14-
hydrate,
1514
render,
1615
unmountComponentAtNode,
1716
unstable_batchedUpdates,

packages/react-reconciler/src/ReactFiber.js

-6
Original file line numberDiff line numberDiff line change
@@ -850,12 +850,6 @@ export function createFiberFromText(
850850
return fiber;
851851
}
852852

853-
export function createFiberFromHostInstanceForDeletion(): Fiber {
854-
const fiber = createFiber(HostComponent, null, null, NoMode);
855-
fiber.elementType = 'DELETED';
856-
return fiber;
857-
}
858-
859853
export function createFiberFromDehydratedFragment(
860854
dehydratedNode: SuspenseInstance,
861855
): Fiber {

packages/react-reconciler/src/ReactFiberBeginWork.js

+1-22
Original file line numberDiff line numberDiff line change
@@ -143,7 +143,6 @@ import {
143143
import {
144144
NoLane,
145145
NoLanes,
146-
SyncLane,
147146
OffscreenLane,
148147
DefaultHydrationLane,
149148
SomeRetryLane,
@@ -2738,18 +2737,7 @@ function mountDehydratedSuspenseComponent(
27382737
): null | Fiber {
27392738
// During the first pass, we'll bail out and not drill into the children.
27402739
// Instead, we'll leave the content in place and try to hydrate it later.
2741-
if ((workInProgress.mode & ConcurrentMode) === NoMode) {
2742-
if (__DEV__) {
2743-
console.error(
2744-
'Cannot hydrate Suspense in legacy mode. Switch from ' +
2745-
'ReactDOM.hydrate(element, container) to ' +
2746-
'ReactDOMClient.hydrateRoot(container, <App />)' +
2747-
'.render(element) or remove the Suspense components from ' +
2748-
'the server rendered components.',
2749-
);
2750-
}
2751-
workInProgress.lanes = laneToLanes(SyncLane);
2752-
} else if (isSuspenseInstanceFallback(suspenseInstance)) {
2740+
if (isSuspenseInstanceFallback(suspenseInstance)) {
27532741
// This is a client-only boundary. Since we won't get any content from the server
27542742
// for this, we need to schedule that at a higher priority based on when it would
27552743
// have timed out. In theory we could render it in this pass but it would have the
@@ -2789,15 +2777,6 @@ function updateDehydratedSuspenseComponent(
27892777
// but after we've already committed once.
27902778
warnIfHydrating();
27912779

2792-
if ((workInProgress.mode & ConcurrentMode) === NoMode) {
2793-
return retrySuspenseComponentWithoutHydrating(
2794-
current,
2795-
workInProgress,
2796-
renderLanes,
2797-
null,
2798-
);
2799-
}
2800-
28012780
if (isSuspenseInstanceFallback(suspenseInstance)) {
28022781
// This boundary is in a permanent fallback state. In this case, we'll never
28032782
// get an update and we'll never be able to hydrate the final content. Let's just try the

0 commit comments

Comments
 (0)