diff --git a/IntegrationTests/AccessibilityManagerTest.js b/IntegrationTests/AccessibilityManagerTest.js index f23972f25da..e68cd5bb682 100644 --- a/IntegrationTests/AccessibilityManagerTest.js +++ b/IntegrationTests/AccessibilityManagerTest.js @@ -16,7 +16,7 @@ import * as React from 'react'; const {TestModule} = NativeModules; class AccessibilityManagerTest extends React.Component<{...}> { - componentDidMount() { + componentDidMount(): void { invariant( NativeAccessibilityManager, "NativeAccessibilityManager doesn't exist", diff --git a/IntegrationTests/GlobalEvalWithSourceUrlTest.js b/IntegrationTests/GlobalEvalWithSourceUrlTest.js index dd3206f3c9a..6b1d83ed765 100644 --- a/IntegrationTests/GlobalEvalWithSourceUrlTest.js +++ b/IntegrationTests/GlobalEvalWithSourceUrlTest.js @@ -20,7 +20,7 @@ const {View} = ReactNative; const {TestModule} = ReactNative.NativeModules; class GlobalEvalWithSourceUrlTest extends React.Component<{...}> { - componentDidMount() { + componentDidMount(): void { if (typeof global.globalEvalWithSourceUrl !== 'function') { throw new Error( 'Expected to find globalEvalWithSourceUrl function on global object but found ' + diff --git a/IntegrationTests/ImageSnapshotTest.js b/IntegrationTests/ImageSnapshotTest.js index 0d6aa3bb67f..62895ae33e7 100644 --- a/IntegrationTests/ImageSnapshotTest.js +++ b/IntegrationTests/ImageSnapshotTest.js @@ -16,7 +16,7 @@ const {Image} = ReactNative; const {TestModule} = ReactNative.NativeModules; class ImageSnapshotTest extends React.Component<{...}> { - componentDidMount() { + componentDidMount(): void { if (!TestModule.verifySnapshot) { throw new Error('TestModule.verifySnapshot not defined.'); } diff --git a/IntegrationTests/IntegrationTestsApp.js b/IntegrationTests/IntegrationTestsApp.js index bb8efcbcd49..6c3994e63b6 100644 --- a/IntegrationTests/IntegrationTestsApp.js +++ b/IntegrationTests/IntegrationTestsApp.js @@ -46,11 +46,11 @@ require('./LoggingTestModule'); type Test = any; class IntegrationTestsApp extends React.Component<{...}, $FlowFixMeState> { - state = { + state: {test: ?Test} = { test: (null: ?Test), }; - render() { + render(): React.Node { if (this.state.test) { return ( diff --git a/IntegrationTests/SimpleSnapshotTest.js b/IntegrationTests/SimpleSnapshotTest.js index 27e5d2c12d5..347de5c815d 100644 --- a/IntegrationTests/SimpleSnapshotTest.js +++ b/IntegrationTests/SimpleSnapshotTest.js @@ -17,7 +17,7 @@ const {StyleSheet, View} = ReactNative; const {TestModule} = ReactNative.NativeModules; class SimpleSnapshotTest extends React.Component<{...}> { - componentDidMount() { + componentDidMount(): void { if (!TestModule.verifySnapshot) { throw new Error('TestModule.verifySnapshot not defined.'); } diff --git a/IntegrationTests/SyncMethodTest.js b/IntegrationTests/SyncMethodTest.js index febe0215437..ab5166c057e 100644 --- a/IntegrationTests/SyncMethodTest.js +++ b/IntegrationTests/SyncMethodTest.js @@ -17,7 +17,7 @@ const {View} = ReactNative; const {TestModule, RNTesterTestModule} = ReactNative.NativeModules; class SyncMethodTest extends React.Component<{...}> { - componentDidMount() { + componentDidMount(): void { if ( RNTesterTestModule.echoString('test string value') !== 'test string value' ) { diff --git a/IntegrationTests/TimersTest.js b/IntegrationTests/TimersTest.js index 64b3f1233b6..04496e0a943 100644 --- a/IntegrationTests/TimersTest.js +++ b/IntegrationTests/TimersTest.js @@ -253,7 +253,7 @@ class TimersTest extends React.Component { ); } - _incrementInterval() { + _incrementInterval(): void { if (this.state.count > 3) { throw new Error('interval incremented past end.'); } diff --git a/IntegrationTests/WebSocketTest.js b/IntegrationTests/WebSocketTest.js index 6fbcbfb6cd8..648478bacf1 100644 --- a/IntegrationTests/WebSocketTest.js +++ b/IntegrationTests/WebSocketTest.js @@ -69,11 +69,11 @@ class WebSocketTest extends React.Component<{...}, State> { }); }; - _socketIsConnected = () => { + _socketIsConnected = (): boolean => { return this.state.socketState === 1; //'OPEN' }; - _socketIsDisconnected = () => { + _socketIsDisconnected = (): boolean => { return this.state.socketState === 3; //'CLOSED' }; @@ -106,7 +106,7 @@ class WebSocketTest extends React.Component<{...}, State> { this._sendText(this.state.testMessage); }; - _receivedTestExpectedResponse = () => { + _receivedTestExpectedResponse = (): boolean => { return this.state.lastMessage === this.state.testExpectedResponse; }; diff --git a/Libraries/Animated/AnimatedEvent.js b/Libraries/Animated/AnimatedEvent.js index af1d660a8de..c1b221fbf70 100644 --- a/Libraries/Animated/AnimatedEvent.js +++ b/Libraries/Animated/AnimatedEvent.js @@ -177,7 +177,7 @@ class AnimatedEvent { this._listeners = this._listeners.filter(listener => listener !== callback); } - __attach(viewRef: any, eventName: string) { + __attach(viewRef: any, eventName: string): void { invariant( this.__isNative, 'Only native driven events need to be attached.', @@ -191,7 +191,7 @@ class AnimatedEvent { ); } - __detach(viewTag: any, eventName: string) { + __detach(viewTag: any, eventName: string): void { invariant( this.__isNative, 'Only native driven events need to be detached.', diff --git a/Libraries/Animated/createAnimatedComponent.js b/Libraries/Animated/createAnimatedComponent.js index c9dbe808ed7..be43a6ba656 100644 --- a/Libraries/Animated/createAnimatedComponent.js +++ b/Libraries/Animated/createAnimatedComponent.js @@ -140,7 +140,7 @@ function createAnimatedComponent( // components. If you want to animate a composite component, you need to // re-render it. In this case, we have a fallback that uses forceUpdate. // This fallback is also called in Fabric. - _animatedPropsCallback = () => { + _animatedPropsCallback = (): void => { if (this._component == null) { // AnimatedProps is created in will-mount because it's used in render. // But this callback may be invoked before mount in async mode, @@ -192,7 +192,7 @@ function createAnimatedComponent( } } - _setComponentRef = setAndForwardRef({ + _setComponentRef: (ref: React.ElementRef) => void = setAndForwardRef({ getForwardedRef: () => this.props.forwardedRef, setLocalRef: ref => { this._prevComponent = this._component; @@ -200,7 +200,7 @@ function createAnimatedComponent( }, }); - render() { + render(): React.Node { const animatedProps = this._propsAnimated.__getValue(this._initialAnimatedProps) || {}; const {style = {}, ...props} = animatedProps; diff --git a/Libraries/Animated/nodes/AnimatedNode.js b/Libraries/Animated/nodes/AnimatedNode.js index b4a649ff302..159bf819a4a 100644 --- a/Libraries/Animated/nodes/AnimatedNode.js +++ b/Libraries/Animated/nodes/AnimatedNode.js @@ -53,7 +53,7 @@ class AnimatedNode { this._listeners = {}; } - __makeNative(platformConfig: ?PlatformConfig) { + __makeNative(platformConfig: ?PlatformConfig): void { if (!this.__isNative) { throw new Error('This node cannot be made a "native" animated node'); } diff --git a/Libraries/Animated/nodes/AnimatedStyle.js b/Libraries/Animated/nodes/AnimatedStyle.js index c64706a8158..7ec61c77ce4 100644 --- a/Libraries/Animated/nodes/AnimatedStyle.js +++ b/Libraries/Animated/nodes/AnimatedStyle.js @@ -34,7 +34,10 @@ class AnimatedStyle extends AnimatedWithChildren { } // Recursively get values for nested styles (like iOS's shadowOffset) - _walkStyleAndGetValues(style: any, initialStyle: ?Object) { + _walkStyleAndGetValues( + style: any, + initialStyle: ?Object, + ): {[string]: any | {...}} { const updatedStyle: {[string]: any | {...}} = {}; for (const key in style) { const value = style[key]; @@ -63,7 +66,7 @@ class AnimatedStyle extends AnimatedWithChildren { } // Recursively get animated values for nested styles (like iOS's shadowOffset) - _walkStyleAndGetAnimatedValues(style: any) { + _walkStyleAndGetAnimatedValues(style: any): {[string]: any | {...}} { const updatedStyle: {[string]: any | {...}} = {}; for (const key in style) { const value = style[key]; diff --git a/Libraries/BatchedBridge/MessageQueue.js b/Libraries/BatchedBridge/MessageQueue.js index bfe3e0c0821..2e461a0ce2f 100644 --- a/Libraries/BatchedBridge/MessageQueue.js +++ b/Libraries/BatchedBridge/MessageQueue.js @@ -241,7 +241,7 @@ class MessageQueue { params: mixed[], onFail: ?(...mixed[]) => void, onSucc: ?(...mixed[]) => void, - ) { + ): void { this.processCallbacks(moduleID, methodID, params, onFail, onSucc); this._queue[MODULE_IDS].push(moduleID); @@ -427,7 +427,7 @@ class MessageQueue { Systrace.endEvent(); } - __invokeCallback(cbID: number, args: mixed[]) { + __invokeCallback(cbID: number, args: mixed[]): void { this._lastFlush = Date.now(); this._eventLoopStartTime = this._lastFlush; diff --git a/Libraries/Blob/FileReader.js b/Libraries/Blob/FileReader.js index c0b7feaec71..1e3ea21b87f 100644 --- a/Libraries/Blob/FileReader.js +++ b/Libraries/Blob/FileReader.js @@ -73,11 +73,11 @@ class FileReader extends (EventTarget(...READER_EVENTS): any) { } } - readAsArrayBuffer() { + readAsArrayBuffer(): any { throw new Error('FileReader.readAsArrayBuffer is not implemented'); } - readAsDataURL(blob: ?Blob) { + readAsDataURL(blob: ?Blob): void { this._aborted = false; if (blob == null) { @@ -104,7 +104,7 @@ class FileReader extends (EventTarget(...READER_EVENTS): any) { ); } - readAsText(blob: ?Blob, encoding: string = 'UTF-8') { + readAsText(blob: ?Blob, encoding: string = 'UTF-8'): void { this._aborted = false; if (blob == null) { diff --git a/Libraries/Blob/URL.js b/Libraries/Blob/URL.js index 77b4d7f94d6..62a67349693 100644 --- a/Libraries/Blob/URL.js +++ b/Libraries/Blob/URL.js @@ -54,7 +54,7 @@ if ( // Small subset from whatwg-url: https://github.com/jsdom/whatwg-url/tree/master/src // The reference code bloat comes from Unicode issues with URLs, so those won't work here. export class URLSearchParams { - _searchParams = []; + _searchParams: Array> = []; constructor(params: any) { if (typeof params === 'object') { @@ -62,35 +62,36 @@ export class URLSearchParams { } } - append(key: string, value: string) { + append(key: string, value: string): void { this._searchParams.push([key, value]); } - delete(name: string) { + delete(name: string): void { throw new Error('URLSearchParams.delete is not implemented'); } - get(name: string) { + get(name: string): void { throw new Error('URLSearchParams.get is not implemented'); } - getAll(name: string) { + getAll(name: string): void { throw new Error('URLSearchParams.getAll is not implemented'); } - has(name: string) { + has(name: string): void { throw new Error('URLSearchParams.has is not implemented'); } - set(name: string, value: string) { + set(name: string, value: string): void { throw new Error('URLSearchParams.set is not implemented'); } - sort() { + sort(): void { throw new Error('URLSearchParams.sort is not implemented'); } // $FlowFixMe[unsupported-syntax] + // $FlowFixMe[missing-local-annot] [Symbol.iterator]() { return this._searchParams[Symbol.iterator](); } diff --git a/Libraries/Components/ScrollView/ScrollView.js b/Libraries/Components/ScrollView/ScrollView.js index b268c65c2b5..1d494f228bf 100644 --- a/Libraries/Components/ScrollView/ScrollView.js +++ b/Libraries/Components/ScrollView/ScrollView.js @@ -825,7 +825,7 @@ class ScrollView extends React.Component { } } - _setNativeRef = setAndForwardRef({ + _setNativeRef: $FlowFixMe = setAndForwardRef({ getForwardedRef: () => this.props.scrollViewRef, setLocalRef: ref => { this._scrollViewRef = ref; @@ -1107,7 +1107,7 @@ class ScrollView extends React.Component { } }; - _getKeyForIndex(index: $FlowFixMe, childArray: $FlowFixMe) { + _getKeyForIndex(index: $FlowFixMe, childArray: $FlowFixMe): $FlowFixMe { const child = childArray[index]; return child && child.key; } @@ -1204,7 +1204,7 @@ class ScrollView extends React.Component { _scrollViewRef: ?React.ElementRef> = null; _innerViewRef: ?React.ElementRef = null; - _setInnerViewRef = setAndForwardRef({ + _setInnerViewRef: $FlowFixMe = setAndForwardRef({ getForwardedRef: () => this.props.innerViewRef, setLocalRef: ref => { this._innerViewRef = ref; diff --git a/Libraries/Components/StatusBar/StatusBar.js b/Libraries/Components/StatusBar/StatusBar.js index e07389c9723..813146ddfdf 100644 --- a/Libraries/Components/StatusBar/StatusBar.js +++ b/Libraries/Components/StatusBar/StatusBar.js @@ -223,9 +223,9 @@ function createStackEntry(props: any): any { * `currentHeight` (Android only) The height of the status bar. */ class StatusBar extends React.Component { - static _propsStack = []; + static _propsStack: Array = []; - static _defaultProps = createStackEntry({ + static _defaultProps: any = createStackEntry({ backgroundColor: Platform.OS === 'android' ? NativeStatusBarManagerAndroid.getConstants() @@ -309,7 +309,7 @@ class StatusBar extends React.Component { * @param color Background color. * @param animated Animate the style change. */ - static setBackgroundColor(color: string, animated?: boolean) { + static setBackgroundColor(color: string, animated?: boolean): void { if (Platform.OS !== 'android') { console.warn('`setBackgroundColor` is only available on Android'); return; diff --git a/Libraries/Inspector/BoxInspector.js b/Libraries/Inspector/BoxInspector.js index 1cc41c17380..f1e48a9f13d 100644 --- a/Libraries/Inspector/BoxInspector.js +++ b/Libraries/Inspector/BoxInspector.js @@ -49,7 +49,7 @@ class BoxInspector extends React.Component<$FlowFixMeProps> { } class BoxContainer extends React.Component<$FlowFixMeProps> { - render() { + render(): React.Node { const box = this.props.box; return ( diff --git a/Libraries/Inspector/InspectorPanel.js b/Libraries/Inspector/InspectorPanel.js index b708912a9fd..cce08cd849d 100644 --- a/Libraries/Inspector/InspectorPanel.js +++ b/Libraries/Inspector/InspectorPanel.js @@ -120,7 +120,7 @@ type InspectorPanelButtonProps = $ReadOnly<{| |}>; class InspectorPanelButton extends React.Component { - render() { + render(): React.Node { return ( this.props.onClick(!this.props.pressed)} diff --git a/Libraries/Inspector/NetworkOverlay.js b/Libraries/Inspector/NetworkOverlay.js index 79f2f301a43..b2267657666 100644 --- a/Libraries/Inspector/NetworkOverlay.js +++ b/Libraries/Inspector/NetworkOverlay.js @@ -95,7 +95,11 @@ class NetworkOverlay extends React.Component { // scroll to the bottom as new network requests come in, or if the user has // intentionally scrolled away from the bottom - to instead flash the scroll bar // and keep the current position - _requestsListViewScrollMetrics = { + _requestsListViewScrollMetrics: { + contentLength: number, + offset: number, + visibleLength: number, + } = { offset: 0, visibleLength: 0, contentLength: 0, @@ -363,7 +367,7 @@ class NetworkOverlay extends React.Component { ); }; - _renderItemDetail(id: number) { + _renderItemDetail(id: number): React.Node { const requestItem = this.state.requests[id]; const details = Object.keys(requestItem).map(key => { if (key === 'id') { diff --git a/Libraries/Linking/Linking.js b/Libraries/Linking/Linking.js index 63575220f57..887e1867820 100644 --- a/Libraries/Linking/Linking.js +++ b/Libraries/Linking/Linking.js @@ -123,7 +123,7 @@ class Linking extends NativeEventEmitter { } } - _validateURL(url: string) { + _validateURL(url: string): void { invariant( typeof url === 'string', 'Invalid URL: should be a string. Was: ' + url, diff --git a/Libraries/Lists/CellRenderMask.js b/Libraries/Lists/CellRenderMask.js index fe4097f7c81..6258838c116 100644 --- a/Libraries/Lists/CellRenderMask.js +++ b/Libraries/Lists/CellRenderMask.js @@ -45,7 +45,7 @@ export class CellRenderMask { return this._regions; } - addCells(cells: {first: number, last: number}) { + addCells(cells: {first: number, last: number}): void { invariant( cells.first >= 0 && cells.first < this._numCells && diff --git a/Libraries/Lists/FillRateHelper.js b/Libraries/Lists/FillRateHelper.js index 9327f465180..746b5fa0d06 100644 --- a/Libraries/Lists/FillRateHelper.js +++ b/Libraries/Lists/FillRateHelper.js @@ -49,12 +49,12 @@ let _sampleRate = DEBUG ? 1 : null; * `SceneTracker.getActiveScene` to determine the context of the events. */ class FillRateHelper { - _anyBlankStartTime = (null: ?number); + _anyBlankStartTime: ?number = null; _enabled = false; _getFrameMetrics: (index: number, props: FrameMetricProps) => ?FrameMetrics; - _info = new Info(); - _mostlyBlankStartTime = (null: ?number); - _samplesStartTime = (null: ?number); + _info: Info = new Info(); + _mostlyBlankStartTime: ?number = null; + _samplesStartTime: ?number = null; static addListener(callback: FillRateInfo => void): { remove: () => void, diff --git a/Libraries/LogBox/Data/LogBoxData.js b/Libraries/LogBox/Data/LogBoxData.js index 1fb9d59bbec..da14a2c31e1 100644 --- a/Libraries/LogBox/Data/LogBoxData.js +++ b/Libraries/LogBox/Data/LogBoxData.js @@ -401,7 +401,7 @@ export function withSubscription( WrappedComponent: SubscribedComponent, ): React.AbstractComponent<{||}> { class LogBoxStateSubscription extends React.Component { - static getDerivedStateFromError() { + static getDerivedStateFromError(): {hasError: boolean} { return {hasError: true}; } @@ -413,7 +413,7 @@ export function withSubscription( _subscription: ?Subscription; - state = { + state: State = { logs: new Set(), isDisabled: false, hasError: false, diff --git a/Libraries/PushNotificationIOS/PushNotificationIOS.js b/Libraries/PushNotificationIOS/PushNotificationIOS.js index 268f7e9c15b..3e62ddc2232 100644 --- a/Libraries/PushNotificationIOS/PushNotificationIOS.js +++ b/Libraries/PushNotificationIOS/PushNotificationIOS.js @@ -118,7 +118,7 @@ class PushNotificationIOS { * * See https://reactnative.dev/docs/pushnotificationios#presentlocalnotification */ - static presentLocalNotification(details: Object) { + static presentLocalNotification(details: Object): void { invariant( NativePushNotificationManagerIOS, 'PushNotificationManager is not available.', @@ -131,7 +131,7 @@ class PushNotificationIOS { * * See https://reactnative.dev/docs/pushnotificationios#schedulelocalnotification */ - static scheduleLocalNotification(details: Object) { + static scheduleLocalNotification(details: Object): void { invariant( NativePushNotificationManagerIOS, 'PushNotificationManager is not available.', @@ -144,7 +144,7 @@ class PushNotificationIOS { * * See https://reactnative.dev/docs/pushnotificationios#cancelalllocalnotifications */ - static cancelAllLocalNotifications() { + static cancelAllLocalNotifications(): void { invariant( NativePushNotificationManagerIOS, 'PushNotificationManager is not available.', @@ -198,7 +198,7 @@ class PushNotificationIOS { * * See https://reactnative.dev/docs/pushnotificationios#setapplicationiconbadgenumber */ - static setApplicationIconBadgeNumber(number: number) { + static setApplicationIconBadgeNumber(number: number): void { invariant( NativePushNotificationManagerIOS, 'PushNotificationManager is not available.', @@ -211,7 +211,7 @@ class PushNotificationIOS { * * See https://reactnative.dev/docs/pushnotificationios#getapplicationiconbadgenumber */ - static getApplicationIconBadgeNumber(callback: Function) { + static getApplicationIconBadgeNumber(callback: Function): void { invariant( NativePushNotificationManagerIOS, 'PushNotificationManager is not available.', @@ -224,7 +224,7 @@ class PushNotificationIOS { * * See https://reactnative.dev/docs/pushnotificationios#cancellocalnotification */ - static cancelLocalNotifications(userInfo: Object) { + static cancelLocalNotifications(userInfo: Object): void { invariant( NativePushNotificationManagerIOS, 'PushNotificationManager is not available.', @@ -237,7 +237,7 @@ class PushNotificationIOS { * * See https://reactnative.dev/docs/pushnotificationios#getscheduledlocalnotifications */ - static getScheduledLocalNotifications(callback: Function) { + static getScheduledLocalNotifications(callback: Function): void { invariant( NativePushNotificationManagerIOS, 'PushNotificationManager is not available.', @@ -251,7 +251,10 @@ class PushNotificationIOS { * * See https://reactnative.dev/docs/pushnotificationios#addeventlistener */ - static addEventListener(type: PushNotificationEventName, handler: Function) { + static addEventListener( + type: PushNotificationEventName, + handler: Function, + ): void { invariant( type === 'notification' || type === 'register' || @@ -301,7 +304,7 @@ class PushNotificationIOS { static removeEventListener( type: PushNotificationEventName, handler: Function, - ) { + ): void { invariant( type === 'notification' || type === 'register' || @@ -362,7 +365,7 @@ class PushNotificationIOS { * * See https://reactnative.dev/docs/pushnotificationios#abandonpermissions */ - static abandonPermissions() { + static abandonPermissions(): void { invariant( NativePushNotificationManagerIOS, 'PushNotificationManager is not available.', @@ -376,7 +379,7 @@ class PushNotificationIOS { * * See https://reactnative.dev/docs/pushnotificationios#checkpermissions */ - static checkPermissions(callback: Function) { + static checkPermissions(callback: Function): void { invariant(typeof callback === 'function', 'Must provide a valid callback'); invariant( NativePushNotificationManagerIOS, @@ -463,7 +466,7 @@ class PushNotificationIOS { * * See https://reactnative.dev/docs/pushnotificationios#finish */ - finish(fetchResult: string) { + finish(fetchResult: string): void { if ( !this._isRemote || !this._notificationId || diff --git a/Libraries/Utilities/__tests__/setAndForwardRef-test.js b/Libraries/Utilities/__tests__/setAndForwardRef-test.js index 51c493dad3c..4e0500348f3 100644 --- a/Libraries/Utilities/__tests__/setAndForwardRef-test.js +++ b/Libraries/Utilities/__tests__/setAndForwardRef-test.js @@ -21,12 +21,12 @@ describe('setAndForwardRef', () => { let outerFuncCalled: ?boolean = false; class ForwardedComponent extends React.Component<{||}> { - testFunc() { + testFunc(): any { innerFuncCalled = true; return true; } - render() { + render(): any { return null; } } @@ -38,7 +38,7 @@ describe('setAndForwardRef', () => { class TestComponent extends React.Component { _nativeRef: ?React.ElementRef = null; - _setNativeRef = setAndForwardRef({ + _setNativeRef: (ref: React.ElementRef) => void = setAndForwardRef({ getForwardedRef: () => this.props.forwardedRef, setLocalRef: ref => { this._nativeRef = ref; @@ -51,7 +51,7 @@ describe('setAndForwardRef', () => { } } - render() { + render(): React.Node { return ; } } @@ -111,7 +111,7 @@ describe('setAndForwardRef', () => { /* eslint-enable react/no-string-refs */ } - render() { + render(): React.Node { /** * Can't directly pass the test component to `ReactTestRenderer.create`, * otherwise it will throw. See: diff --git a/Libraries/Utilities/__tests__/useMergeRefs-test.js b/Libraries/Utilities/__tests__/useMergeRefs-test.js index 06d0658cf6c..5432d04e02e 100644 --- a/Libraries/Utilities/__tests__/useMergeRefs-test.js +++ b/Libraries/Utilities/__tests__/useMergeRefs-test.js @@ -40,7 +40,7 @@ class TestViewInstance { return testID == null ? null : new TestViewInstance(testID); } - static named(name: string) { + static named(name: string): $FlowFixMe { // $FlowIssue[prop-missing] - Flow does not support type augmentation. return expect.testViewInstance(name); } diff --git a/Libraries/Utilities/__tests__/useRefEffect-test.js b/Libraries/Utilities/__tests__/useRefEffect-test.js index dc5bb882084..7f9388f387d 100644 --- a/Libraries/Utilities/__tests__/useRefEffect-test.js +++ b/Libraries/Utilities/__tests__/useRefEffect-test.js @@ -45,7 +45,7 @@ class TestEffect { this.name = name; this.key = key; } - static called(name: string, key: ?string) { + static called(name: string, key: ?string): $FlowFixMe { // $FlowIssue[prop-missing] - Flow does not support type augmentation. return expect.effect(name, key); } @@ -61,7 +61,7 @@ class TestEffectCleanup { this.name = name; this.key = key; } - static called(name: string, key: ?string) { + static called(name: string, key: ?string): $FlowFixMe { // $FlowIssue[prop-missing] - Flow does not support type augmentation. return expect.effectCleanup(name, key); } diff --git a/Libraries/Utilities/createPerformanceLogger.js b/Libraries/Utilities/createPerformanceLogger.js index 82307f47f20..0b0c2d8ee61 100644 --- a/Libraries/Utilities/createPerformanceLogger.js +++ b/Libraries/Utilities/createPerformanceLogger.js @@ -137,31 +137,31 @@ class PerformanceLogger implements IPerformanceLogger { this._closed = true; } - currentTimestamp() { + currentTimestamp(): number { return getCurrentTimestamp(); } - getExtras() { + getExtras(): {[key: string]: ?ExtraValue} { return this._extras; } - getPoints() { + getPoints(): {[key: string]: ?number} { return this._points; } - getPointExtras() { + getPointExtras(): {[key: string]: ?Extras} { return this._pointExtras; } - getTimespans() { + getTimespans(): {[key: string]: ?Timespan} { return this._timespans; } - hasTimespan(key: string) { + hasTimespan(key: string): boolean { return !!this._timespans[key]; } - isClosed() { + isClosed(): boolean { return this._closed; } diff --git a/ReactAndroid/src/androidTest/js/ScrollViewTestModule.js b/ReactAndroid/src/androidTest/js/ScrollViewTestModule.js index 50a8b3c8bfa..4808118ed89 100644 --- a/ReactAndroid/src/androidTest/js/ScrollViewTestModule.js +++ b/ReactAndroid/src/androidTest/js/ScrollViewTestModule.js @@ -43,7 +43,7 @@ type ItemProps = $ReadOnly<{| type ItemState = {||}; class Item extends React.Component { - render() { + render(): React.Node { return ( diff --git a/ReactAndroid/src/androidTest/js/UIManagerTestModule.js b/ReactAndroid/src/androidTest/js/UIManagerTestModule.js index e51d10721ed..658953786a9 100644 --- a/ReactAndroid/src/androidTest/js/UIManagerTestModule.js +++ b/ReactAndroid/src/androidTest/js/UIManagerTestModule.js @@ -20,7 +20,7 @@ import type {RootTag} from 'react-native/Libraries/Types/RootTagTypes'; type FlexTestAppProps = $ReadOnly<{||}>; class FlexTestApp extends React.Component { - render() { + render(): React.Node { return ( ; class FlexWithText extends React.Component { - render() { + render(): React.Node { return ( ; class AbsolutePositionTestApp extends React.Component { - render() { + render(): React.Node { return ( ; class AbsolutePositionBottomRightTestApp extends React.Component { - render() { + render(): React.Node { return ( ; class CenteredTextView extends React.Component { - render() { + render(): React.Node { return ( @@ -184,7 +184,7 @@ class UpdatePositionInListTestApp extends React.Component< UpdatePositionInListTestAppProps, UpdatePositionInListTestAppState, > { - state = { + state: UpdatePositionInListTestAppState = { active: false, }; @@ -195,7 +195,7 @@ class UpdatePositionInListTestApp extends React.Component< flushUpdatePositionInList = () => this.setState({active: true}); } - render() { + render(): React.Node { return ( { - render() { + render(): Node { return ( { class ExamplePage extends React.Component<{...}> { - render() { + render(): React.Node { return ; } } diff --git a/packages/rn-tester/js/examples/Accessibility/AccessibilityExample.js b/packages/rn-tester/js/examples/Accessibility/AccessibilityExample.js index d4b14b5b785..447ef69dcb5 100644 --- a/packages/rn-tester/js/examples/Accessibility/AccessibilityExample.js +++ b/packages/rn-tester/js/examples/Accessibility/AccessibilityExample.js @@ -223,7 +223,7 @@ class CheckboxExample extends React.Component< checkboxState: boolean | 'mixed', }, > { - state = { + state: {checkboxState: boolean | 'mixed'} = { checkboxState: true, }; @@ -242,7 +242,7 @@ class CheckboxExample extends React.Component< }); }; - render() { + render(): React.Node { return ( { - state = { + state: {switchState: boolean} = { switchState: true, }; @@ -274,7 +274,7 @@ class SwitchExample extends React.Component< }); }; - render() { + render(): React.Node { return ( | null, }; - state = { + state: {isEnabled: boolean, isSelected: boolean} = { isSelected: true, isEnabled: false, }; @@ -375,7 +375,7 @@ class ExpandableElementExample extends React.Component< expandState: boolean, }, > { - state = { + state: {expandState: boolean} = { expandState: false, }; @@ -387,7 +387,7 @@ class ExpandableElementExample extends React.Component< }); }; - render() { + render(): React.Node { return ( { - state = { + state: { + checkbox1: boolean | 'mixed', + checkbox2: boolean | 'mixed', + checkbox3: boolean | 'mixed', + } = { checkbox1: false, checkbox2: false, checkbox3: false, @@ -460,7 +464,7 @@ class NestedCheckBox extends React.Component< }); }; - render() { + render(): React.Node { return ( { } class AnnounceForAccessibility extends React.Component<{}> { - _handleOnPress = () => + _handleOnPress = (): TimeoutID => setTimeout( () => AccessibilityInfo.announceForAccessibility('Announcement Test'), 1000, ); - _handleOnPressQueued = () => + _handleOnPressQueued = (): TimeoutID => setTimeout( () => AccessibilityInfo.announceForAccessibilityWithOptions( @@ -1052,11 +1056,11 @@ class EnabledExample extends React.Component< isEnabled: boolean, }, > { - state = { + state: {isEnabled: boolean} = { isEnabled: false, }; _subscription: EventSubscription; - componentDidMount() { + componentDidMount(): null | Promise { this._subscription = AccessibilityInfo.addEventListener( this.props.eventListener, this._handleToggled, diff --git a/packages/rn-tester/js/examples/Accessibility/AccessibilityIOSExample.js b/packages/rn-tester/js/examples/Accessibility/AccessibilityIOSExample.js index b8572b3fb98..a401d6dae73 100644 --- a/packages/rn-tester/js/examples/Accessibility/AccessibilityIOSExample.js +++ b/packages/rn-tester/js/examples/Accessibility/AccessibilityIOSExample.js @@ -17,7 +17,7 @@ const RNTesterBlock = require('../../components/RNTesterBlock'); type Props = $ReadOnly<{||}>; class AccessibilityIOSExample extends React.Component { - render() { + render(): React.Node { return ( ; type State = {|clicked: string|}; class ActionSheetExample extends React.Component { - state = { + state: State = { clicked: 'none', }; - render() { + render(): React.Node { return ( @@ -62,11 +64,11 @@ class ActionSheetTintExample extends React.Component< $FlowFixMeProps, $FlowFixMeState, > { - state = { + state: any | {clicked: string} = { clicked: 'none', }; - render() { + render(): React.Node { return ( @@ -96,11 +98,11 @@ class ActionSheetCancelButtonTintExample extends React.Component< $FlowFixMeProps, $FlowFixMeState, > { - state = { + state: any | {clicked: string} = { clicked: 'none', }; - render() { + render(): React.Node { return ( @@ -131,13 +133,13 @@ class ActionSheetAnchorExample extends React.Component< $FlowFixMeProps, $FlowFixMeState, > { - state = { + state: any | {clicked: string} = { clicked: 'none', }; - anchorRef = React.createRef(); + anchorRef: {current: null | $Exact} = React.createRef(); - render() { + render(): React.Node { return ( @@ -174,11 +176,11 @@ class ActionSheetAnchorExample extends React.Component< } class ActionSheetDisabledExample extends React.Component { - state = { + state: State = { clicked: 'none', }; - render() { + render(): React.Node { return ( @@ -205,7 +207,7 @@ class ActionSheetDisabledExample extends React.Component { } class ActionSheetDismissExample extends React.Component<{...}> { - render() { + render(): React.Node { return ( @@ -236,11 +238,11 @@ class ShareActionSheetExample extends React.Component< $FlowFixMeProps, $FlowFixMeState, > { - state = { + state: any | {text: string} = { text: '', }; - render() { + render(): React.Node { return ( @@ -277,11 +279,11 @@ class ShareScreenshotExample extends React.Component< $FlowFixMeProps, $FlowFixMeState, > { - state = { + state: any | {text: string} = { text: '', }; - render() { + render(): React.Node { return ( @@ -322,13 +324,13 @@ class ShareScreenshotAnchorExample extends React.Component< $FlowFixMeProps, $FlowFixMeState, > { - state = { + state: any | {text: string} = { text: '', }; - anchorRef = React.createRef(); + anchorRef: {current: null | $Exact} = React.createRef(); - render() { + render(): React.Node { return ( diff --git a/packages/rn-tester/js/examples/Alert/AlertIOSExample.js b/packages/rn-tester/js/examples/Alert/AlertIOSExample.js index 47d79639356..7f0e19724fd 100644 --- a/packages/rn-tester/js/examples/Alert/AlertIOSExample.js +++ b/packages/rn-tester/js/examples/Alert/AlertIOSExample.js @@ -53,7 +53,7 @@ class PromptOptions extends React.Component { }; } - render() { + render(): React.Node { return ( diff --git a/packages/rn-tester/js/examples/AppState/AppStateExample.js b/packages/rn-tester/js/examples/AppState/AppStateExample.js index bca42f66272..5357f57c1c9 100644 --- a/packages/rn-tester/js/examples/AppState/AppStateExample.js +++ b/packages/rn-tester/js/examples/AppState/AppStateExample.js @@ -21,7 +21,12 @@ class AppStateSubscription extends React.Component< $FlowFixMeProps, $FlowFixMeState, > { - state = { + state: { + appState: ?string, + eventsDetected: Array, + memoryWarnings: number, + previousAppStates: Array, + } = { appState: AppState.currentState, previousAppStates: [], memoryWarnings: 0, @@ -76,7 +81,7 @@ class AppStateSubscription extends React.Component< }); }; - render() { + render(): React.Node { if (this.props.showMemoryWarnings) { return ( diff --git a/packages/rn-tester/js/examples/Appearance/AppearanceExample.js b/packages/rn-tester/js/examples/Appearance/AppearanceExample.js index 601bcdf7fbf..9272c6ab6c0 100644 --- a/packages/rn-tester/js/examples/Appearance/AppearanceExample.js +++ b/packages/rn-tester/js/examples/Appearance/AppearanceExample.js @@ -20,7 +20,7 @@ class ColorSchemeSubscription extends React.Component< > { _subscription: ?EventSubscription; - state = { + state: {colorScheme: ?string, ...} = { colorScheme: Appearance.getColorScheme(), }; @@ -37,7 +37,7 @@ class ColorSchemeSubscription extends React.Component< this._subscription?.remove(); } - render() { + render(): React.Node { return ( {theme => { diff --git a/packages/rn-tester/js/examples/Dimensions/DimensionsExample.js b/packages/rn-tester/js/examples/Dimensions/DimensionsExample.js index e8b8554b2aa..008ae41cc9c 100644 --- a/packages/rn-tester/js/examples/Dimensions/DimensionsExample.js +++ b/packages/rn-tester/js/examples/Dimensions/DimensionsExample.js @@ -16,7 +16,7 @@ class DimensionsSubscription extends React.Component< {dim: string, ...}, {dims: Object, ...}, > { - state = { + state: {dims: any, ...} = { dims: Dimensions.get(this.props.dim), }; @@ -37,7 +37,7 @@ class DimensionsSubscription extends React.Component< this._dimensionsSubscription?.remove(); } - render() { + render(): React.Node { return {JSON.stringify(this.state.dims, null, 2)}; } } diff --git a/packages/rn-tester/js/examples/Image/ImageExample.js b/packages/rn-tester/js/examples/Image/ImageExample.js index eacc26ec275..729673c65b7 100644 --- a/packages/rn-tester/js/examples/Image/ImageExample.js +++ b/packages/rn-tester/js/examples/Image/ImageExample.js @@ -43,7 +43,7 @@ type BlobImageProps = $ReadOnly<{| |}>; class BlobImage extends React.Component { - state = { + state: BlobImageState = { objectURL: null, }; @@ -56,7 +56,7 @@ class BlobImage extends React.Component { })(); } - render() { + render(): React.Node { return this.state.objectURL !== null ? ( ) : ( @@ -75,7 +75,7 @@ class BlobImageExample extends React.Component< BlobImageExampleProps, BlobImageExampleState, > { - render() { + render(): React.Node { return ( {this.props.urls.map(url => ( @@ -102,7 +102,7 @@ class NetworkImageCallbackExample extends React.Component< NetworkImageCallbackExampleProps, NetworkImageCallbackExampleState, > { - state = { + state: NetworkImageCallbackExampleState = { events: [], startLoadPrefetched: false, mountTime: Date.now(), @@ -123,7 +123,7 @@ class NetworkImageCallbackExample extends React.Component< this.setState({imageHash: Date.now()}); }; - render() { + render(): React.Node { const {mountTime} = this.state; return ( @@ -233,13 +233,13 @@ class NetworkImageExample extends React.Component< NetworkImageExampleProps, NetworkImageExampleState, > { - state = { + state: NetworkImageExampleState = { error: null, loading: false, progress: [], }; - render() { + render(): React.Node { return this.state.error != null ? ( {this.state.error} ) : ( @@ -283,7 +283,7 @@ class ImageSizeExample extends React.Component< ImageSizeExampleProps, ImageSizeExampleState, > { - state = { + state: ImageSizeExampleState = { width: 0, height: 0, }; @@ -294,7 +294,7 @@ class ImageSizeExample extends React.Component< }); } - render() { + render(): React.Node { return ( { - state = { + state: MultipleSourcesExampleState = { width: 30, height: 30, }; @@ -351,7 +351,7 @@ class MultipleSourcesExample extends React.Component< }); }; - render() { + render(): React.Node { return ( @@ -397,7 +397,7 @@ class LoadingIndicatorSourceExample extends React.Component< LoadingIndicatorSourceExampleProps, LoadingIndicatorSourceExampleState, > { - state = { + state: LoadingIndicatorSourceExampleState = { imageHash: Date.now(), }; @@ -407,11 +407,11 @@ class LoadingIndicatorSourceExample extends React.Component< }); }; - loaderGif = { + loaderGif: {uri: string} = { uri: 'https://media1.giphy.com/media/3oEjI6SIIHBdRxXI40/200.gif', }; - render() { + render(): React.Node { const loadingImage = { uri: `https://www.facebook.com/ads/pics/successstories.png?hash=${this.state.imageHash}`, }; @@ -447,7 +447,7 @@ class OnLayoutExample extends React.Component< OnLayoutExampleProps, OnLayoutExampleState, > { - state = { + state: OnLayoutExampleState = { width: 30, height: 30, layoutHandlerMessage: 'No Message', @@ -482,7 +482,7 @@ class OnLayoutExample extends React.Component< }); }; - render() { + render(): React.Node { return ( Adjust the image size to trigger the OnLayout handler. @@ -536,7 +536,7 @@ class OnPartialLoadExample extends React.Component< OnPartialLoadExampleProps, OnPartialLoadExampleState, > { - state = { + state: OnPartialLoadExampleState = { hasLoaded: false, }; @@ -546,7 +546,7 @@ class OnPartialLoadExample extends React.Component< }); }; - render() { + render(): React.Node { return ( diff --git a/packages/rn-tester/js/examples/InputAccessoryView/InputAccessoryViewExample.js b/packages/rn-tester/js/examples/InputAccessoryView/InputAccessoryViewExample.js index b19e559915f..24d0af2bb19 100644 --- a/packages/rn-tester/js/examples/InputAccessoryView/InputAccessoryViewExample.js +++ b/packages/rn-tester/js/examples/InputAccessoryView/InputAccessoryViewExample.js @@ -24,7 +24,7 @@ const { type MessageProps = $ReadOnly<{||}>; class Message extends React.PureComponent { - render() { + render(): React.Node { return ( Text Message @@ -36,9 +36,9 @@ class Message extends React.PureComponent { type TextInputProps = $ReadOnly<{||}>; type TextInputState = {|text: string|}; class TextInputBar extends React.PureComponent { - state = {text: ''}; + state: TextInputState = {text: ''}; - render() { + render(): React.Node { return ( { const BAR_HEIGHT = 44; type InputAccessoryProps = $ReadOnly<{||}>; class InputAccessoryViewExample extends React.Component { - render() { + render(): React.Node { return ( <> diff --git a/packages/rn-tester/js/examples/Layout/LayoutAnimationExample.js b/packages/rn-tester/js/examples/Layout/LayoutAnimationExample.js index e3c848ff237..89ad7ae4fa9 100644 --- a/packages/rn-tester/js/examples/Layout/LayoutAnimationExample.js +++ b/packages/rn-tester/js/examples/Layout/LayoutAnimationExample.js @@ -49,7 +49,7 @@ function shuffleArray(array: Array) { } class AddRemoveExample extends React.Component<{...}, AddRemoveExampleState> { - state = { + state: AddRemoveExampleState = { views: [], nextKey: 1, }; @@ -96,7 +96,7 @@ class AddRemoveExample extends React.Component<{...}, AddRemoveExampleState> { this.setState(state => ({views: shuffleArray(state.views)})); }; - render() { + render(): React.Node { const views = this.state.views.map(({key}) => ( { - state = { + state: ReparentingExampleState = { hasBorder: false, }; @@ -172,7 +172,7 @@ class ReparentingExample extends React.Component< this.setState(state => ({hasBorder: !state.hasBorder})); }; - render() { + render(): React.Node { const parentStyle = this.state.hasBorder ? {borderWidth: 5, borderColor: 'red'} : {}; @@ -214,7 +214,7 @@ type CrossFadeExampleState = {| |}; class CrossFadeExample extends React.Component<{...}, CrossFadeExampleState> { - state = { + state: CrossFadeExampleState = { toggled: false, }; @@ -225,7 +225,7 @@ class CrossFadeExample extends React.Component<{...}, CrossFadeExampleState> { this.setState(state => ({toggled: !state.toggled})); }; - render() { + render(): React.Node { return ( @@ -250,7 +250,7 @@ class LayoutUpdateExample extends React.Component< {...}, LayoutUpdateExampleState, > { - state = { + state: LayoutUpdateExampleState = { width: 200, height: 100, }; @@ -285,7 +285,7 @@ class LayoutUpdateExample extends React.Component< this.timeout = setTimeout(() => this.setState({width: 100}), 500); }; - render() { + render(): React.Node { const {width, height} = this.state; return ( diff --git a/packages/rn-tester/js/examples/Layout/LayoutEventsExample.js b/packages/rn-tester/js/examples/Layout/LayoutEventsExample.js index 51063d85d49..4b23f887145 100644 --- a/packages/rn-tester/js/examples/Layout/LayoutEventsExample.js +++ b/packages/rn-tester/js/examples/Layout/LayoutEventsExample.js @@ -81,7 +81,7 @@ class LayoutEventExample extends React.Component { this.setState({imageLayout: e.nativeEvent.layout}); }; - render() { + render(): React.Node { const viewStyle = [styles.view, this.state.viewStyle]; const textLayout = this.state.textLayout || {width: '?', height: '?'}; const imageLayout = this.state.imageLayout || {x: '?', y: '?'}; diff --git a/packages/rn-tester/js/examples/Layout/LayoutExample.js b/packages/rn-tester/js/examples/Layout/LayoutExample.js index 36496894610..ef7320c5258 100644 --- a/packages/rn-tester/js/examples/Layout/LayoutExample.js +++ b/packages/rn-tester/js/examples/Layout/LayoutExample.js @@ -17,7 +17,7 @@ const React = require('react'); const {StyleSheet, Text, View} = require('react-native'); class Circle extends React.Component<$FlowFixMeProps> { - render() { + render(): React.Node { const size = this.props.size || 20; const backgroundColor = this.props.bgColor || '#527fe4'; return ( @@ -35,7 +35,7 @@ class Circle extends React.Component<$FlowFixMeProps> { } class CircleBlock extends React.Component<$FlowFixMeProps> { - render() { + render(): React.Node { const circleStyle = { flexDirection: 'row', backgroundColor: '#f6f7f8', diff --git a/packages/rn-tester/js/examples/NativeAnimation/NativeAnimationsExample.js b/packages/rn-tester/js/examples/NativeAnimation/NativeAnimationsExample.js index c5dabd8589c..8a185085858 100644 --- a/packages/rn-tester/js/examples/NativeAnimation/NativeAnimationsExample.js +++ b/packages/rn-tester/js/examples/NativeAnimation/NativeAnimationsExample.js @@ -26,7 +26,7 @@ const { const AnimatedSlider = Animated.createAnimatedComponent(Slider); class Tester extends React.Component<$FlowFixMeProps, $FlowFixMeState> { - state = { + state: any | {js: AnimatedValue, native: AnimatedValue} = { native: new Animated.Value(0), js: new Animated.Value(0), }; @@ -54,7 +54,7 @@ class Tester extends React.Component<$FlowFixMeProps, $FlowFixMeState> { }).start(); }; - render() { + render(): React.Node { return ( @@ -75,7 +75,7 @@ class Tester extends React.Component<$FlowFixMeProps, $FlowFixMeState> { } class ValueListenerExample extends React.Component<{...}, $FlowFixMeState> { - state = { + state: any | {anim: AnimatedValue, progress: number} = { anim: new Animated.Value(0), progress: 0, }; @@ -102,7 +102,7 @@ class ValueListenerExample extends React.Component<{...}, $FlowFixMeState> { }).start(); }; - render() { + render(): React.Node { return ( @@ -124,7 +124,7 @@ class ValueListenerExample extends React.Component<{...}, $FlowFixMeState> { } class LoopExample extends React.Component<{...}, $FlowFixMeState> { - state = { + state: any | {value: AnimatedValue} = { value: new Animated.Value(0), }; @@ -138,7 +138,7 @@ class LoopExample extends React.Component<{...}, $FlowFixMeState> { ).start(); } - render() { + render(): React.Node { return ( { _stallInterval: ?number; - render() { + render(): React.Node { return ( { - state = { + state: any | {anim: AnimatedValue} = { anim: new Animated.Value(0), }; - render() { + render(): React.Node { return ( { - state = { + state: + | any + | { + js: AnimatedValue, + native: AnimatedValue, + toJS: AnimatedValue, + toNative: AnimatedValue, + } = { native: new Animated.Value(0), toNative: new Animated.Value(0), js: new Animated.Value(0), @@ -315,7 +322,10 @@ class TrackingExample extends React.Component< this.state.toJS.setValue(nextValue); }; - renderBlock = (anim: any | AnimatedValue, dest: any | AnimatedValue) => [ + renderBlock = ( + anim: any | AnimatedValue, + dest: any | AnimatedValue, + ): Array => [ , ]; - render() { + render(): React.Node { return ( diff --git a/packages/rn-tester/js/examples/OrientationChange/OrientationChangeExample.js b/packages/rn-tester/js/examples/OrientationChange/OrientationChangeExample.js index ccaada8b572..16a7260d3e9 100644 --- a/packages/rn-tester/js/examples/OrientationChange/OrientationChangeExample.js +++ b/packages/rn-tester/js/examples/OrientationChange/OrientationChangeExample.js @@ -17,7 +17,13 @@ import {type EventSubscription} from 'react-native/Libraries/vendor/emitter/Even class OrientationChangeExample extends React.Component<{...}, $FlowFixMeState> { _orientationSubscription: EventSubscription; - state = { + state: + | any + | { + currentOrientation: string, + isLandscape: boolean, + orientationDegrees: number, + } = { currentOrientation: '', orientationDegrees: 0, isLandscape: false, @@ -42,7 +48,7 @@ class OrientationChangeExample extends React.Component<{...}, $FlowFixMeState> { }); }; - render() { + render(): React.Node { return ( {JSON.stringify(this.state)} diff --git a/packages/rn-tester/js/examples/PointerEvents/PointerEventsExample.js b/packages/rn-tester/js/examples/PointerEvents/PointerEventsExample.js index 57654c0687b..c07f11da667 100644 --- a/packages/rn-tester/js/examples/PointerEvents/PointerEventsExample.js +++ b/packages/rn-tester/js/examples/PointerEvents/PointerEventsExample.js @@ -27,7 +27,7 @@ type ExampleBoxState = $ReadOnly<{| |}>; class ExampleBox extends React.Component { - state = { + state: ExampleBoxState = { log: [], }; @@ -49,7 +49,7 @@ class ExampleBox extends React.Component { this.state.log = this.state.log.concat(['---']); }; - render() { + render(): React.Node { const {Component} = this.props; return ( @@ -69,7 +69,7 @@ class ExampleBox extends React.Component { } class NoneExample extends React.Component<$FlowFixMeProps> { - render() { + render(): React.Node { return ( this.props.onLog('A unspecified touched')} @@ -100,7 +100,7 @@ class NoneExample extends React.Component<$FlowFixMeProps> { * the experiment and confuse the output. */ class DemoText extends React.Component<$FlowFixMeProps> { - render() { + render(): React.Node { return ( {this.props.children} @@ -110,7 +110,7 @@ class DemoText extends React.Component<$FlowFixMeProps> { } class BoxNoneExample extends React.Component<$FlowFixMeProps> { - render() { + render(): React.Node { return ( this.props.onLog('A unspecified touched')} @@ -143,7 +143,7 @@ class BoxNoneExample extends React.Component<$FlowFixMeProps> { } class BoxOnlyExample extends React.Component<$FlowFixMeProps> { - render() { + render(): React.Node { return ( this.props.onLog('A unspecified touched')} @@ -183,7 +183,7 @@ type OverflowExampleProps = $ReadOnly<{| |}>; class OverflowExample extends React.Component { - render() { + render(): React.Node { const {overflow} = this.props; return ( { } class OverflowVisibleExample extends React.Component { - render() { + render(): React.Node { return ; } } class OverflowHiddenExample extends React.Component { - render() { + render(): React.Node { return ; } } diff --git a/packages/rn-tester/js/examples/RCTRootView/RCTRootViewIOSExample.js b/packages/rn-tester/js/examples/RCTRootView/RCTRootViewIOSExample.js index aa953da5bbd..2ad33878de2 100644 --- a/packages/rn-tester/js/examples/RCTRootView/RCTRootViewIOSExample.js +++ b/packages/rn-tester/js/examples/RCTRootView/RCTRootViewIOSExample.js @@ -19,7 +19,7 @@ const { } = require('react-native'); class AppPropertiesUpdateExample extends React.Component<{...}> { - render() { + render(): React.Node { // Do not require this unless we are actually rendering. const UpdatePropertiesExampleView = requireNativeComponent( 'UpdatePropertiesExampleView', @@ -41,7 +41,7 @@ class AppPropertiesUpdateExample extends React.Component<{...}> { } class RootViewSizeFlexibilityExample extends React.Component<{...}> { - render() { + render(): React.Node { // Do not require this unless we are actually rendering. const FlexibleSizeExampleView = requireNativeComponent( 'FlexibleSizeExampleView', diff --git a/packages/rn-tester/js/examples/RTL/RTLExample.js b/packages/rn-tester/js/examples/RTL/RTLExample.js index 4d1dfb322da..9afedab7ffc 100644 --- a/packages/rn-tester/js/examples/RTL/RTLExample.js +++ b/packages/rn-tester/js/examples/RTL/RTLExample.js @@ -206,7 +206,7 @@ class RTLToggleExample extends React.Component { }; } - render() { + render(): React.Node { return ( @@ -267,7 +267,7 @@ class AnimationExample extends React.Component { }; } - render() { + render(): React.Node { return ( diff --git a/packages/rn-tester/js/examples/SafeAreaView/SafeAreaViewExample.js b/packages/rn-tester/js/examples/SafeAreaView/SafeAreaViewExample.js index 12268f6edee..a57283becec 100644 --- a/packages/rn-tester/js/examples/SafeAreaView/SafeAreaViewExample.js +++ b/packages/rn-tester/js/examples/SafeAreaView/SafeAreaViewExample.js @@ -28,7 +28,7 @@ class SafeAreaViewExample extends React.Component< modalVisible: boolean, |}, > { - state = { + state: {modalVisible: boolean} = { modalVisible: false, }; @@ -36,7 +36,7 @@ class SafeAreaViewExample extends React.Component< this.setState({modalVisible: visible}); }; - render() { + render(): React.Node { return ( { - render() { + render(): React.Node { return ( diff --git a/packages/rn-tester/js/examples/ScrollView/ScrollViewAnimatedExample.js b/packages/rn-tester/js/examples/ScrollView/ScrollViewAnimatedExample.js index 6b774ed8632..f1263820f49 100644 --- a/packages/rn-tester/js/examples/ScrollView/ScrollViewAnimatedExample.js +++ b/packages/rn-tester/js/examples/ScrollView/ScrollViewAnimatedExample.js @@ -10,6 +10,8 @@ 'use strict'; +import type AnimatedValue from 'react-native/Libraries/Animated/nodes/AnimatedValue'; + const React = require('react'); const ReactNative = require('react-native'); const {Component} = React; @@ -17,7 +19,7 @@ const {StyleSheet, Text, View, Animated, Easing, TouchableOpacity, Dimensions} = ReactNative; class ScrollViewAnimatedExample extends Component<{...}> { - _scrollViewPos = new Animated.Value(0); + _scrollViewPos: AnimatedValue = new Animated.Value(0); startAnimation: () => void = () => { this._scrollViewPos.setValue(0); diff --git a/packages/rn-tester/js/examples/ScrollView/ScrollViewExample.js b/packages/rn-tester/js/examples/ScrollView/ScrollViewExample.js index dfea4a4b07a..b023f0c7e78 100644 --- a/packages/rn-tester/js/examples/ScrollView/ScrollViewExample.js +++ b/packages/rn-tester/js/examples/ScrollView/ScrollViewExample.js @@ -29,10 +29,10 @@ import type {ViewStyleProp} from 'react-native/Libraries/StyleSheet/StyleSheet'; import ScrollViewPressableStickyHeaderExample from './ScrollViewPressableStickyHeaderExample'; class EnableDisableList extends React.Component<{}, {scrollEnabled: boolean}> { - state = { + state: {scrollEnabled: boolean} = { scrollEnabled: true, }; - render() { + render(): React.Node { return ( >}, > { - state = { + state: {items: Array>} = { items: [...Array(AppendingListItemCount)].map((_, ii) => ( )), }; - render() { + render(): React.Node { return ( { - render() { + render(): $FlowFixMe { return ( {this.props.msg} diff --git a/packages/rn-tester/js/examples/Snapshot/SnapshotExample.js b/packages/rn-tester/js/examples/Snapshot/SnapshotExample.js index 854cbbf4477..df15929e706 100644 --- a/packages/rn-tester/js/examples/Snapshot/SnapshotExample.js +++ b/packages/rn-tester/js/examples/Snapshot/SnapshotExample.js @@ -15,11 +15,11 @@ const {Alert, Image, StyleSheet, Text, View} = require('react-native'); const ScreenshotManager = require('../../../NativeModuleExample/NativeScreenshotManager'); class ScreenshotExample extends React.Component<{...}, $FlowFixMeState> { - state = { + state: any | {uri: void} = { uri: undefined, }; - render() { + render(): React.Node { return ( diff --git a/packages/rn-tester/js/examples/StatusBar/StatusBarExample.js b/packages/rn-tester/js/examples/StatusBar/StatusBarExample.js index 452e04e1d14..16aa1c42e61 100644 --- a/packages/rn-tester/js/examples/StatusBar/StatusBarExample.js +++ b/packages/rn-tester/js/examples/StatusBar/StatusBarExample.js @@ -32,7 +32,9 @@ function getValue(values: Array, index: number): T { } class StatusBarHiddenExample extends React.Component<{...}, $FlowFixMeState> { - state = { + state: + | $FlowFixMe + | {animated: boolean, hidden: boolean, showHideTransition: string} = { animated: true, hidden: false, showHideTransition: getValue(showHideTransitions, 0), @@ -58,11 +60,12 @@ class StatusBarHiddenExample extends React.Component<{...}, $FlowFixMeState> { }); }; - render() { + render(): React.Node { return (