Skip to content

Commit e730b5e

Browse files
authored
[flow] Update files synced to react-native to use modern flow syntax (react#36759)
## Summary This diff bumps a few hermes-parser related dependencies so that it can consume modern Flow syntax. In addition, it makes targeted changes to two files that will be synced to react-native so that we can enforce we only use modern flow syntax in react-native. ## How did you test this change? flow
1 parent dbc3750 commit e730b5e

9 files changed

Lines changed: 82 additions & 99 deletions

File tree

.eslintrc.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -567,6 +567,7 @@ module.exports = {
567567
$Shape: 'readonly',
568568
CallSite: 'readonly',
569569
ConsoleTask: 'readonly', // TOOD: Figure out what the official name of this will be.
570+
Readonly: 'readonly',
570571
ReturnType: 'readonly',
571572
AggregateError: 'readonly',
572573
AnimationFrameID: 'readonly',

.prettierignore

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,12 @@ compiler/**/.next
2222

2323
# contains invalid graphql`...` which results in a promise rejection error from `yarn prettier-all`.
2424
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-kitchensink.js
25+
# contains invalid const reassignment; the fixture asserts the compiler diagnostic.
26+
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-const.js
27+
# preserves the exact sequence-expression source shape used by the fixture.
28+
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/memoize-value-block-value-sequence.js
29+
# preserves minimized production input; formatting changes the reduced repro shape.
30+
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo-round3_promote_used_temps.js
2531

2632
compiler/crates
2733
compiler/target

.prettierrc.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,8 @@ module.exports = {
88
bracketSameLine: true,
99
trailingComma: 'es5',
1010
printWidth: 80,
11-
parser: 'flow',
11+
plugins: ['prettier-plugin-hermes-parser'],
12+
parser: 'hermes',
1213
arrowParens: 'avoid',
1314
overrides: [
1415
{

package.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@
5050
"@typescript-eslint/parser": "^6.21.0",
5151
"abortcontroller-polyfill": "^1.7.5",
5252
"art": "0.10.1",
53-
"babel-plugin-syntax-hermes-parser": "^0.32.0",
53+
"babel-plugin-syntax-hermes-parser": "^0.36.1",
5454
"babel-plugin-syntax-trailing-function-commas": "^6.5.0",
5555
"busboy": "^1.6.0",
5656
"chalk": "^3.0.0",
@@ -82,8 +82,8 @@
8282
"glob-stream": "^6.1.0",
8383
"google-closure-compiler": "^20230206.0.0",
8484
"gzip-size": "^5.1.1",
85-
"hermes-eslint": "^0.32.0",
86-
"hermes-parser": "^0.32.0",
85+
"hermes-eslint": "^0.36.1",
86+
"hermes-parser": "^0.36.1",
8787
"jest": "^29.4.2",
8888
"jest-cli": "^29.4.2",
8989
"jest-diff": "^29.4.2",
@@ -96,7 +96,7 @@
9696
"ncp": "^2.0.0",
9797
"prettier": "^3.3.3",
9898
"prettier-2": "npm:prettier@^2",
99-
"prettier-plugin-hermes-parser": "^0.32.0",
99+
"prettier-plugin-hermes-parser": "^0.36.1",
100100
"pretty-format": "^29.4.1",
101101
"prop-types": "^15.6.2",
102102
"random-seed": "^0.3.0",

packages/react-devtools-shared/src/__tests__/console-test.js

Lines changed: 13 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -363,8 +363,7 @@ describe('console', () => {
363363

364364
it('should double log if hideConsoleLogsInStrictMode is disabled in Strict mode', () => {
365365
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.appendComponentStack = false;
366-
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.hideConsoleLogsInStrictMode =
367-
false;
366+
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.hideConsoleLogsInStrictMode = false;
368367

369368
const container = document.createElement('div');
370369
const root = ReactDOMClient.createRoot(container);
@@ -405,8 +404,7 @@ describe('console', () => {
405404

406405
it('should not double log if hideConsoleLogsInStrictMode is enabled in Strict mode', () => {
407406
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.appendComponentStack = false;
408-
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.hideConsoleLogsInStrictMode =
409-
true;
407+
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.hideConsoleLogsInStrictMode = true;
410408

411409
const container = document.createElement('div');
412410
const root = ReactDOMClient.createRoot(container);
@@ -433,8 +431,7 @@ describe('console', () => {
433431

434432
it('should double log from Effects if hideConsoleLogsInStrictMode is disabled in Strict mode', () => {
435433
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.appendComponentStack = false;
436-
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.hideConsoleLogsInStrictMode =
437-
false;
434+
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.hideConsoleLogsInStrictMode = false;
438435

439436
const container = document.createElement('div');
440437
const root = ReactDOMClient.createRoot(container);
@@ -481,8 +478,7 @@ describe('console', () => {
481478

482479
it('should not double log from Effects if hideConsoleLogsInStrictMode is enabled in Strict mode', () => {
483480
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.appendComponentStack = false;
484-
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.hideConsoleLogsInStrictMode =
485-
true;
481+
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.hideConsoleLogsInStrictMode = true;
486482

487483
const container = document.createElement('div');
488484
const root = ReactDOMClient.createRoot(container);
@@ -518,8 +514,7 @@ describe('console', () => {
518514

519515
it('should double log from useMemo if hideConsoleLogsInStrictMode is disabled in Strict mode', () => {
520516
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.appendComponentStack = false;
521-
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.hideConsoleLogsInStrictMode =
522-
false;
517+
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.hideConsoleLogsInStrictMode = false;
523518

524519
const container = document.createElement('div');
525520
const root = ReactDOMClient.createRoot(container);
@@ -562,8 +557,7 @@ describe('console', () => {
562557

563558
it('should not double log from useMemo fns if hideConsoleLogsInStrictMode is enabled in Strict mode', () => {
564559
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.appendComponentStack = false;
565-
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.hideConsoleLogsInStrictMode =
566-
true;
560+
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.hideConsoleLogsInStrictMode = true;
567561

568562
const container = document.createElement('div');
569563
const root = ReactDOMClient.createRoot(container);
@@ -592,8 +586,7 @@ describe('console', () => {
592586

593587
it('should double log in Strict mode initial render for extension', () => {
594588
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.appendComponentStack = false;
595-
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.hideConsoleLogsInStrictMode =
596-
false;
589+
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.hideConsoleLogsInStrictMode = false;
597590

598591
// This simulates a render that happens before React DevTools have finished
599592
// their handshake to attach the React DOM renderer functions to DevTools
@@ -638,8 +631,7 @@ describe('console', () => {
638631

639632
it('should not double log in Strict mode initial render for extension', () => {
640633
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.appendComponentStack = false;
641-
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.hideConsoleLogsInStrictMode =
642-
true;
634+
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.hideConsoleLogsInStrictMode = true;
643635

644636
// This simulates a render that happens before React DevTools have finished
645637
// their handshake to attach the React DOM renderer functions to DevTools
@@ -670,8 +662,7 @@ describe('console', () => {
670662

671663
it('should properly dim component stacks during strict mode double log', () => {
672664
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.appendComponentStack = true;
673-
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.hideConsoleLogsInStrictMode =
674-
false;
665+
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.hideConsoleLogsInStrictMode = false;
675666

676667
const container = document.createElement('div');
677668
const root = ReactDOMClient.createRoot(container);
@@ -736,10 +727,8 @@ describe('console', () => {
736727

737728
it('should not dim console logs if disableSecondConsoleLogDimmingInStrictMode is enabled', () => {
738729
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.appendComponentStack = false;
739-
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.hideConsoleLogsInStrictMode =
740-
false;
741-
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.disableSecondConsoleLogDimmingInStrictMode =
742-
true;
730+
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.hideConsoleLogsInStrictMode = false;
731+
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.disableSecondConsoleLogDimmingInStrictMode = true;
743732

744733
const container = document.createElement('div');
745734
const root = ReactDOMClient.createRoot(container);
@@ -772,10 +761,8 @@ describe('console', () => {
772761

773762
it('should dim console logs if disableSecondConsoleLogDimmingInStrictMode is disabled', () => {
774763
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.appendComponentStack = false;
775-
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.hideConsoleLogsInStrictMode =
776-
false;
777-
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.disableSecondConsoleLogDimmingInStrictMode =
778-
false;
764+
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.hideConsoleLogsInStrictMode = false;
765+
global.__REACT_DEVTOOLS_GLOBAL_HOOK__.settings.disableSecondConsoleLogDimmingInStrictMode = false;
779766

780767
const container = document.createElement('div');
781768
const root = ReactDOMClient.createRoot(container);

packages/react-native-renderer/src/ReactNativeTypes.js

Lines changed: 35 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -24,42 +24,42 @@ import * as React from 'react';
2424

2525
export type AttributeType<T, V> =
2626
| true
27-
| $ReadOnly<{
27+
| Readonly<{
2828
diff?: (arg1: T, arg2: T) => boolean,
2929
process?: (arg1: V) => T,
3030
}>;
3131

32-
// We either force that `diff` and `process` always use mixed,
32+
// We either force that `diff` and `process` always use unknown,
3333
// or we allow them to define specific types and use this hack
3434
export type AnyAttributeType = AttributeType<$FlowFixMe, $FlowFixMe>;
3535

36-
export type AttributeConfiguration = $ReadOnly<{
36+
export type AttributeConfiguration = Readonly<{
3737
[propName: string]: AnyAttributeType | void,
38-
style?: $ReadOnly<{
38+
style?: Readonly<{
3939
[propName: string]: AnyAttributeType,
4040
...
4141
}>,
4242
...
4343
}>;
4444

45-
export type ViewConfig = $ReadOnly<{
46-
Commands?: $ReadOnly<{[commandName: string]: number, ...}>,
47-
Constants?: $ReadOnly<{[name: string]: mixed, ...}>,
45+
export type ViewConfig = Readonly<{
46+
Commands?: Readonly<{[commandName: string]: number, ...}>,
47+
Constants?: Readonly<{[name: string]: unknown, ...}>,
4848
Manager?: string,
49-
NativeProps?: $ReadOnly<{[propName: string]: string, ...}>,
49+
NativeProps?: Readonly<{[propName: string]: string, ...}>,
5050
baseModuleName?: ?string,
51-
bubblingEventTypes?: $ReadOnly<{
52-
[eventName: string]: $ReadOnly<{
53-
phasedRegistrationNames: $ReadOnly<{
51+
bubblingEventTypes?: Readonly<{
52+
[eventName: string]: Readonly<{
53+
phasedRegistrationNames: Readonly<{
5454
captured: string,
5555
bubbled: string,
5656
skipBubbling?: ?boolean,
5757
}>,
5858
}>,
5959
...
6060
}>,
61-
directEventTypes?: $ReadOnly<{
62-
[eventName: string]: $ReadOnly<{
61+
directEventTypes?: Readonly<{
62+
[eventName: string]: Readonly<{
6363
registrationName: string,
6464
}>,
6565
...
@@ -69,30 +69,30 @@ export type ViewConfig = $ReadOnly<{
6969
validAttributes: AttributeConfiguration,
7070
}>;
7171

72-
export type PartialViewConfig = $ReadOnly<{
72+
export type PartialViewConfig = Readonly<{
7373
bubblingEventTypes?: ViewConfig['bubblingEventTypes'],
7474
directEventTypes?: ViewConfig['directEventTypes'],
7575
supportsRawText?: boolean,
7676
uiViewClassName: string,
7777
validAttributes?: AttributeConfiguration,
7878
}>;
7979

80-
type InspectorDataProps = $ReadOnly<{
80+
type InspectorDataProps = Readonly<{
8181
[propName: string]: string,
8282
...
8383
}>;
8484

8585
type InspectorDataGetter = (
86-
<TElementType: React.ElementType>(
86+
<TElementType extends React.ElementType>(
8787
componentOrHandle: React.ElementRef<TElementType> | number,
8888
) => ?number,
89-
) => $ReadOnly<{
89+
) => Readonly<{
9090
measure: (callback: MeasureOnSuccessCallback) => void,
9191
props: InspectorDataProps,
9292
}>;
9393

94-
export type InspectorData = $ReadOnly<{
95-
closestInstance?: mixed,
94+
export type InspectorData = Readonly<{
95+
closestInstance?: unknown,
9696
hierarchy: Array<{
9797
name: ?string,
9898
getInspectorData: InspectorDataGetter,
@@ -102,11 +102,11 @@ export type InspectorData = $ReadOnly<{
102102
componentStack: string,
103103
}>;
104104

105-
export type TouchedViewDataAtPoint = $ReadOnly<
105+
export type TouchedViewDataAtPoint = Readonly<
106106
{
107107
pointerY: number,
108108
touchedViewTag?: number,
109-
frame: $ReadOnly<{
109+
frame: Readonly<{
110110
top: number,
111111
left: number,
112112
width: number,
@@ -118,39 +118,39 @@ export type TouchedViewDataAtPoint = $ReadOnly<
118118

119119
export type RenderRootOptions = {
120120
onUncaughtError?: (
121-
error: mixed,
122-
errorInfo: {+componentStack?: ?string},
121+
error: unknown,
122+
errorInfo: {readonly componentStack?: ?string},
123123
) => void,
124124
onCaughtError?: (
125-
error: mixed,
125+
error: unknown,
126126
errorInfo: {
127-
+componentStack?: ?string,
127+
readonly componentStack?: ?string,
128128
// $FlowFixMe[unclear-type] unknown props and state.
129129
// $FlowFixMe[value-as-type] Component in react repo is any-typed, but it will be well typed externally.
130-
+errorBoundary?: ?React.Component<any, any>,
130+
readonly errorBoundary?: ?React.Component<any, any>,
131131
},
132132
) => void,
133133
onRecoverableError?: (
134-
error: mixed,
135-
errorInfo: {+componentStack?: ?string},
134+
error: unknown,
135+
errorInfo: {readonly componentStack?: ?string},
136136
) => void,
137137
onDefaultTransitionIndicator?: () => void | (() => void),
138138
};
139139

140-
export opaque type Node = mixed;
141-
export opaque type InternalInstanceHandle = mixed;
140+
export opaque type Node = unknown;
141+
export opaque type InternalInstanceHandle = unknown;
142142

143143
export type ReactFabricType = {
144-
findHostInstance_DEPRECATED<TElementType: React.ElementType>(
144+
findHostInstance_DEPRECATED<TElementType extends React.ElementType>(
145145
componentOrHandle: ?(React.ElementRef<TElementType> | number),
146146
): ?PublicInstance,
147-
findNodeHandle<TElementType: React.ElementType>(
147+
findNodeHandle<TElementType extends React.ElementType>(
148148
componentOrHandle: ?(React.ElementRef<TElementType> | number),
149149
): ?number,
150150
dispatchCommand(
151151
handle: PublicInstance,
152152
command: string,
153-
args: Array<mixed>,
153+
args: Array<unknown>,
154154
): void,
155155
isChildPublicInstance(parent: PublicInstance, child: PublicInstance): boolean,
156156
sendAccessibilityEvent(handle: PublicInstance, eventType: string): void,
@@ -210,7 +210,7 @@ export type LayoutAnimationProperty =
210210
| 'scaleY'
211211
| 'scaleXY';
212212

213-
export type LayoutAnimationAnimationConfig = $ReadOnly<{
213+
export type LayoutAnimationAnimationConfig = Readonly<{
214214
duration?: number,
215215
delay?: number,
216216
springDamping?: number,
@@ -219,7 +219,7 @@ export type LayoutAnimationAnimationConfig = $ReadOnly<{
219219
property?: LayoutAnimationProperty,
220220
}>;
221221

222-
export type LayoutAnimationConfig = $ReadOnly<{
222+
export type LayoutAnimationConfig = Readonly<{
223223
duration: number,
224224
create?: LayoutAnimationAnimationConfig,
225225
update?: LayoutAnimationAnimationConfig,

packages/react-reconciler/src/ReactFiberHooks.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3826,8 +3826,8 @@ function enqueueRenderPhaseUpdate<S, A>(
38263826
// This is a render phase update. Stash it in a lazily-created map of
38273827
// queue -> linked list of updates. After this render pass, we'll restart
38283828
// and apply the stashed updates on top of the work-in-progress hook.
3829-
didScheduleRenderPhaseUpdateDuringThisPass = didScheduleRenderPhaseUpdate =
3830-
true;
3829+
didScheduleRenderPhaseUpdateDuringThisPass =
3830+
didScheduleRenderPhaseUpdate = true;
38313831
const pending = queue.pending;
38323832
if (pending === null) {
38333833
// This is the first update. Create a circular list.

scripts/rollup/shims/react-native/ReactNativeViewConfigRegistry.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -16,16 +16,16 @@ import invariant from 'invariant';
1616

1717
// Event configs
1818
export const customBubblingEventTypes: {
19-
[eventName: string]: $ReadOnly<{
20-
phasedRegistrationNames: $ReadOnly<{
19+
[eventName: string]: Readonly<{
20+
phasedRegistrationNames: Readonly<{
2121
captured: string,
2222
bubbled: string,
2323
skipBubbling?: ?boolean,
2424
}>,
2525
}>,
2626
} = {};
2727
export const customDirectEventTypes: {
28-
[eventName: string]: $ReadOnly<{
28+
[eventName: string]: Readonly<{
2929
registrationName: string,
3030
}>,
3131
} = {};

0 commit comments

Comments
 (0)