Skip to content

Commit 9b79292

Browse files
sebmarkbagesebmarkbage
authored
Add plumbing for onDefaultTransitionIndicator (facebook#33150)
This just adds the options at the root and wire it up to the root but it doesn't do anything yet.
1 parent ac06829 commit 9b79292

18 files changed

+92
-4
lines changed

‎packages/react-art/src/ReactART.js

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,14 +13,22 @@ import {
1313
updateContainerSync,
1414
injectIntoDevTools,
1515
flushSyncWork,
16+
defaultOnUncaughtError,
17+
defaultOnCaughtError,
18+
defaultOnRecoverableError,
1619
} from 'react-reconciler/src/ReactFiberReconciler';
20+
1721
import Transform from 'art/core/transform';
1822
import Mode from 'art/modes/current';
1923
import FastNoSideEffects from 'art/modes/fast-noSideEffects';
2024
import {disableLegacyMode} from 'shared/ReactFeatureFlags';
2125

2226
import {TYPES, childrenAsString} from './ReactARTInternals';
2327

28+
function defaultOnDefaultTransitionIndicator() {
29+
// Noop
30+
}
31+
2432
Mode.setCurrent(
2533
// Change to 'art/modes/dom' for easier debugging via SVG
2634
FastNoSideEffects,
@@ -75,6 +83,11 @@ class Surface extends React.Component {
7583
false,
7684
false,
7785
'',
86+
defaultOnUncaughtError,
87+
defaultOnCaughtError,
88+
defaultOnRecoverableError,
89+
defaultOnDefaultTransitionIndicator,
90+
null,
7891
);
7992
// We synchronously flush updates coming from above so that they commit together
8093
// and so that refs resolve before the parent life cycles.

‎packages/react-dom/src/client/ReactDOMRoot.js

Lines changed: 25 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,10 @@ import type {
1616
import {isValidContainer} from 'react-dom-bindings/src/client/ReactDOMContainer';
1717
import {queueExplicitHydrationTarget} from 'react-dom-bindings/src/events/ReactDOMEventReplaying';
1818
import {REACT_ELEMENT_TYPE} from 'shared/ReactSymbols';
19-
import {disableCommentsAsDOMContainers} from 'shared/ReactFeatureFlags';
19+
import {
20+
disableCommentsAsDOMContainers,
21+
enableDefaultTransitionIndicator,
22+
} from 'shared/ReactFeatureFlags';
2023

2124
export type RootType = {
2225
render(children: ReactNodeList): void,
@@ -43,6 +46,7 @@ export type CreateRootOptions = {
4346
error: mixed,
4447
errorInfo: {+componentStack?: ?string},
4548
) => void,
49+
onDefaultTransitionIndicator?: () => void | (() => void),
4650
};
4751

4852
export type HydrateRootOptions = {
@@ -68,6 +72,7 @@ export type HydrateRootOptions = {
6872
error: mixed,
6973
errorInfo: {+componentStack?: ?string},
7074
) => void,
75+
onDefaultTransitionIndicator?: () => void | (() => void),
7176
formState?: ReactFormState<any, any> | null,
7277
};
7378

@@ -92,6 +97,11 @@ import {
9297
} from 'react-reconciler/src/ReactFiberReconciler';
9398
import {ConcurrentRoot} from 'react-reconciler/src/ReactRootTags';
9499

100+
function defaultOnDefaultTransitionIndicator(): void | (() => void) {
101+
// TODO: Implement the default
102+
return function () {};
103+
}
104+
95105
// $FlowFixMe[missing-this-annot]
96106
function ReactDOMRoot(internalRoot: FiberRoot) {
97107
this._internalRoot = internalRoot;
@@ -178,6 +188,7 @@ export function createRoot(
178188
let onUncaughtError = defaultOnUncaughtError;
179189
let onCaughtError = defaultOnCaughtError;
180190
let onRecoverableError = defaultOnRecoverableError;
191+
let onDefaultTransitionIndicator = defaultOnDefaultTransitionIndicator;
181192
let transitionCallbacks = null;
182193

183194
if (options !== null && options !== undefined) {
@@ -217,6 +228,11 @@ export function createRoot(
217228
if (options.onRecoverableError !== undefined) {
218229
onRecoverableError = options.onRecoverableError;
219230
}
231+
if (enableDefaultTransitionIndicator) {
232+
if (options.onDefaultTransitionIndicator !== undefined) {
233+
onDefaultTransitionIndicator = options.onDefaultTransitionIndicator;
234+
}
235+
}
220236
if (options.unstable_transitionCallbacks !== undefined) {
221237
transitionCallbacks = options.unstable_transitionCallbacks;
222238
}
@@ -232,6 +248,7 @@ export function createRoot(
232248
onUncaughtError,
233249
onCaughtError,
234250
onRecoverableError,
251+
onDefaultTransitionIndicator,
235252
transitionCallbacks,
236253
);
237254
markContainerAsRoot(root.current, container);
@@ -288,6 +305,7 @@ export function hydrateRoot(
288305
let onUncaughtError = defaultOnUncaughtError;
289306
let onCaughtError = defaultOnCaughtError;
290307
let onRecoverableError = defaultOnRecoverableError;
308+
let onDefaultTransitionIndicator = defaultOnDefaultTransitionIndicator;
291309
let transitionCallbacks = null;
292310
let formState = null;
293311
if (options !== null && options !== undefined) {
@@ -306,6 +324,11 @@ export function hydrateRoot(
306324
if (options.onRecoverableError !== undefined) {
307325
onRecoverableError = options.onRecoverableError;
308326
}
327+
if (enableDefaultTransitionIndicator) {
328+
if (options.onDefaultTransitionIndicator !== undefined) {
329+
onDefaultTransitionIndicator = options.onDefaultTransitionIndicator;
330+
}
331+
}
309332
if (options.unstable_transitionCallbacks !== undefined) {
310333
transitionCallbacks = options.unstable_transitionCallbacks;
311334
}
@@ -326,6 +349,7 @@ export function hydrateRoot(
326349
onUncaughtError,
327350
onCaughtError,
328351
onRecoverableError,
352+
onDefaultTransitionIndicator,
329353
transitionCallbacks,
330354
formState,
331355
);

‎packages/react-dom/src/client/ReactDOMRootFB.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -211,6 +211,10 @@ function noopOnRecoverableError() {
211211
// legacy API.
212212
}
213213

214+
function noopOnDefaultTransitionIndicator() {
215+
// Noop
216+
}
217+
214218
function legacyCreateRootFromDOMContainer(
215219
container: Container,
216220
initialChildren: ReactNodeList,
@@ -239,6 +243,7 @@ function legacyCreateRootFromDOMContainer(
239243
wwwOnUncaughtError,
240244
wwwOnCaughtError,
241245
noopOnRecoverableError,
246+
noopOnDefaultTransitionIndicator,
242247
// TODO(luna) Support hydration later
243248
null,
244249
null,
@@ -277,6 +282,7 @@ function legacyCreateRootFromDOMContainer(
277282
wwwOnUncaughtError,
278283
wwwOnCaughtError,
279284
noopOnRecoverableError,
285+
noopOnDefaultTransitionIndicator,
280286
null, // transitionCallbacks
281287
);
282288
container._reactRootContainer = root;

‎packages/react-native-renderer/src/ReactFabric.js

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -98,6 +98,9 @@ function nativeOnCaughtError(
9898

9999
defaultOnCaughtError(error, errorInfo);
100100
}
101+
function nativeOnDefaultTransitionIndicator(): void | (() => void) {
102+
// Native doesn't have a default indicator.
103+
}
101104

102105
function render(
103106
element: Element<ElementType>,
@@ -148,6 +151,7 @@ function render(
148151
onUncaughtError,
149152
onCaughtError,
150153
onRecoverableError,
154+
nativeOnDefaultTransitionIndicator,
151155
null,
152156
);
153157

‎packages/react-native-renderer/src/ReactNativeRenderer.js

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -113,6 +113,9 @@ function nativeOnCaughtError(
113113

114114
defaultOnCaughtError(error, errorInfo);
115115
}
116+
function nativeOnDefaultTransitionIndicator(): void | (() => void) {
117+
// Native doesn't have a default indicator.
118+
}
116119

117120
function render(
118121
element: MixedElement,
@@ -162,6 +165,7 @@ function render(
162165
onUncaughtError,
163166
onCaughtError,
164167
onRecoverableError,
168+
nativeOnDefaultTransitionIndicator,
165169
null,
166170
);
167171
roots.set(containerTag, root);

‎packages/react-noop-renderer/src/createReactNoop.js

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -80,6 +80,7 @@ type CreateRootOptions = {
8080
unstable_transitionCallbacks?: TransitionTracingCallbacks,
8181
onUncaughtError?: (error: mixed, errorInfo: {componentStack: string}) => void,
8282
onCaughtError?: (error: mixed, errorInfo: {componentStack: string}) => void,
83+
onDefaultTransitionIndicator?: () => void | (() => void),
8384
...
8485
};
8586
type InstanceMeasurement = null;
@@ -1141,6 +1142,9 @@ function createReactNoop(reconciler: Function, useMutation: boolean) {
11411142
// TODO: Turn this on once tests are fixed
11421143
// console.error(error);
11431144
}
1145+
function onDefaultTransitionIndicator(): void | (() => void) {
1146+
// TODO: Allow this as an option.
1147+
}
11441148

11451149
let idCounter = 0;
11461150

@@ -1196,6 +1200,7 @@ function createReactNoop(reconciler: Function, useMutation: boolean) {
11961200
NoopRenderer.defaultOnUncaughtError,
11971201
NoopRenderer.defaultOnCaughtError,
11981202
onRecoverableError,
1203+
onDefaultTransitionIndicator,
11991204
null,
12001205
);
12011206
roots.set(rootID, root);
@@ -1224,6 +1229,9 @@ function createReactNoop(reconciler: Function, useMutation: boolean) {
12241229
? options.onCaughtError
12251230
: NoopRenderer.defaultOnCaughtError,
12261231
onRecoverableError,
1232+
options && options.onDefaultTransitionIndicator
1233+
? options.onDefaultTransitionIndicator
1234+
: onDefaultTransitionIndicator,
12271235
options && options.unstable_transitionCallbacks
12281236
? options.unstable_transitionCallbacks
12291237
: null,
@@ -1262,6 +1270,7 @@ function createReactNoop(reconciler: Function, useMutation: boolean) {
12621270
NoopRenderer.defaultOnUncaughtError,
12631271
NoopRenderer.defaultOnCaughtError,
12641272
onRecoverableError,
1273+
onDefaultTransitionIndicator,
12651274
null,
12661275
);
12671276
return {

‎packages/react-reconciler/src/ReactFiberReconciler.js

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -254,6 +254,7 @@ export function createContainer(
254254
error: mixed,
255255
errorInfo: {+componentStack?: ?string},
256256
) => void,
257+
onDefaultTransitionIndicator: () => void | (() => void),
257258
transitionCallbacks: null | TransitionTracingCallbacks,
258259
): OpaqueRoot {
259260
const hydrate = false;
@@ -266,11 +267,12 @@ export function createContainer(
266267
hydrationCallbacks,
267268
isStrictMode,
268269
identifierPrefix,
270+
null,
269271
onUncaughtError,
270272
onCaughtError,
271273
onRecoverableError,
274+
onDefaultTransitionIndicator,
272275
transitionCallbacks,
273-
null,
274276
);
275277
}
276278

@@ -300,6 +302,7 @@ export function createHydrationContainer(
300302
error: mixed,
301303
errorInfo: {+componentStack?: ?string},
302304
) => void,
305+
onDefaultTransitionIndicator: () => void | (() => void),
303306
transitionCallbacks: null | TransitionTracingCallbacks,
304307
formState: ReactFormState<any, any> | null,
305308
): OpaqueRoot {
@@ -312,11 +315,12 @@ export function createHydrationContainer(
312315
hydrationCallbacks,
313316
isStrictMode,
314317
identifierPrefix,
318+
formState,
315319
onUncaughtError,
316320
onCaughtError,
317321
onRecoverableError,
322+
onDefaultTransitionIndicator,
318323
transitionCallbacks,
319-
formState,
320324
);
321325

322326
// TODO: Move this to FiberRoot constructor

‎packages/react-reconciler/src/ReactFiberRoot.js

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@ import {
3535
disableLegacyMode,
3636
enableViewTransition,
3737
enableGestureTransition,
38+
enableDefaultTransitionIndicator,
3839
} from 'shared/ReactFeatureFlags';
3940
import {initializeUpdateQueue} from './ReactFiberClassUpdateQueue';
4041
import {LegacyRoot, ConcurrentRoot} from './ReactRootTags';
@@ -56,6 +57,7 @@ function FiberRootNode(
5657
onUncaughtError: any,
5758
onCaughtError: any,
5859
onRecoverableError: any,
60+
onDefaultTransitionIndicator: any,
5961
formState: ReactFormState<any, any> | null,
6062
) {
6163
this.tag = disableLegacyMode ? ConcurrentRoot : tag;
@@ -90,6 +92,10 @@ function FiberRootNode(
9092
this.onCaughtError = onCaughtError;
9193
this.onRecoverableError = onRecoverableError;
9294

95+
if (enableDefaultTransitionIndicator) {
96+
this.onDefaultTransitionIndicator = onDefaultTransitionIndicator;
97+
}
98+
9399
this.pooledCache = null;
94100
this.pooledCacheLanes = NoLanes;
95101

@@ -157,6 +163,7 @@ export function createFiberRoot(
157163
// them through the root constructor. Perhaps we should put them all into a
158164
// single type, like a DynamicHostConfig that is defined by the renderer.
159165
identifierPrefix: string,
166+
formState: ReactFormState<any, any> | null,
160167
onUncaughtError: (
161168
error: mixed,
162169
errorInfo: {+componentStack?: ?string},
@@ -172,8 +179,8 @@ export function createFiberRoot(
172179
error: mixed,
173180
errorInfo: {+componentStack?: ?string},
174181
) => void,
182+
onDefaultTransitionIndicator: () => void | (() => void),
175183
transitionCallbacks: null | TransitionTracingCallbacks,
176-
formState: ReactFormState<any, any> | null,
177184
): FiberRoot {
178185
// $FlowFixMe[invalid-constructor] Flow no longer supports calling new on functions
179186
const root: FiberRoot = (new FiberRootNode(
@@ -184,6 +191,7 @@ export function createFiberRoot(
184191
onUncaughtError,
185192
onCaughtError,
186193
onRecoverableError,
194+
onDefaultTransitionIndicator,
187195
formState,
188196
): any);
189197
if (enableSuspenseCallback) {

‎packages/react-reconciler/src/ReactInternalTypes.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -280,6 +280,8 @@ type BaseFiberRootProperties = {
280280
errorInfo: {+componentStack?: ?string},
281281
) => void,
282282

283+
onDefaultTransitionIndicator: () => void | (() => void),
284+
283285
formState: ReactFormState<any, any> | null,
284286

285287
// enableViewTransition only

‎packages/react-test-renderer/src/ReactTestRenderer.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -60,6 +60,10 @@ import {
6060
disableLegacyMode,
6161
} from 'shared/ReactFeatureFlags';
6262

63+
function defaultOnDefaultTransitionIndicator(): void | (() => void) {
64+
// Noop
65+
}
66+
6367
// $FlowFixMe[prop-missing]: This is only in the development export.
6468
const act = React.act;
6569

@@ -515,6 +519,7 @@ function create(
515519
defaultOnUncaughtError,
516520
defaultOnCaughtError,
517521
defaultOnRecoverableError,
522+
defaultOnDefaultTransitionIndicator,
518523
null,
519524
);
520525

‎packages/react-test-renderer/src/__tests__/ReactTestRenderer-test.internal.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -98,6 +98,7 @@ describe('ReactTestRenderer', () => {
9898
expect.anything(),
9999
expect.anything(),
100100
expect.anything(),
101+
expect.anything(),
101102
null,
102103
);
103104
}

‎packages/shared/ReactFeatureFlags.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -102,6 +102,8 @@ export const enableSrcObject = __EXPERIMENTAL__;
102102

103103
export const enableHydrationChangeEvent = __EXPERIMENTAL__;
104104

105+
export const enableDefaultTransitionIndicator = __EXPERIMENTAL__;
106+
105107
/**
106108
* Switches Fiber creation to a simple object instead of a constructor.
107109
*/

‎packages/shared/forks/ReactFeatureFlags.native-fb.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -85,6 +85,7 @@ export const enableScrollEndPolyfill = true;
8585
export const enableSuspenseyImages = false;
8686
export const enableSrcObject = false;
8787
export const enableHydrationChangeEvent = true;
88+
export const enableDefaultTransitionIndicator = false;
8889
export const ownerStackLimit = 1e4;
8990

9091
// Flow magic to verify the exports of this file match the original version.

‎packages/shared/forks/ReactFeatureFlags.native-oss.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -76,6 +76,7 @@ export const enableScrollEndPolyfill = true;
7676
export const enableSuspenseyImages = false;
7777
export const enableSrcObject = false;
7878
export const enableHydrationChangeEvent = false;
79+
export const enableDefaultTransitionIndicator = false;
7980
export const ownerStackLimit = 1e4;
8081

8182
export const enableFragmentRefs = false;

0 commit comments

Comments
 (0)