From bd08780c6503b99fe4a1cad50e5c2d76358d468d Mon Sep 17 00:00:00 2001 From: Jan Kassens Date: Wed, 21 Dec 2022 10:59:27 -0500 Subject: [PATCH 1/7] [flow] add local type annotations --- packages/jest-react/src/internalAct.js | 2 +- packages/react-cache/src/ReactCacheOld.js | 6 +- .../react-client/src/ReactFlightClient.js | 19 ++- .../src/ReactFlightClientStream.js | 2 +- .../react-debug-tools/src/ReactDebugHooks.js | 18 +-- .../src/client/ReactDOMComponent.js | 7 +- .../src/client/ReactDOMHostConfig.js | 4 +- .../src/client/ReactDOMInput.js | 4 +- .../src/client/ReactDOMSelect.js | 2 +- .../src/client/getNodeForCharacterOffset.js | 4 +- .../src/client/inputValueTracking.js | 6 +- .../src/events/DOMEventProperties.js | 2 +- .../src/events/DOMPluginEventSystem.js | 2 +- .../src/events/ReactDOMEventListener.js | 16 +-- .../src/events/ReactDOMEventReplaying.js | 2 +- .../src/events/SyntheticEvent.js | 25 ++-- .../events/plugins/BeforeInputEventPlugin.js | 20 ++-- .../src/events/plugins/ChangeEventPlugin.js | 38 +++--- .../src/events/plugins/SelectEventPlugin.js | 6 +- .../src/server/ReactDOMServerFormatConfig.js | 16 ++- .../src/server/escapeTextForBrowser.js | 2 +- .../src/shared/DOMProperty.js | 3 +- packages/react-dom/src/client/ReactDOMRoot.js | 9 +- .../src/server/ReactDOMFizzServerNode.js | 5 +- .../src/server/ReactDOMFizzStaticNode.js | 2 +- .../src/dom/create-event-handle/Focus.js | 4 +- packages/react-reconciler/src/DebugTracing.js | 4 +- .../react-reconciler/src/ReactChildFiber.js | 10 +- packages/react-reconciler/src/ReactFiber.js | 1 + .../src/ReactFiberBeginWork.js | 111 ++++++++++-------- .../src/ReactFiberCacheComponent.js | 2 +- .../src/ReactFiberClassComponent.js | 32 ++--- .../src/ReactFiberClassUpdateQueue.js | 2 +- .../src/ReactFiberCommitWork.js | 17 +-- .../react-reconciler/src/ReactFiberHooks.js | 6 +- .../src/ReactFiberHydrationContext.js | 2 +- .../src/ReactFiberReconciler.js | 2 +- .../react-reconciler/src/ReactFiberRoot.js | 9 +- .../react-reconciler/src/ReactFiberScope.js | 17 ++- .../react-reconciler/src/ReactFiberThrow.js | 2 +- .../src/ReactFiberTreeReflection.js | 2 +- .../src/ReactFiberWorkLoop.js | 36 +++--- .../src/ReactStrictModeWarnings.js | 2 +- .../react-refresh/src/ReactFreshRuntime.js | 14 ++- .../src/ReactFlightDOMClient.js | 4 +- .../src/ReactFlightDOMServerNode.js | 4 +- .../src/ReactFlightWebpackNodeLoader.js | 4 +- .../src/ReactFlightWebpackNodeRegister.js | 18 ++- .../src/ReactFlightWebpackPlugin.js | 2 +- .../src/ReactFizzClassComponent.js | 12 +- packages/react-server/src/ReactFizzServer.js | 12 +- .../react-server/src/ReactFlightServer.js | 12 +- packages/react/src/ReactAct.js | 9 +- packages/react/src/ReactChildren.js | 2 +- packages/react/src/ReactContext.js | 11 +- packages/scheduler/src/forks/Scheduler.js | 11 +- packages/scheduler/src/forks/SchedulerMock.js | 2 +- .../scheduler/src/forks/SchedulerPostTask.js | 2 +- packages/shared/ReactErrorUtils.js | 1 + packages/shared/checkPropTypes.js | 2 +- packages/shared/invokeGuardedCallbackImpl.js | 8 +- .../src/useSyncExternalStoreWithSelector.js | 2 +- scripts/flow/createFlowConfigs.js | 2 - 63 files changed, 364 insertions(+), 253 deletions(-) diff --git a/packages/jest-react/src/internalAct.js b/packages/jest-react/src/internalAct.js index d078c888c75ed..1b5349554c40d 100644 --- a/packages/jest-react/src/internalAct.js +++ b/packages/jest-react/src/internalAct.js @@ -122,7 +122,7 @@ export function act(scope: () => Thenable | T): Thenable { } } -function flushActWork(resolve, reject) { +function flushActWork(resolve: () => void, reject: (error: any) => void) { if (Scheduler.unstable_hasPendingWork()) { try { Scheduler.unstable_flushUntilNextPaint(); diff --git a/packages/react-cache/src/ReactCacheOld.js b/packages/react-cache/src/ReactCacheOld.js index 3c83b76cacbcd..d101565415db4 100644 --- a/packages/react-cache/src/ReactCacheOld.js +++ b/packages/react-cache/src/ReactCacheOld.js @@ -7,7 +7,7 @@ * @flow */ -import type {Thenable} from 'shared/ReactTypes'; +import type {ReactContext, Thenable} from 'shared/ReactTypes'; import * as React from 'react'; @@ -48,7 +48,7 @@ const ReactCurrentDispatcher = React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED .ReactCurrentDispatcher; -function readContext(Context) { +function readContext(Context: ReactContext) { const dispatcher = ReactCurrentDispatcher.current; if (dispatcher === null) { // This wasn't being minified but we're going to retire this package anyway. @@ -133,7 +133,7 @@ function accessResult( } } -function deleteEntry(resource, key) { +function deleteEntry(resource: any, key: mixed) { const entriesForResource = entries.get(resource); if (entriesForResource !== undefined) { entriesForResource.delete(key); diff --git a/packages/react-client/src/ReactFlightClient.js b/packages/react-client/src/ReactFlightClient.js index c023a1feca632..77cd396e64756 100644 --- a/packages/react-client/src/ReactFlightClient.js +++ b/packages/react-client/src/ReactFlightClient.js @@ -94,7 +94,13 @@ type SomeChunk = | InitializedChunk | ErroredChunk; -function Chunk(status: any, value: any, reason: any, response: Response) { +function Chunk( + this: any, + status: any, + value: any, + reason: any, + response: Response, +) { this.status = status; this.value = value; this.reason = reason; @@ -104,6 +110,7 @@ function Chunk(status: any, value: any, reason: any, response: Response) { Chunk.prototype = (Object.create(Promise.prototype): any); // TODO: This doesn't return a new Promise chain unlike the real .then Chunk.prototype.then = function( + this: SomeChunk, resolve: (value: T) => mixed, reject: (reason: mixed) => mixed, ) { @@ -369,7 +376,11 @@ export function reportGlobalError(response: Response, error: Error): void { }); } -function createElement(type, key, props): React$Element { +function createElement( + type: mixed, + key: mixed, + props: mixed, +): React$Element { const element: any = { // This tag allows us to uniquely identify this as a React Element $$typeof: REACT_ELEMENT_TYPE, @@ -446,7 +457,7 @@ function createModelResolver( value: null, }; } - return value => { + return (value: any) => { parentObject[key] = value; blocked.deps--; if (blocked.deps === 0) { @@ -465,7 +476,7 @@ function createModelResolver( } function createModelReject(chunk: SomeChunk) { - return error => triggerErrorOnChunk(chunk, error); + return (error: mixed) => triggerErrorOnChunk(chunk, error); } export function parseModelString( diff --git a/packages/react-client/src/ReactFlightClientStream.js b/packages/react-client/src/ReactFlightClientStream.js index c3f3c48b1a5bc..c6998c4880cac 100644 --- a/packages/react-client/src/ReactFlightClientStream.js +++ b/packages/react-client/src/ReactFlightClientStream.js @@ -122,7 +122,7 @@ export function processBinaryChunk( } function createFromJSONCallback(response: Response) { - return function(key: string, value: JSONValue) { + return function(this: any, key: string, value: JSONValue) { if (typeof value === 'string') { // We can't use .bind here because we need the "this" value. return parseModelString(response, this, key, value); diff --git a/packages/react-debug-tools/src/ReactDebugHooks.js b/packages/react-debug-tools/src/ReactDebugHooks.js index 5971c38a97afe..fbe4dc2f360a4 100644 --- a/packages/react-debug-tools/src/ReactDebugHooks.js +++ b/packages/react-debug-tools/src/ReactDebugHooks.js @@ -350,7 +350,7 @@ const Dispatcher: DispatcherType = { // create a proxy to throw a custom error // in case future versions of React adds more hooks const DispatcherProxyHandler = { - get(target, prop) { + get(target: DispatcherType, prop: string) { if (target.hasOwnProperty(prop)) { return target[prop]; } @@ -404,7 +404,7 @@ export type HooksTree = Array; let mostLikelyAncestorIndex = 0; -function findSharedIndex(hookStack, rootStack, rootIndex) { +function findSharedIndex(hookStack: any, rootStack: any, rootIndex: number) { const source = rootStack[rootIndex].source; hookSearch: for (let i = 0; i < hookStack.length; i++) { if (hookStack[i].source === source) { @@ -425,7 +425,7 @@ function findSharedIndex(hookStack, rootStack, rootIndex) { return -1; } -function findCommonAncestorIndex(rootStack, hookStack) { +function findCommonAncestorIndex(rootStack: any, hookStack: any) { let rootIndex = findSharedIndex( hookStack, rootStack, @@ -446,7 +446,7 @@ function findCommonAncestorIndex(rootStack, hookStack) { return -1; } -function isReactWrapper(functionName, primitiveName) { +function isReactWrapper(functionName: any, primitiveName: string) { if (!functionName) { return false; } @@ -460,7 +460,7 @@ function isReactWrapper(functionName, primitiveName) { ); } -function findPrimitiveIndex(hookStack, hook) { +function findPrimitiveIndex(hookStack: any, hook: HookLogEntry) { const stackCache = getPrimitiveStackCache(); const primitiveStack = stackCache.get(hook.primitive); if (primitiveStack === undefined) { @@ -488,7 +488,7 @@ function findPrimitiveIndex(hookStack, hook) { return -1; } -function parseTrimmedStack(rootStack, hook) { +function parseTrimmedStack(rootStack: any, hook: HookLogEntry) { // Get the stack trace between the primitive hook function and // the root function call. I.e. the stack frames of custom hooks. const hookStack = ErrorStackParser.parse(hook.stackError); @@ -520,8 +520,8 @@ function parseCustomHookName(functionName: void | string): string { } function buildTree( - rootStack, - readHookLog, + rootStack: any, + readHookLog: Array, includeHooksSource: boolean, ): HooksTree { const rootChildren = []; @@ -764,7 +764,7 @@ function inspectHooksOfForwardRef( return buildTree(rootStack, readHookLog, includeHooksSource); } -function resolveDefaultProps(Component, baseProps) { +function resolveDefaultProps(Component: any, baseProps: any) { if (Component && Component.defaultProps) { // Resolve default props. Taken from ReactElement const props = assign({}, baseProps); diff --git a/packages/react-dom-bindings/src/client/ReactDOMComponent.js b/packages/react-dom-bindings/src/client/ReactDOMComponent.js index c1a61a81dc9da..13a41337f4c71 100644 --- a/packages/react-dom-bindings/src/client/ReactDOMComponent.js +++ b/packages/react-dom-bindings/src/client/ReactDOMComponent.js @@ -115,7 +115,7 @@ if (__DEV__) { webview: true, }; - validatePropertiesInDevelopment = function(type, props) { + validatePropertiesInDevelopment = function(type: string, props: any) { validateARIAProperties(type, props); validateInputProperties(type, props); validateUnknownProperties(type, props, { @@ -172,7 +172,10 @@ if (__DEV__) { console.error('Extra attributes from the server: %s', names); }; - warnForInvalidEventListener = function(registrationName, listener) { + warnForInvalidEventListener = function( + registrationName: string, + listener: any, + ) { if (listener === false) { console.error( 'Expected `%s` listener to be a function, instead got `false`.\n\n' + diff --git a/packages/react-dom-bindings/src/client/ReactDOMHostConfig.js b/packages/react-dom-bindings/src/client/ReactDOMHostConfig.js index db42f2ed243a3..db3c6f1c5df22 100644 --- a/packages/react-dom-bindings/src/client/ReactDOMHostConfig.js +++ b/packages/react-dom-bindings/src/client/ReactDOMHostConfig.js @@ -445,7 +445,7 @@ export const scheduleMicrotask: any = .catch(handleErrorInNextTick) : scheduleTimeout; // TODO: Determine the best fallback here. -function handleErrorInNextTick(error) { +function handleErrorInNextTick(error: any) { setTimeout(() => { throw error; }); @@ -913,7 +913,7 @@ export function registerSuspenseInstanceRetry( instance._reactRetry = callback; } -function getNextHydratable(node) { +function getNextHydratable(node: ?Node) { // Skip non-hydratable nodes. for (; node != null; node = ((node: any): Node).nextSibling) { const nodeType = node.nodeType; diff --git a/packages/react-dom-bindings/src/client/ReactDOMInput.js b/packages/react-dom-bindings/src/client/ReactDOMInput.js index e53a1c1463119..d9b1a2e55cecb 100644 --- a/packages/react-dom-bindings/src/client/ReactDOMInput.js +++ b/packages/react-dom-bindings/src/client/ReactDOMInput.js @@ -37,7 +37,7 @@ let didWarnCheckedDefaultChecked = false; let didWarnControlledToUncontrolled = false; let didWarnUncontrolledToControlled = false; -function isControlled(props) { +function isControlled(props: any) { const usesChecked = props.type === 'checkbox' || props.type === 'radio'; return usesChecked ? props.checked != null : props.value != null; } @@ -351,7 +351,7 @@ export function restoreControlledState(element: Element, props: Object) { updateNamedCousins(node, props); } -function updateNamedCousins(rootNode, props) { +function updateNamedCousins(rootNode: InputWithWrapperState, props: any) { const name = props.name; if (props.type === 'radio' && name != null) { let queryRoot: Element = rootNode; diff --git a/packages/react-dom-bindings/src/client/ReactDOMSelect.js b/packages/react-dom-bindings/src/client/ReactDOMSelect.js index eef4cc05c4d7f..3ecc9974c637d 100644 --- a/packages/react-dom-bindings/src/client/ReactDOMSelect.js +++ b/packages/react-dom-bindings/src/client/ReactDOMSelect.js @@ -38,7 +38,7 @@ const valuePropNames = ['value', 'defaultValue']; /** * Validation function for `value` and `defaultValue`. */ -function checkSelectPropTypes(props) { +function checkSelectPropTypes(props: any) { if (__DEV__) { checkControlledValueProps('select', props); diff --git a/packages/react-dom-bindings/src/client/getNodeForCharacterOffset.js b/packages/react-dom-bindings/src/client/getNodeForCharacterOffset.js index 151b3588e9494..360d8ab3c5dcd 100644 --- a/packages/react-dom-bindings/src/client/getNodeForCharacterOffset.js +++ b/packages/react-dom-bindings/src/client/getNodeForCharacterOffset.js @@ -15,7 +15,7 @@ import {TEXT_NODE} from '../shared/HTMLNodeType'; * @param {DOMElement|DOMTextNode} node * @return {DOMElement|DOMTextNode} */ -function getLeafNode(node) { +function getLeafNode(node: ?(Node | Element)) { while (node && node.firstChild) { node = node.firstChild; } @@ -29,7 +29,7 @@ function getLeafNode(node) { * @param {DOMElement|DOMTextNode} node * @return {?DOMElement|DOMTextNode} */ -function getSiblingNode(node) { +function getSiblingNode(node: ?(Node | Element)) { while (node) { if (node.nextSibling) { return node.nextSibling; diff --git a/packages/react-dom-bindings/src/client/inputValueTracking.js b/packages/react-dom-bindings/src/client/inputValueTracking.js index b21c463d1b042..e1e45a13a54f8 100644 --- a/packages/react-dom-bindings/src/client/inputValueTracking.js +++ b/packages/react-dom-bindings/src/client/inputValueTracking.js @@ -78,10 +78,10 @@ function trackValueOnNode(node: any): ?ValueTracker { const {get, set} = descriptor; Object.defineProperty(node, valueField, { configurable: true, - get: function() { + get: function(this: any) { return get.call(this); }, - set: function(value) { + set: function(this: any, value) { if (__DEV__) { checkFormFieldValueStringCoercion(value); } @@ -101,7 +101,7 @@ function trackValueOnNode(node: any): ?ValueTracker { getValue() { return currentValue; }, - setValue(value) { + setValue(value: string) { if (__DEV__) { checkFormFieldValueStringCoercion(value); } diff --git a/packages/react-dom-bindings/src/events/DOMEventProperties.js b/packages/react-dom-bindings/src/events/DOMEventProperties.js index ddae752fd7f5c..69f0df205270f 100644 --- a/packages/react-dom-bindings/src/events/DOMEventProperties.js +++ b/packages/react-dom-bindings/src/events/DOMEventProperties.js @@ -111,7 +111,7 @@ if (enableCreateEventHandleAPI) { topLevelEventsToReactNames.set('afterblur', null); } -function registerSimpleEvent(domEventName, reactName) { +function registerSimpleEvent(domEventName: DOMEventName, reactName: string) { topLevelEventsToReactNames.set(domEventName, reactName); registerTwoPhaseEvent(reactName, [domEventName]); } diff --git a/packages/react-dom-bindings/src/events/DOMPluginEventSystem.js b/packages/react-dom-bindings/src/events/DOMPluginEventSystem.js index d422a0e26c583..89c9f00e90015 100644 --- a/packages/react-dom-bindings/src/events/DOMPluginEventSystem.js +++ b/packages/react-dom-bindings/src/events/DOMPluginEventSystem.js @@ -462,7 +462,7 @@ function addTrappedEventListener( // need support for such browsers. if (enableLegacyFBSupport && isDeferredListenerForLegacyFBSupport) { const originalListener = listener; - listener = function(...p) { + listener = function(this: any, ...p) { removeEventListener( targetContainer, domEventName, diff --git a/packages/react-dom-bindings/src/events/ReactDOMEventListener.js b/packages/react-dom-bindings/src/events/ReactDOMEventListener.js index 2eca510571f12..487420be00917 100644 --- a/packages/react-dom-bindings/src/events/ReactDOMEventListener.js +++ b/packages/react-dom-bindings/src/events/ReactDOMEventListener.js @@ -112,10 +112,10 @@ export function createEventListenerWrapperWithPriority( } function dispatchDiscreteEvent( - domEventName, - eventSystemFlags, - container, - nativeEvent, + domEventName: DOMEventName, + eventSystemFlags: EventSystemFlags, + container: EventTarget, + nativeEvent: AnyNativeEvent, ) { const previousPriority = getCurrentUpdatePriority(); const prevTransition = ReactCurrentBatchConfig.transition; @@ -130,10 +130,10 @@ function dispatchDiscreteEvent( } function dispatchContinuousEvent( - domEventName, - eventSystemFlags, - container, - nativeEvent, + domEventName: DOMEventName, + eventSystemFlags: EventSystemFlags, + container: EventTarget, + nativeEvent: AnyNativeEvent, ) { const previousPriority = getCurrentUpdatePriority(); const prevTransition = ReactCurrentBatchConfig.transition; diff --git a/packages/react-dom-bindings/src/events/ReactDOMEventReplaying.js b/packages/react-dom-bindings/src/events/ReactDOMEventReplaying.js index a10524fdb4966..8b61d7607024d 100644 --- a/packages/react-dom-bindings/src/events/ReactDOMEventReplaying.js +++ b/packages/react-dom-bindings/src/events/ReactDOMEventReplaying.js @@ -619,7 +619,7 @@ export function retryIfBlockedOn( if (queuedMouse !== null) { scheduleCallbackIfUnblocked(queuedMouse, unblocked); } - const unblock = queuedEvent => + const unblock = (queuedEvent: QueuedReplayableEvent) => scheduleCallbackIfUnblocked(queuedEvent, unblocked); queuedPointers.forEach(unblock); queuedPointerCaptures.forEach(unblock); diff --git a/packages/react-dom-bindings/src/events/SyntheticEvent.js b/packages/react-dom-bindings/src/events/SyntheticEvent.js index 763e14ce57e94..82758b565b0fe 100644 --- a/packages/react-dom-bindings/src/events/SyntheticEvent.js +++ b/packages/react-dom-bindings/src/events/SyntheticEvent.js @@ -43,6 +43,7 @@ function createSyntheticEvent(Interface: EventInterfaceType) { * DOM interface; custom application-specific events can also subclass this. */ function SyntheticBaseEvent( + this: any, reactName: string | null, reactEventType: string, targetInst: Fiber | null, @@ -83,7 +84,7 @@ function createSyntheticEvent(Interface: EventInterfaceType) { // $FlowFixMe[prop-missing] found when upgrading Flow assign(SyntheticBaseEvent.prototype, { - preventDefault: function() { + preventDefault: function(this: any) { this.defaultPrevented = true; const event = this.nativeEvent; if (!event) { @@ -99,7 +100,7 @@ function createSyntheticEvent(Interface: EventInterfaceType) { this.isDefaultPrevented = functionThatReturnsTrue; }, - stopPropagation: function() { + stopPropagation: function(this: any) { const event = this.nativeEvent; if (!event) { return; @@ -147,7 +148,7 @@ const EventInterface = { eventPhase: 0, bubbles: 0, cancelable: 0, - timeStamp: function(event) { + timeStamp: function(event: {[propName: string]: mixed}) { return event.timeStamp || Date.now(); }, defaultPrevented: 0, @@ -168,7 +169,7 @@ let lastMovementX; let lastMovementY; let lastMouseEvent; -function updateMouseMovementPolyfillState(event) { +function updateMouseMovementPolyfillState(event: {[propName: string]: mixed}) { if (event !== lastMouseEvent) { if (lastMouseEvent && event.type === 'mousemove') { // $FlowFixMe assuming this is a number @@ -373,7 +374,7 @@ const translateToKey = { * @param {object} nativeEvent Native browser event. * @return {string} Normalized `key` property. */ -function getEventKey(nativeEvent) { +function getEventKey(nativeEvent: {[propName: string]: mixed}) { if (nativeEvent.key) { // Normalize inconsistent values reported by browsers due to // implementations of a working draft specification. @@ -422,7 +423,7 @@ const modifierKeyToProp = { // Older browsers (Safari <= 10, iOS Safari <= 10.2) do not support // getModifierState. If getModifierState is not supported, we map it to a set of // modifier keys exposed by the event. In this case, Lock-keys are not supported. -function modifierStateGetter(keyArg) { +function modifierStateGetter(this: any, keyArg) { const syntheticEvent = this; const nativeEvent = syntheticEvent.nativeEvent; if (nativeEvent.getModifierState) { @@ -432,7 +433,7 @@ function modifierStateGetter(keyArg) { return keyProp ? !!nativeEvent[keyProp] : false; } -function getEventModifierState(nativeEvent) { +function getEventModifierState(nativeEvent: {[propName: string]: mixed}) { return modifierStateGetter; } @@ -453,7 +454,7 @@ const KeyboardEventInterface = { locale: 0, getModifierState: getEventModifierState, // Legacy Interface - charCode: function(event) { + charCode: function(event: {[propName: string]: mixed}) { // `charCode` is the result of a KeyPress event and represents the value of // the actual printable character. @@ -467,7 +468,7 @@ const KeyboardEventInterface = { } return 0; }, - keyCode: function(event) { + keyCode: function(event: {[propName: string]: mixed}) { // `keyCode` is the result of a KeyDown/Up event and represents the value of // physical keyboard key. @@ -480,7 +481,7 @@ const KeyboardEventInterface = { } return 0; }, - which: function(event) { + which: function(event: {[propName: string]: mixed}) { // `which` is an alias for either `keyCode` or `charCode` depending on the // type of the event. if (event.type === 'keypress') { @@ -560,7 +561,7 @@ export const SyntheticTransitionEvent: $FlowFixMe = createSyntheticEvent( */ const WheelEventInterface = { ...MouseEventInterface, - deltaX(event) { + deltaX(event: {[propName: string]: mixed}) { return 'deltaX' in event ? event.deltaX : // Fallback to `wheelDeltaX` for Webkit and normalize (right is positive). @@ -569,7 +570,7 @@ const WheelEventInterface = { -event.wheelDeltaX : 0; }, - deltaY(event) { + deltaY(event: {[propName: string]: mixed}) { return 'deltaY' in event ? event.deltaY : // Fallback to `wheelDeltaY` for Webkit and normalize (down is positive). diff --git a/packages/react-dom-bindings/src/events/plugins/BeforeInputEventPlugin.js b/packages/react-dom-bindings/src/events/plugins/BeforeInputEventPlugin.js index 0753fc1970252..96431e9fe1519 100644 --- a/packages/react-dom-bindings/src/events/plugins/BeforeInputEventPlugin.js +++ b/packages/react-dom-bindings/src/events/plugins/BeforeInputEventPlugin.js @@ -192,11 +192,11 @@ let isComposing = false; * @return {?object} A SyntheticCompositionEvent. */ function extractCompositionEvent( - dispatchQueue, - domEventName, - targetInst, - nativeEvent, - nativeEventTarget, + dispatchQueue: DispatchQueue, + domEventName: DOMEventName, + targetInst: null | Fiber, + nativeEvent: AnyNativeEvent, + nativeEventTarget: null | EventTarget, ) { let eventType; let fallbackData; @@ -379,11 +379,11 @@ function getFallbackBeforeInputChars( * @return {?object} A SyntheticInputEvent. */ function extractBeforeInputEvent( - dispatchQueue, - domEventName, - targetInst, - nativeEvent, - nativeEventTarget, + dispatchQueue: DispatchQueue, + domEventName: DOMEventName, + targetInst: null | Fiber, + nativeEvent: AnyNativeEvent, + nativeEventTarget: null | EventTarget, ) { let chars; diff --git a/packages/react-dom-bindings/src/events/plugins/ChangeEventPlugin.js b/packages/react-dom-bindings/src/events/plugins/ChangeEventPlugin.js index a482eb9f663e1..3b57d4ec05148 100644 --- a/packages/react-dom-bindings/src/events/plugins/ChangeEventPlugin.js +++ b/packages/react-dom-bindings/src/events/plugins/ChangeEventPlugin.js @@ -6,6 +6,7 @@ * * @flow */ +import type {TextInstance, Instance} from '../../client/ReactDOMHostConfig'; import type {AnyNativeEvent} from '../PluginModuleType'; import type {DOMEventName} from '../DOMEventNames'; import type {DispatchQueue} from '../DOMPluginEventSystem'; @@ -51,9 +52,9 @@ function registerEvents() { function createAndAccumulateChangeEvent( dispatchQueue, - inst, - nativeEvent, - target, + inst: null | Fiber, + nativeEvent: AnyNativeEvent, + target: null | EventTarget, ) { // Flag this event loop as needing state restore. enqueueStateRestore(((target: any): Node)); @@ -78,7 +79,7 @@ let activeElementInst = null; /** * SECTION: handle `change` event */ -function shouldUseChangeEvent(elem) { +function shouldUseChangeEvent(elem: Instance | TextInstance) { const nodeName = elem.nodeName && elem.nodeName.toLowerCase(); return ( nodeName === 'select' || @@ -86,7 +87,7 @@ function shouldUseChangeEvent(elem) { ); } -function manualDispatchChangeEvent(nativeEvent) { +function manualDispatchChangeEvent(nativeEvent: AnyNativeEvent) { const dispatchQueue = []; createAndAccumulateChangeEvent( dispatchQueue, @@ -109,7 +110,7 @@ function manualDispatchChangeEvent(nativeEvent) { batchedUpdates(runEventInBatch, dispatchQueue); } -function runEventInBatch(dispatchQueue) { +function runEventInBatch(dispatchQueue: DispatchQueue) { processDispatchQueue(dispatchQueue, 0); } @@ -120,7 +121,10 @@ function getInstIfValueChanged(targetInst: Object) { } } -function getTargetInstForChangeEvent(domEventName: DOMEventName, targetInst) { +function getTargetInstForChangeEvent( + domEventName: DOMEventName, + targetInst: null | Fiber, +) { if (domEventName === 'change') { return targetInst; } @@ -143,7 +147,10 @@ if (canUseDOM) { * and override the value property so that we can distinguish user events from * value changes in JS. */ -function startWatchingForValueChange(target, targetInst) { +function startWatchingForValueChange( + target: Instance | TextInstance, + targetInst: null | Fiber, +) { activeElement = target; activeElementInst = targetInst; (activeElement: any).attachEvent('onpropertychange', handlePropertyChange); @@ -177,8 +184,8 @@ function handlePropertyChange(nativeEvent) { function handleEventsForInputEventPolyfill( domEventName: DOMEventName, - target, - targetInst, + target: Instance | TextInstance, + targetInst: null | Fiber, ) { if (domEventName === 'focusin') { // In IE9, propertychange fires for most input events but is buggy and @@ -201,7 +208,7 @@ function handleEventsForInputEventPolyfill( // For IE8 and IE9. function getTargetInstForInputEventPolyfill( domEventName: DOMEventName, - targetInst, + targetInst: null | Fiber, ) { if ( domEventName === 'selectionchange' || @@ -225,7 +232,7 @@ function getTargetInstForInputEventPolyfill( /** * SECTION: handle `click` event */ -function shouldUseClickEvent(elem) { +function shouldUseClickEvent(elem: any) { // Use the `click` event to detect changes to checkbox and radio inputs. // This approach works across all browsers, whereas `change` does not fire // until `blur` in IE8. @@ -237,7 +244,10 @@ function shouldUseClickEvent(elem) { ); } -function getTargetInstForClickEvent(domEventName: DOMEventName, targetInst) { +function getTargetInstForClickEvent( + domEventName: DOMEventName, + targetInst: null | Fiber, +) { if (domEventName === 'click') { return getInstIfValueChanged(targetInst); } @@ -245,7 +255,7 @@ function getTargetInstForClickEvent(domEventName: DOMEventName, targetInst) { function getTargetInstForInputOrChangeEvent( domEventName: DOMEventName, - targetInst, + targetInst: null | Fiber, ) { if (domEventName === 'input' || domEventName === 'change') { return getInstIfValueChanged(targetInst); diff --git a/packages/react-dom-bindings/src/events/plugins/SelectEventPlugin.js b/packages/react-dom-bindings/src/events/plugins/SelectEventPlugin.js index 0fef17bc6a3c8..8a568aed3cfef 100644 --- a/packages/react-dom-bindings/src/events/plugins/SelectEventPlugin.js +++ b/packages/react-dom-bindings/src/events/plugins/SelectEventPlugin.js @@ -91,7 +91,11 @@ function getEventTargetDocument(eventTarget: any) { * @param {object} nativeEventTarget * @return {?SyntheticEvent} */ -function constructSelectEvent(dispatchQueue, nativeEvent, nativeEventTarget) { +function constructSelectEvent( + dispatchQueue: DispatchQueue, + nativeEvent: AnyNativeEvent, + nativeEventTarget: null | EventTarget, +) { // Ensure we have the right element, and that the user is not dragging a // selection (this matches native `select` event behavior). In HTML5, select // fires only on input and textarea thus if there's no focused element we diff --git a/packages/react-dom-bindings/src/server/ReactDOMServerFormatConfig.js b/packages/react-dom-bindings/src/server/ReactDOMServerFormatConfig.js index a7f1a20cc1f15..d9c16f776723c 100644 --- a/packages/react-dom-bindings/src/server/ReactDOMServerFormatConfig.js +++ b/packages/react-dom-bindings/src/server/ReactDOMServerFormatConfig.js @@ -155,15 +155,19 @@ const endAsyncScript = stringToPrecomputedChunk('" async="">'); * While untrusted script content should be made safe before using this api it will * ensure that the script cannot be early terminated or never terminated state */ -function escapeBootstrapScriptContent(scriptText) { +function escapeBootstrapScriptContent(scriptText: string) { if (__DEV__) { checkHtmlStringCoercion(scriptText); } return ('' + scriptText).replace(scriptRegex, scriptReplacer); } const scriptRegex = /(<\/|<)(s)(cript)/gi; -const scriptReplacer = (match, prefix, s, suffix) => - `${prefix}${s === 's' ? '\\u0073' : '\\u0053'}${suffix}`; +const scriptReplacer = ( + match: string, + prefix: string, + s: string, + suffix: string, +) => `${prefix}${s === 's' ? '\\u0073' : '\\u0053'}${suffix}`; export type BootstrapScriptDescriptor = { src: string, @@ -737,8 +741,8 @@ const endOfStartTagSelfClosing = stringToPrecomputedChunk('/>'); function pushInnerHTML( target: Array, - innerHTML, - children, + innerHTML: any, + children: any, ) { if (innerHTML != null) { if (children != null) { @@ -775,7 +779,7 @@ let didWarnInvalidOptionChildren = false; let didWarnInvalidOptionInnerHTML = false; let didWarnSelectedSetOnOption = false; -function checkSelectProp(props, propName) { +function checkSelectProp(props: any, propName: string) { if (__DEV__) { const value = props[propName]; if (value != null) { diff --git a/packages/react-dom-bindings/src/server/escapeTextForBrowser.js b/packages/react-dom-bindings/src/server/escapeTextForBrowser.js index 90407972ba02a..bccad868209dd 100644 --- a/packages/react-dom-bindings/src/server/escapeTextForBrowser.js +++ b/packages/react-dom-bindings/src/server/escapeTextForBrowser.js @@ -50,7 +50,7 @@ const matchHtmlRegExp = /["'&<>]/; * @public */ -function escapeHtml(string) { +function escapeHtml(string: string) { if (__DEV__) { checkHtmlStringCoercion(string); } diff --git a/packages/react-dom-bindings/src/shared/DOMProperty.js b/packages/react-dom-bindings/src/shared/DOMProperty.js index 11b9e3341203f..f69d9b9297d97 100644 --- a/packages/react-dom-bindings/src/shared/DOMProperty.js +++ b/packages/react-dom-bindings/src/shared/DOMProperty.js @@ -214,6 +214,7 @@ export function getPropertyInfo(name: string): PropertyInfo | null { } function PropertyInfoRecord( + this: any, name: string, type: PropertyType, mustUseProperty: boolean, @@ -456,7 +457,7 @@ reservedProps.forEach(name => { }); const CAMELIZE = /[\-\:]([a-z])/g; -const capitalize = token => token[1].toUpperCase(); +const capitalize = (token: string) => token[1].toUpperCase(); // This is a list of all SVG attributes that need special casing, namespacing, // or boolean value assignment. Regular attributes that just accept strings diff --git a/packages/react-dom/src/client/ReactDOMRoot.js b/packages/react-dom/src/client/ReactDOMRoot.js index a4b901d156d78..ffdc4bd4bca03 100644 --- a/packages/react-dom/src/client/ReactDOMRoot.js +++ b/packages/react-dom/src/client/ReactDOMRoot.js @@ -91,12 +91,13 @@ const defaultOnRecoverableError = console['error'](error); }; -function ReactDOMRoot(internalRoot: FiberRoot) { +function ReactDOMRoot(this: any, internalRoot: FiberRoot) { this._internalRoot = internalRoot; } // $FlowFixMe[prop-missing] found when upgrading Flow ReactDOMHydrationRoot.prototype.render = ReactDOMRoot.prototype.render = function( + this: any, children: ReactNodeList, ): void { const root = this._internalRoot; @@ -146,7 +147,9 @@ ReactDOMHydrationRoot.prototype.render = ReactDOMRoot.prototype.render = functio }; // $FlowFixMe[prop-missing] found when upgrading Flow -ReactDOMHydrationRoot.prototype.unmount = ReactDOMRoot.prototype.unmount = function(): void { +ReactDOMHydrationRoot.prototype.unmount = ReactDOMRoot.prototype.unmount = function( + this: any, +): void { if (__DEV__) { if (typeof arguments[0] === 'function') { console.error( @@ -259,7 +262,7 @@ export function createRoot( return new ReactDOMRoot(root); } -function ReactDOMHydrationRoot(internalRoot: FiberRoot) { +function ReactDOMHydrationRoot(this: any, internalRoot: FiberRoot) { this._internalRoot = internalRoot; } function scheduleHydration(target: Node) { diff --git a/packages/react-dom/src/server/ReactDOMFizzServerNode.js b/packages/react-dom/src/server/ReactDOMFizzServerNode.js index e739b61b89e4d..7fa6d6a9cc0b4 100644 --- a/packages/react-dom/src/server/ReactDOMFizzServerNode.js +++ b/packages/react-dom/src/server/ReactDOMFizzServerNode.js @@ -7,6 +7,7 @@ * @flow */ +import type {Request} from 'react-server/src/ReactFizzServer'; import type {ReactNodeList} from 'shared/ReactTypes'; import type {Writable} from 'stream'; import type {BootstrapScriptDescriptor} from 'react-dom-bindings/src/server/ReactDOMServerFormatConfig'; @@ -26,11 +27,11 @@ import { createRootFormatContext, } from 'react-dom-bindings/src/server/ReactDOMServerFormatConfig'; -function createDrainHandler(destination: Destination, request) { +function createDrainHandler(destination: Destination, request: Request) { return () => startFlowing(request, destination); } -function createAbortHandler(request, reason) { +function createAbortHandler(request: Request, reason: string) { // eslint-disable-next-line react-internal/prod-error-codes return () => abort(request, new Error(reason)); } diff --git a/packages/react-dom/src/server/ReactDOMFizzStaticNode.js b/packages/react-dom/src/server/ReactDOMFizzStaticNode.js index 5f1a6f57409b5..eb0228fa6d52c 100644 --- a/packages/react-dom/src/server/ReactDOMFizzStaticNode.js +++ b/packages/react-dom/src/server/ReactDOMFizzStaticNode.js @@ -42,7 +42,7 @@ type StaticResult = { prelude: Readable, }; -function createFakeWritable(readable): Writable { +function createFakeWritable(readable: any): Writable { // The current host config expects a Writable so we create // a fake writable for now to push into the Readable. return ({ diff --git a/packages/react-interactions/events/src/dom/create-event-handle/Focus.js b/packages/react-interactions/events/src/dom/create-event-handle/Focus.js index 563fbaae0b474..16ce67848cf87 100644 --- a/packages/react-interactions/events/src/dom/create-event-handle/Focus.js +++ b/packages/react-interactions/events/src/dom/create-event-handle/Focus.js @@ -97,7 +97,7 @@ function handleGlobalFocusVisibleEvent( function handleFocusVisibleTargetEvents( event: SyntheticEvent, - callback, + callback: boolean => void, ): void { if (event.type === 'keydown') { const {nativeEvent} = (event: any); @@ -127,7 +127,7 @@ function isRelatedTargetWithin( function setFocusVisibleListeners( focusVisibleHandles, focusTarget: EventTarget, - callback, + callback: boolean => void, ) { focusVisibleHandles.forEach(focusVisibleHandle => { focusVisibleHandle.setListener(focusTarget, event => diff --git a/packages/react-reconciler/src/DebugTracing.js b/packages/react-reconciler/src/DebugTracing.js index e2162892fd7f6..a5302f3dcebde 100644 --- a/packages/react-reconciler/src/DebugTracing.js +++ b/packages/react-reconciler/src/DebugTracing.js @@ -22,7 +22,7 @@ function formatLanes(laneOrLanes: Lane | Lanes): string { return '0b' + (laneOrLanes: any).toString(2).padStart(31, '0'); } -function group(...groupArgs): void { +function group(...groupArgs: Array): void { pendingGroupArgs.push(groupArgs); if (nativeConsoleLog === null) { @@ -44,7 +44,7 @@ function groupEnd(): void { } } -function log(...logArgs): void { +function log(...logArgs: Array): void { if (printedGroupIndex < pendingGroupArgs.length - 1) { for (let i = printedGroupIndex + 1; i < pendingGroupArgs.length; i++) { const groupArgs = pendingGroupArgs[i]; diff --git a/packages/react-reconciler/src/ReactChildFiber.js b/packages/react-reconciler/src/ReactChildFiber.js index b3d2fe0239f8b..09f318969a001 100644 --- a/packages/react-reconciler/src/ReactChildFiber.js +++ b/packages/react-reconciler/src/ReactChildFiber.js @@ -97,7 +97,7 @@ if (__DEV__) { }; } -function isReactClass(type) { +function isReactClass(type: any) { return type.prototype && type.prototype.isReactComponent; } @@ -203,7 +203,7 @@ function coerceRef( ) { return current.ref; } - const ref = function(value) { + const ref = function(value: mixed) { const refs = resolvedInst.refs; if (value === null) { delete refs[stringRef]; @@ -267,7 +267,7 @@ function warnOnFunctionType(returnFiber: Fiber) { } } -function resolveLazy(lazyType) { +function resolveLazy(lazyType: any) { const payload = lazyType._payload; const init = lazyType._init; return init(payload); @@ -284,7 +284,9 @@ type ChildReconciler = ( // to be able to optimize each path individually by branching early. This needs // a compiler or we can do it manually. Helpers that don't need this branching // live outside of this function. -function createChildReconciler(shouldTrackSideEffects): ChildReconciler { +function createChildReconciler( + shouldTrackSideEffects: boolean, +): ChildReconciler { function deleteChild(returnFiber: Fiber, childToDelete: Fiber): void { if (!shouldTrackSideEffects) { // Noop. diff --git a/packages/react-reconciler/src/ReactFiber.js b/packages/react-reconciler/src/ReactFiber.js index f1e473ebf0b98..44e21bc4ecd65 100644 --- a/packages/react-reconciler/src/ReactFiber.js +++ b/packages/react-reconciler/src/ReactFiber.js @@ -132,6 +132,7 @@ if (__DEV__) { } function FiberNode( + this: $FlowFixMe, tag: WorkTag, pendingProps: mixed, key: null | string, diff --git a/packages/react-reconciler/src/ReactFiberBeginWork.js b/packages/react-reconciler/src/ReactFiberBeginWork.js index 53ed65925b97f..cb48a75525349 100644 --- a/packages/react-reconciler/src/ReactFiberBeginWork.js +++ b/packages/react-reconciler/src/ReactFiberBeginWork.js @@ -1085,11 +1085,11 @@ function markRef(current: Fiber | null, workInProgress: Fiber) { } function updateFunctionComponent( - current, - workInProgress, - Component, + current: null | Fiber, + workInProgress: Fiber, + Component: any, nextProps: any, - renderLanes, + renderLanes: Lanes, ) { if (__DEV__) { if (workInProgress.type !== workInProgress.elementType) { @@ -1425,7 +1425,7 @@ function finishClassComponent( return workInProgress.child; } -function pushHostRootContext(workInProgress) { +function pushHostRootContext(workInProgress: Fiber) { const root = (workInProgress.stateNode: FiberRoot); if (root.pendingContext) { pushTopLevelContextObject( @@ -1440,7 +1440,11 @@ function pushHostRootContext(workInProgress) { pushHostContainer(workInProgress, root.containerInfo); } -function updateHostRoot(current, workInProgress, renderLanes) { +function updateHostRoot( + current: null | Fiber, + workInProgress: Fiber, + renderLanes: Lanes, +) { pushHostRootContext(workInProgress); if (current === null) { @@ -1625,7 +1629,11 @@ function updateHostComponent( return workInProgress.child; } -function updateHostResource(current, workInProgress, renderLanes) { +function updateHostResource( + current: null | Fiber, + workInProgress: Fiber, + renderLanes: Lanes, +) { pushHostContext(workInProgress); markRef(current, workInProgress); const currentProps = current === null ? null : current.memoizedProps; @@ -1673,7 +1681,7 @@ function updateHostSingleton( return workInProgress.child; } -function updateHostText(current, workInProgress) { +function updateHostText(current: null | Fiber, workInProgress: Fiber) { if (current === null) { tryToClaimNextHydratableInstance(workInProgress); } @@ -1683,10 +1691,10 @@ function updateHostText(current, workInProgress) { } function mountLazyComponent( - _current, - workInProgress, - elementType, - renderLanes, + _current: null | Fiber, + workInProgress: Fiber, + elementType: any, + renderLanes: Lanes, ) { resetSuspendedCurrentOnMountInLegacyMode(_current, workInProgress); @@ -1792,11 +1800,11 @@ function mountLazyComponent( } function mountIncompleteClassComponent( - _current, - workInProgress, - Component, - nextProps, - renderLanes, + _current: null | Fiber, + workInProgress: Fiber, + Component: any, + nextProps: any, + renderLanes: Lanes, ) { resetSuspendedCurrentOnMountInLegacyMode(_current, workInProgress); @@ -1831,10 +1839,10 @@ function mountIncompleteClassComponent( } function mountIndeterminateComponent( - _current, - workInProgress, - Component, - renderLanes, + _current: null | Fiber, + workInProgress: Fiber, + Component: $FlowFixMe, + renderLanes: Lanes, ) { resetSuspendedCurrentOnMountInLegacyMode(_current, workInProgress); @@ -2171,12 +2179,16 @@ function shouldRemainOnFallback( ); } -function getRemainingWorkInPrimaryTree(current: Fiber, renderLanes) { +function getRemainingWorkInPrimaryTree(current: Fiber, renderLanes: Lanes) { // TODO: Should not remove render lanes that were pinged during this render return removeLanes(current.childLanes, renderLanes); } -function updateSuspenseComponent(current, workInProgress, renderLanes) { +function updateSuspenseComponent( + current: null | Fiber, + workInProgress: Fiber, + renderLanes: Lanes, +) { const nextProps = workInProgress.pendingProps; // This is used by DevTools to force a boundary to suspend. @@ -2423,9 +2435,9 @@ function updateSuspenseComponent(current, workInProgress, renderLanes) { } function mountSuspensePrimaryChildren( - workInProgress, - primaryChildren, - renderLanes, + workInProgress: Fiber, + primaryChildren: $FlowFixMe, + renderLanes: Lanes, ) { const mode = workInProgress.mode; const primaryChildProps: OffscreenProps = { @@ -2443,10 +2455,10 @@ function mountSuspensePrimaryChildren( } function mountSuspenseFallbackChildren( - workInProgress, - primaryChildren, - fallbackChildren, - renderLanes, + workInProgress: Fiber, + primaryChildren: $FlowFixMe, + fallbackChildren: $FlowFixMe, + renderLanes: Lanes, ) { const mode = workInProgress.mode; const progressedPrimaryFragment: Fiber | null = workInProgress.child; @@ -2526,10 +2538,10 @@ function updateWorkInProgressOffscreenFiber( } function updateSuspensePrimaryChildren( - current, - workInProgress, - primaryChildren, - renderLanes, + current: Fiber, + workInProgress: Fiber, + primaryChildren: $FlowFixMe, + renderLanes: Lanes, ) { const currentPrimaryChildFragment: Fiber = (current.child: any); const currentFallbackChildFragment: Fiber | null = @@ -2563,11 +2575,11 @@ function updateSuspensePrimaryChildren( } function updateSuspenseFallbackChildren( - current, - workInProgress, - primaryChildren, - fallbackChildren, - renderLanes, + current: Fiber, + workInProgress: Fiber, + primaryChildren: $FlowFixMe, + fallbackChildren: $FlowFixMe, + renderLanes: Lanes, ) { const mode = workInProgress.mode; const currentPrimaryChildFragment: Fiber = (current.child: any); @@ -2688,11 +2700,11 @@ function retrySuspenseComponentWithoutHydrating( } function mountSuspenseFallbackAfterRetryWithoutHydrating( - current, - workInProgress, - primaryChildren, - fallbackChildren, - renderLanes, + current: Fiber, + workInProgress: Fiber, + primaryChildren: $FlowFixMe, + fallbackChildren: $FlowFixMe, + renderLanes: Lanes, ) { const fiberMode = workInProgress.mode; const primaryChildProps: OffscreenProps = { @@ -3550,7 +3562,11 @@ function updateContextConsumer( return workInProgress.child; } -function updateScopeComponent(current, workInProgress, renderLanes) { +function updateScopeComponent( + current: null | Fiber, + workInProgress: Fiber, + renderLanes: Lanes, +) { const nextProps = workInProgress.pendingProps; const nextChildren = nextProps.children; @@ -3566,7 +3582,10 @@ export function checkIfWorkInProgressReceivedUpdate(): boolean { return didReceiveUpdate; } -function resetSuspendedCurrentOnMountInLegacyMode(current, workInProgress) { +function resetSuspendedCurrentOnMountInLegacyMode( + current: null | Fiber, + workInProgress: Fiber, +) { if ((workInProgress.mode & ConcurrentMode) === NoMode) { if (current !== null) { // A lazy component only mounts if it suspended inside a non- diff --git a/packages/react-reconciler/src/ReactFiberCacheComponent.js b/packages/react-reconciler/src/ReactFiberCacheComponent.js index 90a1e698a6ad1..0ab01438c9015 100644 --- a/packages/react-reconciler/src/ReactFiberCacheComponent.js +++ b/packages/react-reconciler/src/ReactFiberCacheComponent.js @@ -21,7 +21,7 @@ import * as Scheduler from 'scheduler'; const AbortControllerLocal: typeof AbortController = enableCache ? typeof AbortController !== 'undefined' ? AbortController - : (function AbortControllerShim() { + : (function AbortControllerShim(this: any) { const listeners = []; const signal = (this.signal = { aborted: false, diff --git a/packages/react-reconciler/src/ReactFiberClassComponent.js b/packages/react-reconciler/src/ReactFiberClassComponent.js index f8a80f7ffbeb1..5f39a1fd12295 100644 --- a/packages/react-reconciler/src/ReactFiberClassComponent.js +++ b/packages/react-reconciler/src/ReactFiberClassComponent.js @@ -118,7 +118,7 @@ if (__DEV__) { } }; - warnOnUndefinedDerivedState = function(type, partialState) { + warnOnUndefinedDerivedState = function(type: any, partialState: any) { if (partialState === undefined) { const componentName = getComponentNameFromType(type) || 'Component'; if (!didWarnAboutUndefinedDerivedState.has(componentName)) { @@ -194,7 +194,7 @@ function applyDerivedStateFromProps( const classComponentUpdater = { isMounted, - enqueueSetState(inst, payload, callback) { + enqueueSetState(inst: any, payload: any, callback) { const fiber = getInstance(inst); const eventTime = requestEventTime(); const lane = requestUpdateLane(fiber); @@ -227,7 +227,7 @@ const classComponentUpdater = { markStateUpdateScheduled(fiber, lane); } }, - enqueueReplaceState(inst, payload, callback) { + enqueueReplaceState(inst: any, payload: any, callback: null) { const fiber = getInstance(inst); const eventTime = requestEventTime(); const lane = requestUpdateLane(fiber); @@ -262,7 +262,7 @@ const classComponentUpdater = { markStateUpdateScheduled(fiber, lane); } }, - enqueueForceUpdate(inst, callback) { + enqueueForceUpdate(inst: any, callback) { const fiber = getInstance(inst); const eventTime = requestEventTime(); const lane = requestUpdateLane(fiber); @@ -299,13 +299,13 @@ const classComponentUpdater = { }; function checkShouldComponentUpdate( - workInProgress, - ctor, - oldProps, - newProps, - oldState, - newState, - nextContext, + workInProgress: Fiber, + ctor: any, + oldProps: any, + newProps: any, + oldState: any, + newState: any, + nextContext: any, ) { const instance = workInProgress.stateNode; if (typeof instance.shouldComponentUpdate === 'function') { @@ -760,7 +760,7 @@ function constructClassInstance( return instance; } -function callComponentWillMount(workInProgress, instance) { +function callComponentWillMount(workInProgress: Fiber, instance: any) { const oldState = instance.state; if (typeof instance.componentWillMount === 'function') { @@ -784,10 +784,10 @@ function callComponentWillMount(workInProgress, instance) { } function callComponentWillReceiveProps( - workInProgress, - instance, - newProps, - nextContext, + workInProgress: Fiber, + instance: any, + newProps: any, + nextContext: any, ) { const oldState = instance.state; if (typeof instance.componentWillReceiveProps === 'function') { diff --git a/packages/react-reconciler/src/ReactFiberClassUpdateQueue.js b/packages/react-reconciler/src/ReactFiberClassUpdateQueue.js index fa2de881dd59a..9f740716edc30 100644 --- a/packages/react-reconciler/src/ReactFiberClassUpdateQueue.js +++ b/packages/react-reconciler/src/ReactFiberClassUpdateQueue.js @@ -676,7 +676,7 @@ export function processUpdateQueue( } } -function callCallback(callback, context) { +function callCallback(callback: () => mixed, context: any) { if (typeof callback !== 'function') { throw new Error( 'Invalid argument passed as callback. Expected a function. Instead ' + diff --git a/packages/react-reconciler/src/ReactFiberCommitWork.js b/packages/react-reconciler/src/ReactFiberCommitWork.js index 363e6408711cf..e58ecf95e0877 100644 --- a/packages/react-reconciler/src/ReactFiberCommitWork.js +++ b/packages/react-reconciler/src/ReactFiberCommitWork.js @@ -248,7 +248,10 @@ export function reportUncaughtErrorInDEV(error: mixed) { } } -const callComponentWillUnmountWithTimer = function(current, instance) { +const callComponentWillUnmountWithTimer = function( + current: Fiber, + instance: any, +) { instance.props = current.memoizedProps; instance.state = current.memoizedState; if (shouldProfile(current)) { @@ -1495,7 +1498,7 @@ function commitTransitionProgress(offscreenFiber: Fiber) { } } -function hideOrUnhideAllChildren(finishedWork, isHidden) { +function hideOrUnhideAllChildren(finishedWork: Fiber, isHidden: boolean) { // Only hide or unhide the top-most host nodes. let hostSubtreeRoot = null; @@ -2018,9 +2021,9 @@ function commitDeletionEffects( } function recursivelyTraverseDeletionEffects( - finishedRoot, - nearestMountedAncestor, - parent, + finishedRoot: FiberRoot, + nearestMountedAncestor: Fiber, + parent: Fiber, ) { // TODO: Use a static flag to skip trees that don't have unmount effects let child = parent.child; @@ -2374,7 +2377,7 @@ function commitSuspenseHydrationCallbacks( } } -function getRetryCache(finishedWork) { +function getRetryCache(finishedWork: Fiber) { // TODO: Unify the interface for the retry cache so we don't have to switch // on the tag like this. switch (finishedWork.tag) { @@ -4017,7 +4020,7 @@ function detachAlternateSiblings(parentFiber: Fiber) { function commitHookPassiveUnmountEffects( finishedWork: Fiber, - nearestMountedAncestor, + nearestMountedAncestor: null | Fiber, hookFlags: HookFlags, ) { if (shouldProfile(finishedWork)) { diff --git a/packages/react-reconciler/src/ReactFiberHooks.js b/packages/react-reconciler/src/ReactFiberHooks.js index eebd50915f31e..21454423a9a6e 100644 --- a/packages/react-reconciler/src/ReactFiberHooks.js +++ b/packages/react-reconciler/src/ReactFiberHooks.js @@ -1801,7 +1801,7 @@ function checkIfSnapshotChanged(inst: StoreInstance): boolean { } } -function forceStoreRerender(fiber) { +function forceStoreRerender(fiber: Fiber) { const root = enqueueConcurrentRenderForLane(fiber, SyncLane); if (root !== null) { scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp); @@ -1934,7 +1934,7 @@ function mountRef(initialValue: T): {current: T} { } return current; }, - set current(value) { + set current(value: any) { if (currentlyRenderingFiber !== null && !didWarnAboutWrite) { if (hasBeenInitialized || !didCheckForLazyInit) { didWarnAboutWrite = true; @@ -2736,7 +2736,7 @@ function entangleTransitionUpdate( } } -function markUpdateInDevTools(fiber, lane, action: A): void { +function markUpdateInDevTools(fiber: Fiber, lane: Lane, action: A): void { if (__DEV__) { if (enableDebugTracing) { if (fiber.mode & DebugTracingMode) { diff --git a/packages/react-reconciler/src/ReactFiberHydrationContext.js b/packages/react-reconciler/src/ReactFiberHydrationContext.js index 4b5bc198a5e9f..ac7616920542a 100644 --- a/packages/react-reconciler/src/ReactFiberHydrationContext.js +++ b/packages/react-reconciler/src/ReactFiberHydrationContext.js @@ -338,7 +338,7 @@ function insertNonHydratedInstance(returnFiber: Fiber, fiber: Fiber) { warnNonhydratedInstance(returnFiber, fiber); } -function tryHydrate(fiber, nextInstance) { +function tryHydrate(fiber: Fiber, nextInstance: any) { switch (fiber.tag) { // HostSingleton is intentionally omitted. the hydration pathway for singletons is non-fallible // you can find it inlined in claimHydratableSingleton diff --git a/packages/react-reconciler/src/ReactFiberReconciler.js b/packages/react-reconciler/src/ReactFiberReconciler.js index 32ffad44a79e4..9d3861065a0ba 100644 --- a/packages/react-reconciler/src/ReactFiberReconciler.js +++ b/packages/react-reconciler/src/ReactFiberReconciler.js @@ -533,7 +533,7 @@ export function shouldError(fiber: Fiber): ?boolean { return shouldErrorImpl(fiber); } -let shouldSuspendImpl = fiber => false; +let shouldSuspendImpl = (fiber: Fiber) => false; export function shouldSuspend(fiber: Fiber): boolean { return shouldSuspendImpl(fiber); diff --git a/packages/react-reconciler/src/ReactFiberRoot.js b/packages/react-reconciler/src/ReactFiberRoot.js index 8ffec15b3a942..bfaf176a019ab 100644 --- a/packages/react-reconciler/src/ReactFiberRoot.js +++ b/packages/react-reconciler/src/ReactFiberRoot.js @@ -45,11 +45,12 @@ export type RootState = { }; function FiberRootNode( - containerInfo, + this: $FlowFixMe, + containerInfo: any, tag, - hydrate, - identifierPrefix, - onRecoverableError, + hydrate: any, + identifierPrefix: any, + onRecoverableError: any, ) { this.tag = tag; this.containerInfo = containerInfo; diff --git a/packages/react-reconciler/src/ReactFiberScope.js b/packages/react-reconciler/src/ReactFiberScope.js index 3ce4ac784ce5b..9e92bd483e589 100644 --- a/packages/react-reconciler/src/ReactFiberScope.js +++ b/packages/react-reconciler/src/ReactFiberScope.js @@ -140,7 +140,10 @@ function collectNearestChildContextValues( } } -function DO_NOT_USE_queryAllNodes(fn: ReactScopeQuery): null | Array { +function DO_NOT_USE_queryAllNodes( + this: $FlowFixMe, + fn: ReactScopeQuery, +): null | Array { const currentFiber = getInstanceFromScope(this); if (currentFiber === null) { return null; @@ -153,7 +156,10 @@ function DO_NOT_USE_queryAllNodes(fn: ReactScopeQuery): null | Array { return scopedNodes.length === 0 ? null : scopedNodes; } -function DO_NOT_USE_queryFirstNode(fn: ReactScopeQuery): null | Object { +function DO_NOT_USE_queryFirstNode( + this: $FlowFixMe, + fn: ReactScopeQuery, +): null | Object { const currentFiber = getInstanceFromScope(this); if (currentFiber === null) { return null; @@ -165,7 +171,7 @@ function DO_NOT_USE_queryFirstNode(fn: ReactScopeQuery): null | Object { return null; } -function containsNode(node: Object): boolean { +function containsNode(this: $FlowFixMe, node: Object): boolean { let fiber = getInstanceFromNode(node); while (fiber !== null) { if (fiber.tag === ScopeComponent && fiber.stateNode === this) { @@ -176,7 +182,10 @@ function containsNode(node: Object): boolean { return false; } -function getChildContextValues(context: ReactContext): Array { +function getChildContextValues( + this: $FlowFixMe, + context: ReactContext, +): Array { const currentFiber = getInstanceFromScope(this); if (currentFiber === null) { return []; diff --git a/packages/react-reconciler/src/ReactFiberThrow.js b/packages/react-reconciler/src/ReactFiberThrow.js index 7390a25e72d79..1f1d47c25fa1e 100644 --- a/packages/react-reconciler/src/ReactFiberThrow.js +++ b/packages/react-reconciler/src/ReactFiberThrow.js @@ -123,7 +123,7 @@ function createClassErrorUpdate( const inst = fiber.stateNode; if (inst !== null && typeof inst.componentDidCatch === 'function') { - update.callback = function callback() { + update.callback = function callback(this: any) { if (__DEV__) { markFailedErrorBoundaryForHotReloading(fiber); } diff --git a/packages/react-reconciler/src/ReactFiberTreeReflection.js b/packages/react-reconciler/src/ReactFiberTreeReflection.js index ed10c62f99844..217a421248db4 100644 --- a/packages/react-reconciler/src/ReactFiberTreeReflection.js +++ b/packages/react-reconciler/src/ReactFiberTreeReflection.js @@ -117,7 +117,7 @@ export function isMounted(component: React$Component): boolean { return getNearestMountedFiber(fiber) === fiber; } -function assertIsMounted(fiber) { +function assertIsMounted(fiber: Fiber) { if (getNearestMountedFiber(fiber) !== fiber) { throw new Error('Unable to find node on an unmounted component.'); } diff --git a/packages/react-reconciler/src/ReactFiberWorkLoop.js b/packages/react-reconciler/src/ReactFiberWorkLoop.js index b6efb85e19728..692d0a9943db5 100644 --- a/packages/react-reconciler/src/ReactFiberWorkLoop.js +++ b/packages/react-reconciler/src/ReactFiberWorkLoop.js @@ -1003,7 +1003,7 @@ function ensureRootIsScheduled(root: FiberRoot, currentTime: number) { // This is the entry point for every concurrent task, i.e. anything that // goes through Scheduler. -function performConcurrentWorkOnRoot(root, didTimeout) { +function performConcurrentWorkOnRoot(root: FiberRoot, didTimeout) { if (enableProfilerTimer && enableProfilerNestedUpdatePhase) { resetNestedUpdateFlag(); } @@ -1171,9 +1171,9 @@ function performConcurrentWorkOnRoot(root, didTimeout) { } function recoverFromConcurrentError( - root, - originallyAttemptedLanes, - errorRetryLanes, + root: FiberRoot, + originallyAttemptedLanes: Lanes, + errorRetryLanes: Lanes, ) { // If an error occurred during hydration, discard server response and fall // back to client side render. @@ -1259,7 +1259,11 @@ export function queueRecoverableErrors(errors: Array>) { } } -function finishConcurrentRender(root, exitStatus, lanes) { +function finishConcurrentRender( + root: FiberRoot, + exitStatus: RootExitStatus, + lanes: Lanes, +) { switch (exitStatus) { case RootInProgress: case RootFatalErrored: { @@ -1439,7 +1443,7 @@ function isRenderConsistentWithExternalStores(finishedWork: Fiber): boolean { return true; } -function markRootSuspended(root, suspendedLanes) { +function markRootSuspended(root: FiberRoot, suspendedLanes: Lanes) { // When suspending, we should always exclude lanes that were pinged or (more // rarely, since we try to avoid it) updated during the render phase. // TODO: Lol maybe there's a better way to factor this besides this @@ -1449,13 +1453,12 @@ function markRootSuspended(root, suspendedLanes) { suspendedLanes, workInProgressRootInterleavedUpdatedLanes, ); - // $FlowFixMe[incompatible-call] found when upgrading Flow markRootSuspended_dontCallThisOneDirectly(root, suspendedLanes); } // This is the entry point for synchronous tasks that don't go // through Scheduler -function performSyncWorkOnRoot(root) { +function performSyncWorkOnRoot(root: FiberRoot) { if (enableProfilerTimer && enableProfilerNestedUpdatePhase) { syncNestedUpdateFlag(); } @@ -1764,7 +1767,7 @@ function resetSuspendedWorkLoopOnUnwind() { resetHooksOnUnwind(); } -function handleThrow(root, thrownValue): void { +function handleThrow(root: FiberRoot, thrownValue: any): void { // A component threw an exception. Usually this is because it suspended, but // it also includes regular program errors. // @@ -1902,7 +1905,7 @@ function shouldAttemptToSuspendUntilDataResolves() { return false; } -function pushDispatcher(container) { +function pushDispatcher(container: any) { prepareRendererToRender(container); const prevDispatcher = ReactCurrentDispatcher.current; ReactCurrentDispatcher.current = ContextOnlyDispatcher; @@ -1916,7 +1919,7 @@ function pushDispatcher(container) { } } -function popDispatcher(prevDispatcher) { +function popDispatcher(prevDispatcher: any) { resetRendererAfterRender(); ReactCurrentDispatcher.current = prevDispatcher; } @@ -1931,7 +1934,7 @@ function pushCacheDispatcher() { } } -function popCacheDispatcher(prevCacheDispatcher) { +function popCacheDispatcher(prevCacheDispatcher: any) { if (enableCache) { ReactCurrentCache.current = prevCacheDispatcher; } @@ -1973,6 +1976,7 @@ export function renderDidSuspendDelayIfPossible(): void { // pinged or updated while we were rendering. // TODO: Consider unwinding immediately, using the // SuspendedOnHydration mechanism. + // $FlowFixMe[incompatible-call] need null check workInProgressRoot markRootSuspended(workInProgressRoot, workInProgressRootRenderLanes); } } @@ -3753,7 +3757,7 @@ export function warnAboutUpdateOnNotYetMountedFiberInDEV(fiber: Fiber) { let beginWork; if (__DEV__ && replayFailedUnitOfWorkWithInvokeGuardedCallback) { const dummyFiber = null; - beginWork = (current, unitOfWork, lanes) => { + beginWork = (current: null | Fiber, unitOfWork: Fiber, lanes: Lanes) => { // If a component throws an error, we replay it again in a synchronously // dispatched event, so that the debugger will treat it as an uncaught // error See ReactErrorUtils for more information. @@ -3834,7 +3838,7 @@ if (__DEV__) { didWarnAboutUpdateInRenderForAnotherComponent = new Set(); } -function warnAboutRenderPhaseUpdatesInDEV(fiber) { +function warnAboutRenderPhaseUpdatesInDEV(fiber: Fiber) { if (__DEV__) { if (ReactCurrentDebugFiberIsRenderingInDEV) { switch (fiber.tag) { @@ -3893,7 +3897,7 @@ export function restorePendingUpdaters(root: FiberRoot, lanes: Lanes): void { } const fakeActCallbackNode = {}; -function scheduleCallback(priorityLevel, callback) { +function scheduleCallback(priorityLevel: any, callback) { if (__DEV__) { // If we're currently inside an `act` scope, bypass Scheduler and push to // the `act` queue instead. @@ -3910,7 +3914,7 @@ function scheduleCallback(priorityLevel, callback) { } } -function cancelCallback(callbackNode) { +function cancelCallback(callbackNode: any) { if (__DEV__ && callbackNode === fakeActCallbackNode) { return; } diff --git a/packages/react-reconciler/src/ReactStrictModeWarnings.js b/packages/react-reconciler/src/ReactStrictModeWarnings.js index a4a36a7aa3091..900fa68a6cd34 100644 --- a/packages/react-reconciler/src/ReactStrictModeWarnings.js +++ b/packages/react-reconciler/src/ReactStrictModeWarnings.js @@ -42,7 +42,7 @@ if (__DEV__) { return maybeStrictRoot; }; - const setToSortedString = set => { + const setToSortedString = (set: Set) => { const array = []; set.forEach(value => { array.push(value); diff --git a/packages/react-refresh/src/ReactFreshRuntime.js b/packages/react-refresh/src/ReactFreshRuntime.js index 6a936513a1e12..68f0e6281e4ce 100644 --- a/packages/react-refresh/src/ReactFreshRuntime.js +++ b/packages/react-refresh/src/ReactFreshRuntime.js @@ -123,7 +123,7 @@ function computeFullKey(signature: Signature): string { return fullKey; } -function haveEqualSignatures(prevType, nextType) { +function haveEqualSignatures(prevType: any, nextType: any) { const prevSignature = allSignaturesByType.get(prevType); const nextSignature = allSignaturesByType.get(nextType); @@ -143,11 +143,11 @@ function haveEqualSignatures(prevType, nextType) { return true; } -function isReactClass(type) { +function isReactClass(type: any) { return type.prototype && type.prototype.isReactComponent; } -function canPreserveStateBetween(prevType, nextType) { +function canPreserveStateBetween(prevType: any, nextType: any) { if (isReactClass(prevType) || isReactClass(nextType)) { return false; } @@ -157,7 +157,7 @@ function canPreserveStateBetween(prevType, nextType) { return false; } -function resolveFamily(type) { +function resolveFamily(type: any) { // Only check updated types to keep lookups fast. return updatedFamiliesByType.get(type); } @@ -179,7 +179,7 @@ function cloneSet(set: Set): Set { } // This is a safety mechanism to protect against rogue getters and Proxies. -function getProperty(object, property) { +function getProperty(object: any, property: string) { try { return object[property]; } catch (err) { @@ -489,7 +489,7 @@ export function injectIntoGlobalHook(globalObject: any): void { // Here, we just want to get a reference to scheduleRefresh. const oldInject = hook.inject; - hook.inject = function(injected) { + hook.inject = function(this: mixed, injected) { const id = oldInject.apply(this, arguments); if ( typeof injected.scheduleRefresh === 'function' && @@ -518,6 +518,7 @@ export function injectIntoGlobalHook(globalObject: any): void { const oldOnCommitFiberRoot = hook.onCommitFiberRoot; const oldOnScheduleFiberRoot = hook.onScheduleFiberRoot || (() => {}); hook.onScheduleFiberRoot = function( + this: mixed, id: number, root: FiberRoot, children: ReactNodeList, @@ -533,6 +534,7 @@ export function injectIntoGlobalHook(globalObject: any): void { return oldOnScheduleFiberRoot.apply(this, arguments); }; hook.onCommitFiberRoot = function( + this: mixed, id: number, root: FiberRoot, maybePriorityLevel: mixed, diff --git a/packages/react-server-dom-webpack/src/ReactFlightDOMClient.js b/packages/react-server-dom-webpack/src/ReactFlightDOMClient.js index 13fbb0e32881d..1247113ef93d0 100644 --- a/packages/react-server-dom-webpack/src/ReactFlightDOMClient.js +++ b/packages/react-server-dom-webpack/src/ReactFlightDOMClient.js @@ -31,7 +31,7 @@ function startReadingFromStream( stream: ReadableStream, ): void { const reader = stream.getReader(); - function progress({done, value}) { + function progress({done, value}: {done: boolean, value: ?any, ...}) { if (done) { close(response); return; @@ -43,7 +43,7 @@ function startReadingFromStream( .then(progress) .catch(error); } - function error(e) { + function error(e: any) { reportGlobalError(response, e); } reader diff --git a/packages/react-server-dom-webpack/src/ReactFlightDOMServerNode.js b/packages/react-server-dom-webpack/src/ReactFlightDOMServerNode.js index 57dc2101ca8de..82ff956c99d72 100644 --- a/packages/react-server-dom-webpack/src/ReactFlightDOMServerNode.js +++ b/packages/react-server-dom-webpack/src/ReactFlightDOMServerNode.js @@ -7,7 +7,7 @@ * @flow */ -import type {ReactModel} from 'react-server/src/ReactFlightServer'; +import type {Request, ReactModel} from 'react-server/src/ReactFlightServer'; import type {Destination} from 'react-server/src/ReactServerStreamConfigNode'; import type {BundlerConfig} from './ReactFlightServerWebpackBundlerConfig'; import type {Writable} from 'stream'; @@ -20,7 +20,7 @@ import { abort, } from 'react-server/src/ReactFlightServer'; -function createDrainHandler(destination: Destination, request) { +function createDrainHandler(destination: Destination, request: Request) { return () => startFlowing(request, destination); } diff --git a/packages/react-server-dom-webpack/src/ReactFlightWebpackNodeLoader.js b/packages/react-server-dom-webpack/src/ReactFlightWebpackNodeLoader.js index ff04bd97e48bb..0a9e2d59f691b 100644 --- a/packages/react-server-dom-webpack/src/ReactFlightWebpackNodeLoader.js +++ b/packages/react-server-dom-webpack/src/ReactFlightWebpackNodeLoader.js @@ -100,7 +100,7 @@ export async function getSource( return defaultGetSource(url, context, defaultGetSource); } -function addExportNames(names, node) { +function addExportNames(names: Array, node: any) { switch (node.type) { case 'Identifier': names.push(node.name); @@ -174,7 +174,7 @@ async function parseExportNamesInto( transformedSource: string, names: Array, parentURL: string, - defaultTransformSource, + defaultTransformSource: TransformSourceFunction, ): Promise { const {body} = acorn.parse(transformedSource, { ecmaVersion: '2019', diff --git a/packages/react-server-dom-webpack/src/ReactFlightWebpackNodeRegister.js b/packages/react-server-dom-webpack/src/ReactFlightWebpackNodeRegister.js index 3076a196badda..fc686b0db5d8f 100644 --- a/packages/react-server-dom-webpack/src/ReactFlightWebpackNodeRegister.js +++ b/packages/react-server-dom-webpack/src/ReactFlightWebpackNodeRegister.js @@ -16,7 +16,11 @@ module.exports = function register() { const PROMISE_PROTOTYPE = Promise.prototype; const proxyHandlers = { - get: function(target, name, receiver) { + get: function( + target: {[string]: any}, + name: string, + receiver: Proxy<{[string]: any}>, + ) { switch (name) { // These names are read by the Flight runtime if you end up using the exports object. case '$$typeof': @@ -50,7 +54,7 @@ module.exports = function register() { // If this module is expected to return a Promise (such as an AsyncModule) then // we should resolve that with a client reference that unwraps the Promise on // the client. - const then = function then(resolve, reject) { + const then = function then(resolve, reject: any) { const moduleReference: {[string]: any, ...} = { $$typeof: MODULE_REFERENCE, filepath: target.filepath, @@ -82,7 +86,7 @@ module.exports = function register() { } return cachedReference; }, - getPrototypeOf(target) { + getPrototypeOf(target: {[string]: any}) { // Pretend to be a Promise in case anyone asks. return PROMISE_PROTOTYPE; }, @@ -108,7 +112,13 @@ module.exports = function register() { const originalResolveFilename = Module._resolveFilename; // $FlowFixMe[prop-missing] found when upgrading Flow - Module._resolveFilename = function(request, parent, isMain, options) { + Module._resolveFilename = function( + this: any, + request, + parent, + isMain, + options, + ) { const resolved = originalResolveFilename.apply(this, arguments); if (resolved.endsWith('.server.js')) { if ( diff --git a/packages/react-server-dom-webpack/src/ReactFlightWebpackPlugin.js b/packages/react-server-dom-webpack/src/ReactFlightWebpackPlugin.js index 9182597c2b85a..df2f78823f9de 100644 --- a/packages/react-server-dom-webpack/src/ReactFlightWebpackPlugin.js +++ b/packages/react-server-dom-webpack/src/ReactFlightWebpackPlugin.js @@ -220,7 +220,7 @@ export default class ReactFlightWebpackPlugin { return c.id; }); - function recordModule(id, module) { + function recordModule(id: any, module) { // TODO: Hook into deps instead of the target module. // That way we know by the type of dep whether to include. // It also resolves conflicts when the same module is in multiple chunks. diff --git a/packages/react-server/src/ReactFizzClassComponent.js b/packages/react-server/src/ReactFizzClassComponent.js index 291a6d60f1cd2..73f3ec55f93ef 100644 --- a/packages/react-server/src/ReactFizzClassComponent.js +++ b/packages/react-server/src/ReactFizzClassComponent.js @@ -60,7 +60,7 @@ if (__DEV__) { } }; - warnOnUndefinedDerivedState = function(type, partialState) { + warnOnUndefinedDerivedState = function(type: any, partialState: any) { if (partialState === undefined) { const componentName = getComponentNameFromType(type) || 'Component'; if (!didWarnAboutUndefinedDerivedState.has(componentName)) { @@ -106,10 +106,10 @@ type InternalInstance = { }; const classComponentUpdater = { - isMounted(inst) { + isMounted(inst: any) { return false; }, - enqueueSetState(inst, payload, callback) { + enqueueSetState(inst: any, payload: any, callback) { const internals: InternalInstance = getInstance(inst); if (internals.queue === null) { warnNoop(inst, 'setState'); @@ -122,7 +122,7 @@ const classComponentUpdater = { } } }, - enqueueReplaceState(inst, payload, callback) { + enqueueReplaceState(inst: any, payload: any, callback: null) { const internals: InternalInstance = getInstance(inst); internals.replace = true; internals.queue = [payload]; @@ -132,7 +132,7 @@ const classComponentUpdater = { } } }, - enqueueForceUpdate(inst, callback) { + enqueueForceUpdate(inst: any, callback) { const internals: InternalInstance = getInstance(inst); if (internals.queue === null) { warnNoop(inst, 'forceUpdate'); @@ -532,7 +532,7 @@ function checkClassInstance(instance: any, ctor: any, newProps: any) { } } -function callComponentWillMount(type, instance) { +function callComponentWillMount(type: any, instance: any) { const oldState = instance.state; if (typeof instance.componentWillMount === 'function') { diff --git a/packages/react-server/src/ReactFizzServer.js b/packages/react-server/src/ReactFizzServer.js index 9922a36db8c43..ac03ae25689b1 100644 --- a/packages/react-server/src/ReactFizzServer.js +++ b/packages/react-server/src/ReactFizzServer.js @@ -719,7 +719,7 @@ function renderHostElement( popComponentStackInDEV(task); } -function shouldConstruct(Component) { +function shouldConstruct(Component: any) { return Component.prototype && Component.prototype.isReactComponent; } @@ -1012,7 +1012,7 @@ function resolveDefaultProps(Component: any, baseProps: Object): Object { function renderForwardRef( request: Request, task: Task, - prevThenableState, + prevThenableState: null | ThenableState, type: any, props: Object, ref: any, @@ -1505,7 +1505,11 @@ function renderNodeDestructiveImpl( } } -function renderChildrenArray(request, task, children) { +function renderChildrenArray( + request: Request, + task: Task, + children: Array, +) { const totalChildren = children.length; for (let i = 0; i < totalChildren; i++) { const prevTreeContext = task.treeContext; @@ -2027,7 +2031,7 @@ function flushSubtree( function flushSegment( request: Request, - destination, + destination: Destination, segment: Segment, ): boolean { const boundary = segment.boundary; diff --git a/packages/react-server/src/ReactFlightServer.js b/packages/react-server/src/ReactFlightServer.js index 3a0876a56f5ec..9adcac72bc385 100644 --- a/packages/react-server/src/ReactFlightServer.js +++ b/packages/react-server/src/ReactFlightServer.js @@ -193,7 +193,11 @@ export function createRequest( identifierPrefix: identifierPrefix || '', identifierCount: 1, onError: onError === undefined ? defaultErrorHandler : onError, - toJSON: function(key: string, value: ReactModel): ReactJSONValue { + toJSON: function( + this: any, + key: string, + value: ReactModel, + ): ReactJSONValue { return resolveModelToJSON(request, this, key, value); }, }; @@ -481,7 +485,7 @@ function escapeStringValue(value: string): string { } } -function isObjectPrototype(object): boolean { +function isObjectPrototype(object: any): boolean { if (!object) { return false; } @@ -503,7 +507,7 @@ function isObjectPrototype(object): boolean { return true; } -function isSimpleObject(object): boolean { +function isSimpleObject(object: any): boolean { if (!isObjectPrototype(Object.getPrototypeOf(object))) { return false; } @@ -529,7 +533,7 @@ function isSimpleObject(object): boolean { return true; } -function objectName(object): string { +function objectName(object: mixed): string { // $FlowFixMe[method-unbinding] const name = Object.prototype.toString.call(object); return name.replace(/^\[object (.*)\]$/, function(m, p0) { diff --git a/packages/react/src/ReactAct.js b/packages/react/src/ReactAct.js index e6a1bd8e34492..a967562d088d7 100644 --- a/packages/react/src/ReactAct.js +++ b/packages/react/src/ReactAct.js @@ -205,7 +205,10 @@ export function act(callback: () => T | Thenable): Thenable { } } -function popActScope(prevActQueue, prevActScopeDepth) { +function popActScope( + prevActQueue: null | Array, + prevActScopeDepth: number, +) { if (__DEV__) { if (prevActScopeDepth !== actScopeDepth - 1) { console.error( @@ -252,7 +255,7 @@ function recursivelyFlushAsyncActWork( } let isFlushing = false; -function flushActQueue(queue) { +function flushActQueue(queue: Array) { if (__DEV__) { if (!isFlushing) { // Prevent re-entrance. @@ -304,7 +307,7 @@ function flushActQueue(queue) { // environment it may cause the warning to fire too late. const queueSeveralMicrotasks = typeof queueMicrotask === 'function' - ? callback => { + ? (callback: () => void) => { queueMicrotask(() => queueMicrotask(callback)); } : queueMacrotask; diff --git a/packages/react/src/ReactChildren.js b/packages/react/src/ReactChildren.js index 65c97c62cd7eb..10199b1c6bbd5 100644 --- a/packages/react/src/ReactChildren.js +++ b/packages/react/src/ReactChildren.js @@ -296,7 +296,7 @@ function forEachChildren( ): void { mapChildren( children, - function() { + function(this: any) { forEachFunc.apply(this, arguments); // Don't return anything. }, diff --git a/packages/react/src/ReactContext.js b/packages/react/src/ReactContext.js index 59bf7e11c7669..37ac671f69bed 100644 --- a/packages/react/src/ReactContext.js +++ b/packages/react/src/ReactContext.js @@ -9,6 +9,7 @@ import {REACT_PROVIDER_TYPE, REACT_CONTEXT_TYPE} from 'shared/ReactSymbols'; +import type {ReactProviderType} from 'shared/ReactTypes'; import type {ReactContext} from 'shared/ReactTypes'; export function createContext(defaultValue: T): ReactContext { @@ -66,7 +67,7 @@ export function createContext(defaultValue: T): ReactContext { } return context.Provider; }, - set(_Provider) { + set(_Provider: ReactProviderType) { context.Provider = _Provider; }, }, @@ -74,7 +75,7 @@ export function createContext(defaultValue: T): ReactContext { get() { return context._currentValue; }, - set(_currentValue) { + set(_currentValue: T) { context._currentValue = _currentValue; }, }, @@ -82,7 +83,7 @@ export function createContext(defaultValue: T): ReactContext { get() { return context._currentValue2; }, - set(_currentValue2) { + set(_currentValue2: T) { context._currentValue2 = _currentValue2; }, }, @@ -90,7 +91,7 @@ export function createContext(defaultValue: T): ReactContext { get() { return context._threadCount; }, - set(_threadCount) { + set(_threadCount: number) { context._threadCount = _threadCount; }, }, @@ -110,7 +111,7 @@ export function createContext(defaultValue: T): ReactContext { get() { return context.displayName; }, - set(displayName) { + set(displayName: void | string) { if (!hasWarnedAboutDisplayNameOnConsumer) { console.warn( 'Setting `displayName` on Context.Consumer has no effect. ' + diff --git a/packages/scheduler/src/forks/Scheduler.js b/packages/scheduler/src/forks/Scheduler.js index d43f457c2d680..d8d41b433f402 100644 --- a/packages/scheduler/src/forks/Scheduler.js +++ b/packages/scheduler/src/forks/Scheduler.js @@ -329,7 +329,7 @@ function unstable_next(eventHandler: () => T): T { function unstable_wrapCallback) => mixed>(callback: T): T { var parentPriorityLevel = currentPriorityLevel; // $FlowFixMe[incompatible-return] - return function() { + return function(this: any) { // This is a fork of runWithPriority, inlined for performance. var previousPriorityLevel = currentPriorityLevel; currentPriorityLevel = parentPriorityLevel; @@ -629,7 +629,9 @@ if (typeof localSetImmediate === 'function') { }; } -function requestHostCallback(callback) { +function requestHostCallback( + callback: (hasTimeRemaining: boolean, initialTime: number) => boolean, +) { scheduledHostCallback = callback; if (!isMessageLoopRunning) { isMessageLoopRunning = true; @@ -637,7 +639,10 @@ function requestHostCallback(callback) { } } -function requestHostTimeout(callback, ms: number) { +function requestHostTimeout( + callback: (currentTime: number) => void, + ms: number, +) { // $FlowFixMe[not-a-function] nullable value taskTimeoutID = localSetTimeout(() => { callback(getCurrentTime()); diff --git a/packages/scheduler/src/forks/SchedulerMock.js b/packages/scheduler/src/forks/SchedulerMock.js index e276aab0ed6b8..bd04210f837e1 100644 --- a/packages/scheduler/src/forks/SchedulerMock.js +++ b/packages/scheduler/src/forks/SchedulerMock.js @@ -322,7 +322,7 @@ function unstable_next(eventHandler: () => T): T { function unstable_wrapCallback) => mixed>(callback: T): T { var parentPriorityLevel = currentPriorityLevel; // $FlowFixMe[incompatible-return] - return function() { + return function(this: any) { // This is a fork of runWithPriority, inlined for performance. var previousPriorityLevel = currentPriorityLevel; currentPriorityLevel = parentPriorityLevel; diff --git a/packages/scheduler/src/forks/SchedulerPostTask.js b/packages/scheduler/src/forks/SchedulerPostTask.js index f78996f8028c4..43dd6a5dcdd74 100644 --- a/packages/scheduler/src/forks/SchedulerPostTask.js +++ b/packages/scheduler/src/forks/SchedulerPostTask.js @@ -168,7 +168,7 @@ function runTask( } } -function handleAbortError(error) { +function handleAbortError(error: any) { // Abort errors are an implementation detail. We don't expose the // TaskController to the user, nor do we expose the promise that is returned // from `postTask`. So we should suppress them, since there's no way for the diff --git a/packages/shared/ReactErrorUtils.js b/packages/shared/ReactErrorUtils.js index b29110220736a..b2d9cde7b7124 100644 --- a/packages/shared/ReactErrorUtils.js +++ b/packages/shared/ReactErrorUtils.js @@ -72,6 +72,7 @@ export function invokeGuardedCallbackAndCatchFirstError< F, Context, >( + this: mixed, name: string | null, func: (a: A, b: B, c: C, d: D, e: E, f: F) => void, context: Context, diff --git a/packages/shared/checkPropTypes.js b/packages/shared/checkPropTypes.js index ba7b40f3c5f90..29d07f7afed18 100644 --- a/packages/shared/checkPropTypes.js +++ b/packages/shared/checkPropTypes.js @@ -16,7 +16,7 @@ import hasOwnProperty from 'shared/hasOwnProperty'; const ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame; -function setCurrentlyValidatingElement(element) { +function setCurrentlyValidatingElement(element: any) { if (__DEV__) { if (element) { const owner = element._owner; diff --git a/packages/shared/invokeGuardedCallbackImpl.js b/packages/shared/invokeGuardedCallbackImpl.js index 017cc01046b37..217fc04e9789e 100644 --- a/packages/shared/invokeGuardedCallbackImpl.js +++ b/packages/shared/invokeGuardedCallbackImpl.js @@ -8,6 +8,7 @@ */ function invokeGuardedCallbackProd, Context>( + this: any, name: string | null, func: (...Args) => mixed, context: Context, @@ -62,7 +63,12 @@ if (__DEV__) { invokeGuardedCallbackImpl = function invokeGuardedCallbackDev< Args: Array, Context, - >(name: string | null, func: (...Args) => mixed, context: Context): void { + >( + this: any, + name: string | null, + func: (...Args) => mixed, + context: Context, + ): void { // If document doesn't exist we know for sure we will crash in this method // when we call document.createEvent(). However this can cause confusing // errors: https://github.com/facebook/create-react-app/issues/3482 diff --git a/packages/use-sync-external-store/src/useSyncExternalStoreWithSelector.js b/packages/use-sync-external-store/src/useSyncExternalStoreWithSelector.js index 8d8f61e76bf7f..57935329f1e6f 100644 --- a/packages/use-sync-external-store/src/useSyncExternalStoreWithSelector.js +++ b/packages/use-sync-external-store/src/useSyncExternalStoreWithSelector.js @@ -44,7 +44,7 @@ export function useSyncExternalStoreWithSelector( let hasMemo = false; let memoizedSnapshot; let memoizedSelection: Selection; - const memoizedSelector = nextSnapshot => { + const memoizedSelector = (nextSnapshot: Snapshot) => { if (!hasMemo) { // The first time the hook is called, there is no memoized result. hasMemo = true; diff --git a/scripts/flow/createFlowConfigs.js b/scripts/flow/createFlowConfigs.js index f9ce4a16a06bb..4a657ee2e6568 100644 --- a/scripts/flow/createFlowConfigs.js +++ b/scripts/flow/createFlowConfigs.js @@ -3,8 +3,6 @@ * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. - * - * @flow */ 'use strict'; From 23538236e0016812a0083a0f76be31194fd772bc Mon Sep 17 00:00:00 2001 From: Jan Kassens Date: Wed, 21 Dec 2022 12:20:21 -0500 Subject: [PATCH 2/7] [flow] add local type annotations in DevTools --- packages/react-devtools-core/src/backend.js | 4 +- .../react-devtools-core/src/standalone.js | 9 +-- .../react-devtools-extensions/src/backend.js | 2 +- .../src/backend/agent.js | 2 +- .../src/backend/legacy/renderer.js | 2 +- .../src/backend/legacy/utils.js | 4 +- .../src/backend/profilingHooks.js | 2 +- .../src/backend/renderer.js | 34 +++++----- .../src/backend/views/Highlighter/Overlay.js | 8 ++- .../src/backend/views/Highlighter/index.js | 4 +- .../src/devtools/ContextMenu/ContextMenu.js | 10 ++- .../devtools/ContextMenu/ContextMenuItem.js | 2 +- .../src/devtools/cache.js | 4 +- .../src/devtools/store.js | 6 +- .../views/Components/ComponentSearchInput.js | 3 +- .../InspectedElementSuspenseToggle.js | 2 +- .../src/devtools/views/Components/KeyValue.js | 9 ++- .../views/Components/NewArrayValue.js | 2 +- .../devtools/views/Components/NewKeyValue.js | 7 ++- .../devtools/views/Components/OwnersStack.js | 2 +- .../src/devtools/views/Components/Tree.js | 2 +- .../src/devtools/views/ModalDialog.js | 2 +- .../views/Profiler/CommitTreeBuilder.js | 2 +- .../views/Profiler/SidebarEventInfo.js | 3 +- .../src/devtools/views/Profiler/Tooltip.js | 12 +++- .../src/devtools/views/hooks.js | 5 +- packages/react-devtools-shared/src/hook.js | 35 +++++++---- .../react-window/src/createGridComponent.js | 27 ++++---- .../react-window/src/createListComponent.js | 25 ++++---- .../react-window/src/shouldComponentUpdate.js | 3 +- .../src/registerDevToolsEventLogger.js | 2 +- .../src/app/DeeplyNestedComponents/index.js | 6 +- .../src/app/EditableProps/index.js | 11 ++-- .../src/app/ElementTypes/index.js | 2 +- .../src/app/ErrorBoundaries/index.js | 6 +- .../src/app/InspectableElements/Contexts.js | 62 ++++++++++++++----- .../app/InspectableElements/CustomHooks.js | 4 +- .../app/InspectableElements/CustomObject.js | 2 +- .../src/app/SuspenseTree/index.js | 2 +- .../react-devtools-shell/src/app/devtools.js | 2 +- .../react-devtools-shell/src/app/index.js | 4 +- .../src/e2e-apps/ListAppLegacy.js | 4 +- .../src/e2e-regression/app-legacy.js | 2 +- .../src/e2e-regression/app.js | 2 +- .../src/EventTooltip.js | 5 +- .../src/TimelineSearchInput.js | 3 +- .../src/content-views/ReactMeasuresView.js | 4 +- .../src/view-base/Surface.js | 6 +- 48 files changed, 226 insertions(+), 137 deletions(-) diff --git a/packages/react-devtools-core/src/backend.js b/packages/react-devtools-core/src/backend.js index 70048a9de6cd1..f14ece0eefd19 100644 --- a/packages/react-devtools-core/src/backend.js +++ b/packages/react-devtools-core/src/backend.js @@ -44,7 +44,7 @@ const hook: ?DevToolsHook = window.__REACT_DEVTOOLS_GLOBAL_HOOK__; let savedComponentFilters: Array = getDefaultComponentFilters(); -function debug(methodName: string, ...args) { +function debug(methodName: string, ...args: Array) { if (__DEBUG__) { console.log( `%c[core/backend] %c${methodName}`, @@ -276,7 +276,7 @@ export function connectToDevTools(options: ?ConnectOptions) { scheduleRetry(); } - function handleMessage(event) { + function handleMessage(event: MessageEvent) { let data; try { if (typeof event.data === 'string') { diff --git a/packages/react-devtools-core/src/standalone.js b/packages/react-devtools-core/src/standalone.js index 1b11a4710099c..ba4efd813d165 100644 --- a/packages/react-devtools-core/src/standalone.js +++ b/packages/react-devtools-core/src/standalone.js @@ -86,11 +86,12 @@ let bridge: FrontendBridge | null = null; let store: Store | null = null; let root = null; -const log = (...args) => console.log('[React DevTools]', ...args); -log.warn = (...args) => console.warn('[React DevTools]', ...args); -log.error = (...args) => console.error('[React DevTools]', ...args); +const log = (...args: Array) => console.log('[React DevTools]', ...args); +log.warn = (...args: Array) => console.warn('[React DevTools]', ...args); +log.error = (...args: Array) => + console.error('[React DevTools]', ...args); -function debug(methodName: string, ...args) { +function debug(methodName: string, ...args: Array) { if (__DEBUG__) { console.log( `%c[core/standalone] %c${methodName}`, diff --git a/packages/react-devtools-extensions/src/backend.js b/packages/react-devtools-extensions/src/backend.js index ad55ed6d50fdc..533551003330c 100644 --- a/packages/react-devtools-extensions/src/backend.js +++ b/packages/react-devtools-extensions/src/backend.js @@ -42,7 +42,7 @@ function welcome(event) { window.addEventListener('message', welcome); -function setup(hook) { +function setup(hook: any) { if (hook == null) { // DevTools didn't get injected into this page (maybe b'c of the contentType). return; diff --git a/packages/react-devtools-shared/src/backend/agent.js b/packages/react-devtools-shared/src/backend/agent.js index 78812286bf211..0af2033cf955f 100644 --- a/packages/react-devtools-shared/src/backend/agent.js +++ b/packages/react-devtools-shared/src/backend/agent.js @@ -42,7 +42,7 @@ import type {ComponentFilter} from '../types'; import {isSynchronousXHRSupported} from './utils'; import type {BrowserTheme} from 'react-devtools-shared/src/devtools/views/DevTools'; -const debug = (methodName, ...args) => { +const debug = (methodName: string, ...args: Array) => { if (__DEBUG__) { console.log( `%cAgent %c${methodName}`, diff --git a/packages/react-devtools-shared/src/backend/legacy/renderer.js b/packages/react-devtools-shared/src/backend/legacy/renderer.js index 8d02e853a4060..1b667cf122185 100644 --- a/packages/react-devtools-shared/src/backend/legacy/renderer.js +++ b/packages/react-devtools-shared/src/backend/legacy/renderer.js @@ -195,7 +195,7 @@ export function attach( return ((internalInstanceToIDMap.get(internalInstance): any): number); } - function areEqualArrays(a, b) { + function areEqualArrays(a: Array, b: Array) { if (a.length !== b.length) { return false; } diff --git a/packages/react-devtools-shared/src/backend/legacy/utils.js b/packages/react-devtools-shared/src/backend/legacy/utils.js index 581f8e9222d20..2447f2b3e9c95 100644 --- a/packages/react-devtools-shared/src/backend/legacy/utils.js +++ b/packages/react-devtools-shared/src/backend/legacy/utils.js @@ -11,7 +11,7 @@ import type {InternalInstance} from './renderer'; export function decorate(object: Object, attr: string, fn: Function): Function { const old = object[attr]; - object[attr] = function(instance: InternalInstance) { + object[attr] = function(this: any, instance: InternalInstance) { return fn.call(this, old, arguments); }; return old; @@ -34,7 +34,7 @@ export function restoreMany(source: Object, olds: Object): void { } } -export function forceUpdate(instance: InternalInstance): void { +export function forceUpdate(this: any, instance: InternalInstance): void { if (typeof instance.forceUpdate === 'function') { instance.forceUpdate(); } else if ( diff --git a/packages/react-devtools-shared/src/backend/profilingHooks.js b/packages/react-devtools-shared/src/backend/profilingHooks.js index f83875b14d1a5..47d173c55c3c4 100644 --- a/packages/react-devtools-shared/src/backend/profilingHooks.js +++ b/packages/react-devtools-shared/src/backend/profilingHooks.js @@ -204,7 +204,7 @@ export function createProfilingHooks({ } } - function markAndClear(markName) { + function markAndClear(markName: string) { // This method won't be called unless these functions are defined, so we can skip the extra typeof check. ((performanceTarget: any): Performance).mark(markName); ((performanceTarget: any): Performance).clearMarks(markName); diff --git a/packages/react-devtools-shared/src/backend/renderer.js b/packages/react-devtools-shared/src/backend/renderer.js index 68425faac8d7a..54f95a2fbea6a 100644 --- a/packages/react-devtools-shared/src/backend/renderer.js +++ b/packages/react-devtools-shared/src/backend/renderer.js @@ -2546,7 +2546,7 @@ export function attach( // We don't patch any methods so there is no cleanup. } - function rootSupportsProfiling(root) { + function rootSupportsProfiling(root: any) { if (root.memoizedInteractions != null) { // v16 builds include this field for the scheduler/tracing API. return true; @@ -2610,7 +2610,7 @@ export function attach( } } - function getUpdatersList(root): Array | null { + function getUpdatersList(root: any): Array | null { return root.memoizedUpdaters != null ? Array.from(root.memoizedUpdaters) .filter(fiber => getFiberIDUnsafe(fiber) !== null) @@ -2618,7 +2618,7 @@ export function attach( : null; } - function handleCommitFiberUnmount(fiber) { + function handleCommitFiberUnmount(fiber: any) { // If the untrackFiberSet already has the unmounted Fiber, this means we've already // recordedUnmount, so we don't need to do it again. If we don't do this, we might // end up double-deleting Fibers in some cases (like Legacy Suspense). @@ -2630,7 +2630,7 @@ export function attach( } } - function handlePostCommitFiberRoot(root) { + function handlePostCommitFiberRoot(root: any) { if (isProfiling && rootSupportsProfiling(root)) { if (currentCommitProfilingMetadata !== null) { const {effectDuration, passiveEffectDuration} = getEffectDurations( @@ -2644,7 +2644,7 @@ export function attach( } } - function handleCommitFiberRoot(root, priorityLevel) { + function handleCommitFiberRoot(root: any, priorityLevel: void | number) { const current = root.current; const alternate = current.alternate; @@ -2805,18 +2805,18 @@ export function attach( } } - function getDisplayNameForFiberID(id) { + function getDisplayNameForFiberID(id: number) { const fiber = idToArbitraryFiberMap.get(id); return fiber != null ? getDisplayNameForFiber(((fiber: any): Fiber)) : null; } - function getFiberForNative(hostInstance) { + function getFiberForNative(hostInstance: NativeType) { return renderer.findFiberByHostInstance(hostInstance); } function getFiberIDForNative( - hostInstance, - findNearestUnfilteredAncestor = false, + hostInstance: NativeType, + findNearestUnfilteredAncestor: boolean = false, ) { let fiber = renderer.findFiberByHostInstance(hostInstance); if (fiber != null) { @@ -2832,7 +2832,7 @@ export function attach( // This function is copied from React and should be kept in sync: // https://github.com/facebook/react/blob/main/packages/react-reconciler/src/ReactFiberTreeReflection.js - function assertIsMounted(fiber) { + function assertIsMounted(fiber: Fiber) { if (getNearestMountedFiber(fiber) !== fiber) { throw new Error('Unable to find node on an unmounted component.'); } @@ -3712,7 +3712,7 @@ export function attach( }; } - function logElementToConsole(id) { + function logElementToConsole(id: number) { const result = isMostRecentlyInspectedElementCurrent(id) ? mostRecentlyInspectedElement : inspectElementRaw(id); @@ -4149,7 +4149,7 @@ export function attach( // null (do nothing) const forceErrorForFiberIDs = new Map(); - function shouldErrorFiberAccordingToMap(fiber) { + function shouldErrorFiberAccordingToMap(fiber: any) { if (typeof setErrorHandler !== 'function') { throw new Error( 'Expected overrideError() to not get called for earlier React versions.', @@ -4185,7 +4185,7 @@ export function attach( return status; } - function overrideError(id, forceError) { + function overrideError(id: number, forceError: boolean) { if ( typeof setErrorHandler !== 'function' || typeof scheduleUpdate !== 'function' @@ -4214,12 +4214,12 @@ export function attach( const forceFallbackForSuspenseIDs = new Set(); - function shouldSuspendFiberAccordingToSet(fiber) { + function shouldSuspendFiberAccordingToSet(fiber: any) { const maybeID = getFiberIDUnsafe(((fiber: any): Fiber)); return maybeID !== null && forceFallbackForSuspenseIDs.has(maybeID); } - function overrideSuspense(id, forceFallback) { + function overrideSuspense(id: number, forceFallback: boolean) { if ( typeof setSuspenseHandler !== 'function' || typeof scheduleUpdate !== 'function' @@ -4317,7 +4317,9 @@ export function attach( return true; } - function updateTrackedPathStateAfterMount(mightSiblingsBeOnTrackedPath) { + function updateTrackedPathStateAfterMount( + mightSiblingsBeOnTrackedPath: boolean, + ) { // updateTrackedPathStateBeforeMount() told us whether to match siblings. // Now that we're entering siblings, let's use that information. mightBeOnTrackedPath = mightSiblingsBeOnTrackedPath; diff --git a/packages/react-devtools-shared/src/backend/views/Highlighter/Overlay.js b/packages/react-devtools-shared/src/backend/views/Highlighter/Overlay.js index 5414f3ef0efe9..f19a335bf79d7 100644 --- a/packages/react-devtools-shared/src/backend/views/Highlighter/Overlay.js +++ b/packages/react-devtools-shared/src/backend/views/Highlighter/Overlay.js @@ -277,7 +277,11 @@ export default class Overlay { } } -function findTipPos(dims, bounds, tipSize) { +function findTipPos( + dims: Box, + bounds: Box, + tipSize: {height: number, width: number}, +) { const tipHeight = Math.max(tipSize.height, 20); const tipWidth = Math.max(tipSize.width, 60); const margin = 5; @@ -314,7 +318,7 @@ function findTipPos(dims, bounds, tipSize) { }; } -function boxWrap(dims, what, node) { +function boxWrap(dims: any, what: string, node: HTMLElement) { assign(node.style, { borderTopWidth: dims[what + 'Top'] + 'px', borderLeftWidth: dims[what + 'Left'] + 'px', diff --git a/packages/react-devtools-shared/src/backend/views/Highlighter/index.js b/packages/react-devtools-shared/src/backend/views/Highlighter/index.js index 6793e92e51dd8..dada3978e2e3a 100644 --- a/packages/react-devtools-shared/src/backend/views/Highlighter/index.js +++ b/packages/react-devtools-shared/src/backend/views/Highlighter/index.js @@ -38,7 +38,7 @@ export default function setupHighlighter( registerListenersOnWindow(window); } - function registerListenersOnWindow(window) { + function registerListenersOnWindow(window: any) { // This plug-in may run in non-DOM environments (e.g. React Native). if (window && typeof window.addEventListener === 'function') { window.addEventListener('click', onClick, true); @@ -66,7 +66,7 @@ export default function setupHighlighter( iframesListeningTo = new Set(); } - function removeListenersOnWindow(window) { + function removeListenersOnWindow(window: any) { // This plug-in may run in non-DOM environments (e.g. React Native). if (window && typeof window.removeEventListener === 'function') { window.removeEventListener('click', onClick, true); diff --git a/packages/react-devtools-shared/src/devtools/ContextMenu/ContextMenu.js b/packages/react-devtools-shared/src/devtools/ContextMenu/ContextMenu.js index a800b58fc37e5..43556f9dc6cce 100644 --- a/packages/react-devtools-shared/src/devtools/ContextMenu/ContextMenu.js +++ b/packages/react-devtools-shared/src/devtools/ContextMenu/ContextMenu.js @@ -81,7 +81,15 @@ export default function ContextMenu({children, id}: Props): React.Node { }, []); useEffect(() => { - const showMenuFn = ({data, pageX, pageY}) => { + const showMenuFn = ({ + data, + pageX, + pageY, + }: { + data: any, + pageX: number, + pageY: number, + }) => { setState({data, isVisible: true, pageX, pageY}); }; const hideMenuFn = () => setState(HIDDEN_STATE); diff --git a/packages/react-devtools-shared/src/devtools/ContextMenu/ContextMenuItem.js b/packages/react-devtools-shared/src/devtools/ContextMenu/ContextMenuItem.js index 3de6acef774b1..d634f5eeef286 100644 --- a/packages/react-devtools-shared/src/devtools/ContextMenu/ContextMenuItem.js +++ b/packages/react-devtools-shared/src/devtools/ContextMenu/ContextMenuItem.js @@ -28,7 +28,7 @@ export default function ContextMenuItem({ }: Props): React.Node { const {hideMenu} = useContext(RegistryContext); - const handleClick = event => { + const handleClick = (event: any) => { onClick(); hideMenu(); }; diff --git a/packages/react-devtools-shared/src/devtools/cache.js b/packages/react-devtools-shared/src/devtools/cache.js index 6afbc64ada418..c8f62ba3853c3 100644 --- a/packages/react-devtools-shared/src/devtools/cache.js +++ b/packages/react-devtools-shared/src/devtools/cache.js @@ -7,7 +7,7 @@ * @flow */ -import type {Thenable} from 'shared/ReactTypes'; +import type {ReactContext, Thenable} from 'shared/ReactTypes'; import * as React from 'react'; import {createContext} from 'react'; @@ -63,7 +63,7 @@ const Rejected = 2; const ReactCurrentDispatcher = (React: any) .__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentDispatcher; -function readContext(Context) { +function readContext(Context: ReactContext) { const dispatcher = ReactCurrentDispatcher.current; if (dispatcher === null) { throw new Error( diff --git a/packages/react-devtools-shared/src/devtools/store.js b/packages/react-devtools-shared/src/devtools/store.js index 71d53c886e67b..fd9264eed5a2b 100644 --- a/packages/react-devtools-shared/src/devtools/store.js +++ b/packages/react-devtools-shared/src/devtools/store.js @@ -46,7 +46,7 @@ import type { } from 'react-devtools-shared/src/bridge'; import UnsupportedBridgeOperationError from 'react-devtools-shared/src/UnsupportedBridgeOperationError'; -const debug = (methodName, ...args) => { +const debug = (methodName: string, ...args: Array) => { if (__DEBUG__) { console.log( `%cStore %c${methodName}`, @@ -1146,7 +1146,7 @@ export default class Store extends EventEmitter<{ debug(`Remove root ${id}`); } - const recursivelyDeleteElements = elementID => { + const recursivelyDeleteElements = (elementID: number) => { const element = this._idToElement.get(elementID); this._idToElement.delete(elementID); if (element) { @@ -1431,7 +1431,7 @@ export default class Store extends EventEmitter<{ // but the downstream errors they cause will be reported as bugs. // For example, https://github.com/facebook/react/issues/21402 // Emitting an error event allows the ErrorBoundary to show the original error. - _throwAndEmitError(error: Error) { + _throwAndEmitError(error: Error): empty { this.emit('error', error); // Throwing is still valuable for local development diff --git a/packages/react-devtools-shared/src/devtools/views/Components/ComponentSearchInput.js b/packages/react-devtools-shared/src/devtools/views/Components/ComponentSearchInput.js index 3085f0a2120ed..f84e29bf7302f 100644 --- a/packages/react-devtools-shared/src/devtools/views/Components/ComponentSearchInput.js +++ b/packages/react-devtools-shared/src/devtools/views/Components/ComponentSearchInput.js @@ -19,7 +19,8 @@ export default function ComponentSearchInput(props: Props): React.Node { const {searchIndex, searchResults, searchText} = useContext(TreeStateContext); const dispatch = useContext(TreeDispatcherContext); - const search = text => dispatch({type: 'SET_SEARCH_TEXT', payload: text}); + const search = (text: string) => + dispatch({type: 'SET_SEARCH_TEXT', payload: text}); const goToNextResult = () => dispatch({type: 'GO_TO_NEXT_SEARCH_RESULT'}); const goToPreviousResult = () => dispatch({type: 'GO_TO_PREVIOUS_SEARCH_RESULT'}); diff --git a/packages/react-devtools-shared/src/devtools/views/Components/InspectedElementSuspenseToggle.js b/packages/react-devtools-shared/src/devtools/views/Components/InspectedElementSuspenseToggle.js index b400c6c7f3294..09808d6e3dfdd 100644 --- a/packages/react-devtools-shared/src/devtools/views/Components/InspectedElementSuspenseToggle.js +++ b/packages/react-devtools-shared/src/devtools/views/Components/InspectedElementSuspenseToggle.js @@ -39,7 +39,7 @@ export default function InspectedElementSuspenseToggle({ const isSuspended = state !== null; - const toggleSuspense = (path, value) => { + const toggleSuspense = (path: any, value: boolean) => { const rendererID = store.getRendererIDForElement(id); if (rendererID !== null) { bridge.send('overrideSuspense', { diff --git a/packages/react-devtools-shared/src/devtools/views/Components/KeyValue.js b/packages/react-devtools-shared/src/devtools/views/Components/KeyValue.js index 26c65c15ff96f..c9240034dc5cd 100644 --- a/packages/react-devtools-shared/src/devtools/views/Components/KeyValue.js +++ b/packages/react-devtools-shared/src/devtools/views/Components/KeyValue.js @@ -138,7 +138,7 @@ export default function KeyValue({ paddingLeft: `${(depth - 1) * 0.75}rem`, }; - const overrideValue = (newPath, newValue) => { + const overrideValue = (newPath: Array, newValue: any) => { if (hookID != null) { newPath = parseHookPathForEdit(newPath); } @@ -156,7 +156,7 @@ export default function KeyValue({ } }; - const deletePath = pathToDelete => { + const deletePath = (pathToDelete: Array) => { if (hookID != null) { pathToDelete = parseHookPathForEdit(pathToDelete); } @@ -173,7 +173,10 @@ export default function KeyValue({ } }; - const renamePath = (oldPath, newPath) => { + const renamePath = ( + oldPath: Array, + newPath: Array, + ) => { if (newPath[newPath.length - 1] === '') { // Deleting the key suggests an intent to delete the whole path. if (canDeletePaths) { diff --git a/packages/react-devtools-shared/src/devtools/views/Components/NewArrayValue.js b/packages/react-devtools-shared/src/devtools/views/Components/NewArrayValue.js index 0a6cdf842fa01..5a9fffed5ca4e 100644 --- a/packages/react-devtools-shared/src/devtools/views/Components/NewArrayValue.js +++ b/packages/react-devtools-shared/src/devtools/views/Components/NewArrayValue.js @@ -46,7 +46,7 @@ export default function NewArrayValue({ // This is a bit of an unusual usage of the EditableName component, // but otherwise it acts the way we want for a new Array entry. - const overrideName = (oldPath, newPath) => { + const overrideName = (oldPath: any, newPath) => { const value = newPath[newPath.length - 1]; let parsedValue; diff --git a/packages/react-devtools-shared/src/devtools/views/Components/NewKeyValue.js b/packages/react-devtools-shared/src/devtools/views/Components/NewKeyValue.js index 6435e6da4bf59..9a354a81adb5d 100644 --- a/packages/react-devtools-shared/src/devtools/views/Components/NewKeyValue.js +++ b/packages/react-devtools-shared/src/devtools/views/Components/NewKeyValue.js @@ -42,11 +42,14 @@ export default function NewKeyValue({ const [newPropKey, setNewPropKey] = useState(0); const [newPropName, setNewPropName] = useState(''); - const overrideNewEntryName = (oldPath, newPath) => { + const overrideNewEntryName = (oldPath: any, newPath) => { setNewPropName(newPath[newPath.length - 1]); }; - const overrideNewEntryValue = (newPath, value) => { + const overrideNewEntryValue = ( + newPath: Array, + value: any, + ) => { if (!newPropName) { return; } diff --git a/packages/react-devtools-shared/src/devtools/views/Components/OwnersStack.js b/packages/react-devtools-shared/src/devtools/views/Components/OwnersStack.js index f79a307885c91..c557e374ab2f5 100644 --- a/packages/react-devtools-shared/src/devtools/views/Components/OwnersStack.js +++ b/packages/react-devtools-shared/src/devtools/views/Components/OwnersStack.js @@ -56,7 +56,7 @@ type State = { selectedIndex: number, }; -function dialogReducer(state, action) { +function dialogReducer(state: State, action: Action) { switch (action.type) { case 'UPDATE_OWNER_ID': const selectedIndex = action.owners.findIndex( diff --git a/packages/react-devtools-shared/src/devtools/views/Components/Tree.js b/packages/react-devtools-shared/src/devtools/views/Components/Tree.js index 106bda6d36123..60cbddb60dae0 100644 --- a/packages/react-devtools-shared/src/devtools/views/Components/Tree.js +++ b/packages/react-devtools-shared/src/devtools/views/Components/Tree.js @@ -101,7 +101,7 @@ export default function Tree(props: Props): React.Node { // Picking an element in the inspector should put focus into the tree. // This ensures that keyboard navigation works right after picking a node. useEffect(() => { - function handleStopInspectingNative(didSelectNode) { + function handleStopInspectingNative(didSelectNode: boolean) { if (didSelectNode && focusTargetRef.current !== null) { focusTargetRef.current.focus(); logEvent({ diff --git a/packages/react-devtools-shared/src/devtools/views/ModalDialog.js b/packages/react-devtools-shared/src/devtools/views/ModalDialog.js index c7d3f7befb7a2..cf927e055de71 100644 --- a/packages/react-devtools-shared/src/devtools/views/ModalDialog.js +++ b/packages/react-devtools-shared/src/devtools/views/ModalDialog.js @@ -61,7 +61,7 @@ const ModalDialogContext: ReactContext = createContext { +const debug = (methodName: string, ...args: Array) => { if (__DEBUG__) { console.log( `%cCommitTreeBuilder %c${methodName}`, diff --git a/packages/react-devtools-shared/src/devtools/views/Profiler/SidebarEventInfo.js b/packages/react-devtools-shared/src/devtools/views/Profiler/SidebarEventInfo.js index 716bf67adee76..d0d8be666ed32 100644 --- a/packages/react-devtools-shared/src/devtools/views/Profiler/SidebarEventInfo.js +++ b/packages/react-devtools-shared/src/devtools/views/Profiler/SidebarEventInfo.js @@ -7,6 +7,7 @@ * @flow */ +import type {Stack} from '../../utils'; import type {SchedulingEvent} from 'react-devtools-timeline/src/types'; import * as React from 'react'; @@ -35,7 +36,7 @@ function SchedulingEventInfo({eventInfo}: SchedulingEventProps) { const {componentName, timestamp} = eventInfo; const componentStack = eventInfo.componentStack || null; - const viewSource = source => { + const viewSource = (source: ?Stack) => { if (viewUrlSourceFunction != null && source != null) { viewUrlSourceFunction(...source); } diff --git a/packages/react-devtools-shared/src/devtools/views/Profiler/Tooltip.js b/packages/react-devtools-shared/src/devtools/views/Profiler/Tooltip.js index baf61f82822be..b43f51cb04e23 100644 --- a/packages/react-devtools-shared/src/devtools/views/Profiler/Tooltip.js +++ b/packages/react-devtools-shared/src/devtools/views/Profiler/Tooltip.js @@ -55,7 +55,15 @@ export default function Tooltip({ const TOOLTIP_OFFSET = 5; // Method used to find the position of the tooltip based on current mouse position -function getTooltipPosition(element, mousePosition) { +function getTooltipPosition( + element: empty, + mousePosition: { + height: number, + mouseX: number, + mouseY: number, + width: number, + }, +) { const {height, mouseX, mouseY, width} = mousePosition; let top: number | string = 0; let left: number | string = 0; @@ -85,7 +93,7 @@ function getTooltipPosition(element, mousePosition) { // method used to find the current mouse position inside the container function getMousePosition( - relativeContainer, + relativeContainer: null, mouseEvent: SyntheticMouseEvent, ) { if (relativeContainer !== null) { diff --git a/packages/react-devtools-shared/src/devtools/views/hooks.js b/packages/react-devtools-shared/src/devtools/views/hooks.js index 6cc82dd424dd8..795532a45f6c0 100644 --- a/packages/react-devtools-shared/src/devtools/views/hooks.js +++ b/packages/react-devtools-shared/src/devtools/views/hooks.js @@ -43,7 +43,10 @@ type UseEditableValueState = { parsedValue: any, }; -function useEditableValueReducer(state, action) { +function useEditableValueReducer( + state: UseEditableValueState, + action: UseEditableValueAction, +) { switch (action.type) { case 'RESET': return { diff --git a/packages/react-devtools-shared/src/hook.js b/packages/react-devtools-shared/src/hook.js index 547f6b35e63ab..acecd13f06a69 100644 --- a/packages/react-devtools-shared/src/hook.js +++ b/packages/react-devtools-shared/src/hook.js @@ -9,7 +9,12 @@ */ import type {BrowserTheme} from 'react-devtools-shared/src/devtools/views/DevTools'; -import type {DevToolsHook} from 'react-devtools-shared/src/backend/types'; +import type { + RendererID, + ReactRenderer, + Handler, + DevToolsHook, +} from 'react-devtools-shared/src/backend/types'; import { patchConsoleUsingWindowValues, @@ -40,7 +45,7 @@ export function installHook(target: any): DevToolsHook | null { } } - function detectReactBuildType(renderer) { + function detectReactBuildType(renderer: ReactRenderer) { try { if (typeof renderer.version === 'string') { // React DOM Fiber (16+) @@ -263,7 +268,7 @@ export function installHook(target: any): DevToolsHook | null { ? targetConsole[method].__REACT_DEVTOOLS_STRICT_MODE_ORIGINAL_METHOD__ : targetConsole[method]); - const overrideMethod = (...args) => { + const overrideMethod = (...args: $ReadOnlyArray) => { if (!hideConsoleLogsInStrictMode) { // Dim the text color of the double logs if we're not // hiding them. @@ -316,7 +321,7 @@ export function installHook(target: any): DevToolsHook | null { let uidCounter = 0; - function inject(renderer) { + function inject(renderer: ReactRenderer) { const id = ++uidCounter; renderers.set(id, renderer); @@ -374,19 +379,19 @@ export function installHook(target: any): DevToolsHook | null { let hasDetectedBadDCE = false; - function sub(event, fn) { + function sub(event: string, fn: Handler) { hook.on(event, fn); return () => hook.off(event, fn); } - function on(event, fn) { + function on(event: string, fn: Handler) { if (!listeners[event]) { listeners[event] = []; } listeners[event].push(fn); } - function off(event, fn) { + function off(event: string, fn: Handler) { if (!listeners[event]) { return; } @@ -399,13 +404,13 @@ export function installHook(target: any): DevToolsHook | null { } } - function emit(event, data) { + function emit(event: string, data: any) { if (listeners[event]) { listeners[event].map(fn => fn(data)); } } - function getFiberRoots(rendererID) { + function getFiberRoots(rendererID: RendererID) { const roots = fiberRoots; if (!roots[rendererID]) { roots[rendererID] = new Set(); @@ -413,14 +418,18 @@ export function installHook(target: any): DevToolsHook | null { return roots[rendererID]; } - function onCommitFiberUnmount(rendererID, fiber) { + function onCommitFiberUnmount(rendererID: RendererID, fiber: any) { const rendererInterface = rendererInterfaces.get(rendererID); if (rendererInterface != null) { rendererInterface.handleCommitFiberUnmount(fiber); } } - function onCommitFiberRoot(rendererID, root, priorityLevel) { + function onCommitFiberRoot( + rendererID: RendererID, + root: any, + priorityLevel: void | number, + ) { const mountedRoots = hook.getFiberRoots(rendererID); const current = root.current; const isKnownRoot = mountedRoots.has(root); @@ -439,14 +448,14 @@ export function installHook(target: any): DevToolsHook | null { } } - function onPostCommitFiberRoot(rendererID, root) { + function onPostCommitFiberRoot(rendererID: RendererID, root: any) { const rendererInterface = rendererInterfaces.get(rendererID); if (rendererInterface != null) { rendererInterface.handlePostCommitFiberRoot(root); } } - function setStrictMode(rendererID, isStrictMode) { + function setStrictMode(rendererID: RendererID, isStrictMode: any) { const rendererInterface = rendererInterfaces.get(rendererID); if (rendererInterface != null) { if (isStrictMode) { diff --git a/packages/react-devtools-shared/src/node_modules/react-window/src/createGridComponent.js b/packages/react-devtools-shared/src/node_modules/react-window/src/createGridComponent.js index d1da857a5496a..a4c90eba85f32 100644 --- a/packages/react-devtools-shared/src/node_modules/react-window/src/createGridComponent.js +++ b/packages/react-devtools-shared/src/node_modules/react-window/src/createGridComponent.js @@ -143,7 +143,13 @@ type ValidateProps = (props: Props) => void; const IS_SCROLLING_DEBOUNCE_INTERVAL = 150; -const defaultItemKey = ({ columnIndex, data, rowIndex }) => +const defaultItemKey = ( + { + columnIndex, + data, + rowIndex + }: { columnIndex: number, data: any, rowIndex: number }, +) => `${rowIndex}:${columnIndex}`; // In DEV mode, this Set helps us only log a warning once per component instance. @@ -197,7 +203,7 @@ export default function createGridComponent({ _resetIsScrollingTimeoutId: TimeoutID | null = null; _outerRef: ?HTMLDivElement; - static defaultProps = { + static defaultProps: { direction: string, itemData: void, useIsScrolling: boolean } = { direction: 'ltr', itemData: undefined, useIsScrolling: false, @@ -393,7 +399,7 @@ export default function createGridComponent({ } } - render() { + render(): any { const { children, className, @@ -486,7 +492,7 @@ export default function createGridComponent({ ); } - _callOnItemsRendered: ( + _callOnItemsRendered: (( overscanColumnStartIndex: number, overscanColumnStopIndex: number, overscanRowStartIndex: number, @@ -495,8 +501,7 @@ export default function createGridComponent({ visibleColumnStopIndex: number, visibleRowStartIndex: number, visibleRowStopIndex: number - ) => void; - _callOnItemsRendered = memoizeOne( + ) => void) = memoizeOne( ( overscanColumnStartIndex: number, overscanColumnStopIndex: number, @@ -519,14 +524,13 @@ export default function createGridComponent({ }) ); - _callOnScroll: ( + _callOnScroll: (( scrollLeft: number, scrollTop: number, horizontalScrollDirection: ScrollDirection, verticalScrollDirection: ScrollDirection, scrollUpdateWasRequested: boolean - ) => void; - _callOnScroll = memoizeOne( + ) => void) = memoizeOne( ( scrollLeft: number, scrollTop: number, @@ -595,7 +599,6 @@ export default function createGridComponent({ // So that pure component sCU will prevent re-renders. // We maintain this cache, and pass a style prop rather than index, // So that List can clear cached styles and force item re-render if necessary. - _getItemStyle: (rowIndex: number, columnIndex: number) => Object; _getItemStyle = (rowIndex: number, columnIndex: number): Object => { const { columnWidth, direction, rowHeight } = this.props; @@ -628,8 +631,8 @@ export default function createGridComponent({ return style; }; - _getItemStyleCache: (_: any, __: any, ___: any) => ItemStyleCache; - _getItemStyleCache = memoizeOne((_: any, __: any, ___: any) => ({})); + _getItemStyleCache: ((_: any, __: any, ___: any) => ItemStyleCache) = + memoizeOne((_: any, __: any, ___: any) => ({})); _getHorizontalRangeToRender(): [number, number, number, number] { const { diff --git a/packages/react-devtools-shared/src/node_modules/react-window/src/createListComponent.js b/packages/react-devtools-shared/src/node_modules/react-window/src/createListComponent.js index 11ff59317c5f5..210dba2b642bc 100644 --- a/packages/react-devtools-shared/src/node_modules/react-window/src/createListComponent.js +++ b/packages/react-devtools-shared/src/node_modules/react-window/src/createListComponent.js @@ -162,7 +162,13 @@ export default function createListComponent({ _outerRef: ?HTMLDivElement; _resetIsScrollingTimeoutId: TimeoutID | null = null; - static defaultProps = { + static defaultProps: { + direction: string, + itemData: void, + layout: string, + overscanCount: number, + useIsScrolling: boolean, + } = { direction: 'ltr', itemData: undefined, layout: 'vertical', @@ -288,7 +294,7 @@ export default function createListComponent({ } } - render() { + render(): any { const { children, className, @@ -370,13 +376,12 @@ export default function createListComponent({ ); } - _callOnItemsRendered: ( + _callOnItemsRendered: (( overscanStartIndex: number, overscanStopIndex: number, visibleStartIndex: number, visibleStopIndex: number - ) => void; - _callOnItemsRendered = memoizeOne( + ) => void) = memoizeOne( ( overscanStartIndex: number, overscanStopIndex: number, @@ -391,12 +396,11 @@ export default function createListComponent({ }) ); - _callOnScroll: ( + _callOnScroll: (( scrollDirection: ScrollDirection, scrollOffset: number, scrollUpdateWasRequested: boolean - ) => void; - _callOnScroll = memoizeOne( + ) => void) = memoizeOne( ( scrollDirection: ScrollDirection, scrollOffset: number, @@ -446,7 +450,6 @@ export default function createListComponent({ // So that pure component sCU will prevent re-renders. // We maintain this cache, and pass a style prop rather than index, // So that List can clear cached styles and force item re-render if necessary. - _getItemStyle: (index: number) => Object; _getItemStyle = (index: number): Object => { const { direction, itemSize, layout } = this.props; @@ -480,8 +483,8 @@ export default function createListComponent({ return style; }; - _getItemStyleCache: (_: any, __: any, ___: any) => ItemStyleCache; - _getItemStyleCache = memoizeOne((_: any, __: any, ___: any) => ({})); + _getItemStyleCache: ((_: any, __: any, ___: any) => ItemStyleCache) = + memoizeOne((_: any, __: any, ___: any) => ({})); _getRangeToRender(): [number, number, number, number] { const { itemCount, overscanCount } = this.props; diff --git a/packages/react-devtools-shared/src/node_modules/react-window/src/shouldComponentUpdate.js b/packages/react-devtools-shared/src/node_modules/react-window/src/shouldComponentUpdate.js index 6b891bd4d2e50..01ca6d5071268 100644 --- a/packages/react-devtools-shared/src/node_modules/react-window/src/shouldComponentUpdate.js +++ b/packages/react-devtools-shared/src/node_modules/react-window/src/shouldComponentUpdate.js @@ -7,8 +7,9 @@ import shallowDiffers from './shallowDiffers'; // It knows to compare individual style props and ignore the wrapper object. // See https://reactjs.org/docs/react-component.html#shouldcomponentupdate export default function shouldComponentUpdate( + this: interface { props: any, state: any }, nextProps: Object, - nextState: Object + nextState: Object, ): boolean { return ( !areEqual(this.props, nextProps) || shallowDiffers(this.state, nextState) diff --git a/packages/react-devtools-shared/src/registerDevToolsEventLogger.js b/packages/react-devtools-shared/src/registerDevToolsEventLogger.js index 8f261c1ed90d5..6bc08d91524b7 100644 --- a/packages/react-devtools-shared/src/registerDevToolsEventLogger.js +++ b/packages/react-devtools-shared/src/registerDevToolsEventLogger.js @@ -56,7 +56,7 @@ export function registerDevToolsEventLogger( } } - function handleLoggingIFrameLoaded(iframe) { + function handleLoggingIFrameLoaded(iframe: HTMLIFrameElement) { if (loggingIFrame != null) { return; } diff --git a/packages/react-devtools-shell/src/app/DeeplyNestedComponents/index.js b/packages/react-devtools-shell/src/app/DeeplyNestedComponents/index.js index dc1de76dfa733..8c9a02e5e0c79 100644 --- a/packages/react-devtools-shell/src/app/DeeplyNestedComponents/index.js +++ b/packages/react-devtools-shell/src/app/DeeplyNestedComponents/index.js @@ -10,19 +10,19 @@ import * as React from 'react'; import {Fragment} from 'react'; -function wrapWithHoc(Component, index) { +function wrapWithHoc(Component: () => any, index: number) { function HOC() { return ; } - const displayName = Component.displayName || Component.name; + const displayName = (Component: any).displayName || Component.name; // $FlowFixMe[incompatible-type] found when upgrading Flow HOC.displayName = `withHoc${index}(${displayName})`; return HOC; } -function wrapWithNested(Component, times) { +function wrapWithNested(Component: () => any, times: number) { for (let i = 0; i < times; i++) { Component = wrapWithHoc(Component, i); } diff --git a/packages/react-devtools-shell/src/app/EditableProps/index.js b/packages/react-devtools-shell/src/app/EditableProps/index.js index fe617337faeb2..5c780ee86e72e 100644 --- a/packages/react-devtools-shell/src/app/EditableProps/index.js +++ b/packages/react-devtools-shell/src/app/EditableProps/index.js @@ -7,6 +7,7 @@ * @flow */ +import type {ReactContext} from 'shared/ReactTypes'; import * as React from 'react'; import { createContext, @@ -23,7 +24,7 @@ import { const initialData = {foo: 'FOO', bar: 'BAR'}; -function reducer(state, action) { +function reducer(state, action: {type: string}) { switch (action.type) { case 'swap': return {foo: state.bar, bar: state.foo}; @@ -72,19 +73,19 @@ type Props = {name: string, toggle: boolean}; type State = {cities: Array, state: string}; class StatefulClass extends Component { - static contextType = BoolContext; + static contextType: ReactContext = BoolContext; state: State = { cities: ['San Francisco', 'San Jose'], state: 'California', }; - handleChange = ({target}) => + handleChange = ({target}): any => this.setState({ state: target.value, }); - render() { + render(): any { return (
  • Name: {this.props.name}
    • @@ -141,7 +142,7 @@ export default function EditableProps(): React.Node { } // Below copied from https://usehooks.com/ -function useDebounce(value, delay) { +function useDebounce(value: number, delay: number) { // State and setters for debounced value const [debouncedValue, setDebouncedValue] = useState(value); diff --git a/packages/react-devtools-shell/src/app/ElementTypes/index.js b/packages/react-devtools-shell/src/app/ElementTypes/index.js index 6268c75e88b66..3a5edef08e603 100644 --- a/packages/react-devtools-shell/src/app/ElementTypes/index.js +++ b/packages/react-devtools-shell/src/app/ElementTypes/index.js @@ -25,7 +25,7 @@ const Context = createContext('abc'); Context.displayName = 'ExampleContext'; class ClassComponent extends Component { - render() { + render(): null { return null; } } diff --git a/packages/react-devtools-shell/src/app/ErrorBoundaries/index.js b/packages/react-devtools-shell/src/app/ErrorBoundaries/index.js index bdd9666fbec7e..234ffb642fcc6 100644 --- a/packages/react-devtools-shell/src/app/ErrorBoundaries/index.js +++ b/packages/react-devtools-shell/src/app/ErrorBoundaries/index.js @@ -11,13 +11,13 @@ import * as React from 'react'; import {Fragment} from 'react'; class ErrorBoundary extends React.Component { - state = {hasError: false}; + state: {hasError: boolean} = {hasError: false}; - static getDerivedStateFromError(error) { + static getDerivedStateFromError(error: any): {hasError: boolean} { return {hasError: true}; } - render() { + render(): any { const {hasError} = this.state; if (hasError) { return ( diff --git a/packages/react-devtools-shell/src/app/InspectableElements/Contexts.js b/packages/react-devtools-shell/src/app/InspectableElements/Contexts.js index da54beed0b213..0cafb31390f1e 100644 --- a/packages/react-devtools-shell/src/app/InspectableElements/Contexts.js +++ b/packages/react-devtools-shell/src/app/InspectableElements/Contexts.js @@ -11,9 +11,11 @@ import * as React from 'react'; import {createContext, Component, useContext, useState} from 'react'; import PropTypes from 'prop-types'; +import type {ReactContext} from 'shared/ReactTypes'; + function someNamedFunction() {} -function formatContextForDisplay(name, value) { +function formatContextForDisplay(name: string, value: any | string) { return (
  • {name}: 
    {JSON.stringify(value, null, 2)}
    @@ -34,7 +36,17 @@ const contextData = { }; class LegacyContextProvider extends Component { - static childContextTypes = { + static childContextTypes: { + array: any, + bool: any, + func: any, + null: any, + number: any, + object: any, + string: any, + symbol: any, + undefined: any, + } = { array: PropTypes.array, bool: PropTypes.bool, func: PropTypes.func, @@ -46,17 +58,37 @@ class LegacyContextProvider extends Component { undefined: PropTypes.any, }; - getChildContext() { + getChildContext(): { + array: Array, + bool: boolean, + func: () => void, + null: null, + number: number, + object: {outer: {inner: {...}}}, + string: string, + symbol: symbol, + undefined: void, + } { return contextData; } - render() { + render(): any { return this.props.children; } } class LegacyContextConsumer extends Component { - static contextTypes = { + static contextTypes: { + array: any, + bool: any, + func: any, + null: any, + number: any, + object: any, + string: any, + symbol: any, + undefined: any, + } = { array: PropTypes.array, bool: PropTypes.bool, func: PropTypes.func, @@ -68,18 +100,18 @@ class LegacyContextConsumer extends Component { undefined: PropTypes.any, }; - render() { + render(): any { return formatContextForDisplay('LegacyContextConsumer', this.context); } } class LegacyContextProviderWithUpdates extends Component { - constructor(props) { + constructor(props: any) { super(props); this.state = {type: 'desktop'}; } - getChildContext() { + getChildContext(): {type: any} { return {type: this.state.type}; } @@ -87,7 +119,7 @@ class LegacyContextProviderWithUpdates extends Component { this.setState({type: event.target.value}); }; - render() { + render(): any { return ( <> @@ -103,7 +135,7 @@ LegacyContextProviderWithUpdates.childContextTypes = { type: PropTypes.string, }; -function LegacyFunctionalContextConsumer(props, context) { +function LegacyFunctionalContextConsumer(props: any, context) { return formatContextForDisplay('LegacyFunctionContextConsumer', context.type); } LegacyFunctionalContextConsumer.contextTypes = { @@ -130,9 +162,9 @@ const UndefinedContext = createContext(undefined); UndefinedContext.displayName = 'UndefinedContext'; class ModernContextType extends Component { - static contextType = ModernContext; + static contextType: ReactContext = ModernContext; - render() { + render(): any { return formatContextForDisplay('ModernContextType', this.context); } } @@ -198,7 +230,7 @@ function FunctionalContextConsumerWithContextUpdates() { } class ModernClassContextProviderWithUpdates extends Component { - constructor(props) { + constructor(props: any) { super(props); this.setString = string => { this.setState({string}); @@ -210,7 +242,7 @@ class ModernClassContextProviderWithUpdates extends Component { }; } - render() { + render(): any { return ( @@ -220,7 +252,7 @@ class ModernClassContextProviderWithUpdates extends Component { } class ModernClassContextConsumerWithUpdates extends Component { - render() { + render(): any { return ( {({string, setString}) => ( diff --git a/packages/react-devtools-shell/src/app/InspectableElements/CustomHooks.js b/packages/react-devtools-shell/src/app/InspectableElements/CustomHooks.js index 66920af0d791e..2775376340108 100644 --- a/packages/react-devtools-shell/src/app/InspectableElements/CustomHooks.js +++ b/packages/react-devtools-shell/src/app/InspectableElements/CustomHooks.js @@ -103,7 +103,7 @@ function FunctionWithHooks(props: any, ref: React$Ref) { const MemoWithHooks = memo(FunctionWithHooks); const ForwardRefWithHooks = forwardRef(FunctionWithHooks); -function wrapWithHoc(Component) { +function wrapWithHoc(Component: (props: any, ref: React$Ref) => any) { function Hoc() { return ; } @@ -127,7 +127,7 @@ export default function CustomHooks(): React.Node { } // Below copied from https://usehooks.com/ -function useDebounce(value, delay) { +function useDebounce(value: number, delay: number) { // State and setters for debounced value const [debouncedValue, setDebouncedValue] = useState(value); diff --git a/packages/react-devtools-shell/src/app/InspectableElements/CustomObject.js b/packages/react-devtools-shell/src/app/InspectableElements/CustomObject.js index 9d03fbd717515..f4de359f499fe 100644 --- a/packages/react-devtools-shell/src/app/InspectableElements/CustomObject.js +++ b/packages/react-devtools-shell/src/app/InspectableElements/CustomObject.js @@ -11,7 +11,7 @@ import * as React from 'react'; class Custom { _number = 42; - get number() { + get number(): number { return this._number; } } diff --git a/packages/react-devtools-shell/src/app/SuspenseTree/index.js b/packages/react-devtools-shell/src/app/SuspenseTree/index.js index 8713d4d0275aa..c262846b48b8f 100644 --- a/packages/react-devtools-shell/src/app/SuspenseTree/index.js +++ b/packages/react-devtools-shell/src/app/SuspenseTree/index.js @@ -51,7 +51,7 @@ function PrimaryFallbackTest({initialSuspend}) { ); } -function useTestSequence(label, T1, T2) { +function useTestSequence(label: string, T1: any => any, T2: any => any) { const [step, setStep] = useState(0); const next = (