Move unstable_scheduleHydration to ReactDOMHydrationRoot (#22455)
* move unstable_scheduleHydration to ReactDOMHydrationRoot * move definition of schedule hydration * fix test? * prototype * fix test * remove gating because unstable_scheduleHydration is no longer gated through index.stable.js because its exposed through ReactDOMHydrationRoot instead of the ReactDOM package * remove another gating
salazarm committed
Nov 15, 2021 at 17:15 UTC
4ff5f5719b348d9d8db14aaa49a48532defb4ab7
8 files changed
+22
-23
packages/react-dom/index.classic.fb.js
-1
@@ -34,6 +34,5 @@ export {
34
unstable_isNewReconciler,
35
unstable_renderSubtreeIntoContainer,
36
unstable_runWithPriority, // DO NOT USE: Temporarily exposed to migrate off of Scheduler.runWithPriority.
37
- unstable_scheduleHydration,
37
version,
38
} from './src/client/ReactDOM';
packages/react-dom/index.experimental.js
-1
@@ -21,6 +21,5 @@ export {
21
unstable_flushControlled,
22
unstable_renderSubtreeIntoContainer,
23
unstable_runWithPriority, // DO NOT USE: Temporarily exposed to migrate off of Scheduler.runWithPriority.
24
- unstable_scheduleHydration,
24
version,
25
} from './src/client/ReactDOM';
packages/react-dom/index.js
-1
@@ -25,6 +25,5 @@ export {
25
unstable_isNewReconciler,
26
unstable_renderSubtreeIntoContainer,
27
unstable_runWithPriority, // DO NOT USE: Temporarily exposed to migrate off of Scheduler.runWithPriority.
28
- unstable_scheduleHydration,
28
version,
29
} from './src/client/ReactDOM';
packages/react-dom/index.modern.fb.js
-1
@@ -18,6 +18,5 @@ export {
18
unstable_flushControlled,
19
unstable_isNewReconciler,
20
unstable_runWithPriority, // DO NOT USE: Temporarily exposed to migrate off of Scheduler.runWithPriority.
21
- unstable_scheduleHydration,
21
version,
22
} from './src/client/ReactDOM';
packages/react-dom/src/__tests__/ReactDOMServerPartialHydration-test.internal.js
+2
-3
@@ -1771,10 +1771,9 @@ describe('ReactDOMServerPartialHydration', () => {
1771
const b = container.getElementsByTagName('span')[1];
1772
expect(b.textContent).toBe('B');
1773
1774
- const root = ReactDOM.createRoot(container, {hydrate: true});
1775
-
1774
+ const root = ReactDOM.hydrateRoot(container, <App />);
1775
// Increase hydration priority to higher than "offscreen".
1777
- ReactDOM.unstable_scheduleHydration(b);
1776
+ root.unstable_scheduleHydration(b);
1777
1778
suspend = true;
1779
packages/react-dom/src/__tests__/ReactDOMServerSelectiveHydration-test.internal.js
+3
-5
@@ -886,7 +886,6 @@ describe('ReactDOMServerSelectiveHydration', () => {
886
document.body.removeChild(container);
887
});
888
889
- // @gate experimental || www
889
it('hydrates the last explicitly hydrated target at higher priority', async () => {
890
function Child({text}) {
891
Scheduler.unstable_yieldValue(text);
@@ -920,15 +919,14 @@ describe('ReactDOMServerSelectiveHydration', () => {
919
const spanB = container.getElementsByTagName('span')[1];
920
const spanC = container.getElementsByTagName('span')[2];
921
923
- const root = ReactDOM.createRoot(container, {hydrate: true});
924
- root.render(<App />);
922
+ const root = ReactDOM.hydrateRoot(container, <App />);
923
924
// Nothing has been hydrated so far.
925
expect(Scheduler).toHaveYielded([]);
926
927
// Increase priority of B and then C.
930
- ReactDOM.unstable_scheduleHydration(spanB);
931
- ReactDOM.unstable_scheduleHydration(spanC);
928
+ root.unstable_scheduleHydration(spanB);
929
+ root.unstable_scheduleHydration(spanC);
930
931
// We should prioritize hydrating C first because the last added
932
// gets highest priority followed by the next added.
packages/react-dom/src/client/ReactDOM.js
-8
@@ -56,7 +56,6 @@ import {
56
setAttemptDiscreteHydration,
57
setAttemptContinuousHydration,
58
setAttemptHydrationAtCurrentPriority,
59
- queueExplicitHydrationTarget,
59
setGetCurrentUpdatePriority,
60
setAttemptHydrationAtPriority,
61
} from '../events/ReactDOMEventReplaying';
@@ -116,12 +115,6 @@ function createPortal(
115
return createPortalImpl(children, container, null, key);
116
}
117
119
-function scheduleHydration(target: Node) {
120
- if (target) {
121
- queueExplicitHydrationTarget(target);
122
- }
123
-}
124
-
118
function renderSubtreeIntoContainer(
119
parentComponent: React$Component<any, any>,
120
element: React$Element<any>,
@@ -196,7 +189,6 @@ export {
189
createRoot,
190
hydrateRoot,
191
flushControlled as unstable_flushControlled,
199
- scheduleHydration as unstable_scheduleHydration,
192
// Disabled behind disableUnstableRenderSubtreeIntoContainer
193
renderSubtreeIntoContainer as unstable_renderSubtreeIntoContainer,
194
// enableCreateEventHandleAPI
packages/react-dom/src/client/ReactDOMRoot.js
+17
-3
@@ -11,6 +11,8 @@ import type {Container} from './ReactDOMHostConfig';
11
import type {MutableSource, ReactNodeList} from 'shared/ReactTypes';
12
import type {FiberRoot} from 'react-reconciler/src/ReactInternalTypes';
13
14
+import {queueExplicitHydrationTarget} from '../events/ReactDOMEventReplaying';
15
+
16
export type RootType = {
17
render(children: ReactNodeList): void,
18
unmount(): void,
@@ -72,7 +74,9 @@ function ReactDOMRoot(internalRoot: FiberRoot) {
74
this._internalRoot = internalRoot;
75
}
76
75
-ReactDOMRoot.prototype.render = function(children: ReactNodeList): void {
77
+ReactDOMHydrationRoot.prototype.render = ReactDOMRoot.prototype.render = function(
78
+ children: ReactNodeList,
79
+): void {
80
const root = this._internalRoot;
81
if (root === null) {
82
throw new Error('Cannot update an unmounted root.');
@@ -104,7 +108,7 @@ ReactDOMRoot.prototype.render = function(children: ReactNodeList): void {
108
updateContainer(children, root, null, null);
109
};
110
107
-ReactDOMRoot.prototype.unmount = function(): void {
111
+ReactDOMHydrationRoot.prototype.unmount = ReactDOMRoot.prototype.unmount = function(): void {
112
if (__DEV__) {
113
if (typeof arguments[0] === 'function') {
114
console.error(
@@ -189,6 +193,16 @@ export function createRoot(
193
return new ReactDOMRoot(root);
194
}
195
196
+function ReactDOMHydrationRoot(internalRoot: FiberRoot) {
197
+ this._internalRoot = internalRoot;
198
+}
199
+function scheduleHydration(target: Node) {
200
+ if (target) {
201
+ queueExplicitHydrationTarget(target);
202
+ }
203
+}
204
+ReactDOMHydrationRoot.prototype.unstable_scheduleHydration = scheduleHydration;
205
+
206
export function hydrateRoot(
207
container: Container,
208
initialChildren: ReactNodeList,
@@ -236,7 +250,7 @@ export function hydrateRoot(
250
// Render the initial children
251
updateContainer(initialChildren, root, null, null);
252
239
- return new ReactDOMRoot(root);
253
+ return new ReactDOMHydrationRoot(root);
254
}
255
256
export function isValidContainer(node: any): boolean {