Update Flow to 0.84 (#17805)

* Update Flow to 0.84

* Fix violations

* Use inexact object syntax in files from fbsource

* Fix warning extraction to use a modern parser

* Codemod inexact objects to new syntax

* Tighten types that can be exact

* Revert unintentional formatting changes from codemod

package.json

@@ -8,6 +8,7 @@
     "@babel/code-frame": "^7.0.0",
     "@babel/core": "^7.0.0",
     "@babel/helper-module-imports": "^7.0.0",
+    "@babel/parser": "^7.0.0",
     "@babel/plugin-external-helpers": "^7.0.0",
     "@babel/plugin-proposal-class-properties": "^7.0.0",
     "@babel/plugin-proposal-object-rest-spread": "^7.0.0",
@@ -36,7 +37,6 @@
     "art": "^0.10.1",
     "babel-eslint": "^10.0.0",
     "babel-plugin-syntax-trailing-function-commas": "^6.5.0",
-    "babylon": "6.18.0",
     "chalk": "^1.1.3",
     "cli-table": "^0.3.1",
     "coffee-script": "^1.8.0",
@@ -56,7 +56,7 @@
     "eslint-plugin-react-internal": "link:./scripts/eslint-rules",
     "fbjs-scripts": "^0.8.3",
     "filesize": "^3.5.6",
-    "flow-bin": "^0.72.0",
+    "flow-bin": "^0.84.0",
     "glob": "^6.0.4",
     "glob-stream": "^6.1.0",
     "google-closure-compiler": "20190301.0.0",

packages/create-subscription/src/createSubscription.js

@@ -29,10 +29,10 @@ export function createSubscription<Property, Value>(
       callback: (value: Value | void) => void,
     ) => Unsubscribe,
   |}>,
-): React$ComponentType<{
+): React$ComponentType<{|
   children: (value: Value | void) => React$Node,
   source: Property,
-}> {
+|}> {
   const {getCurrentValue, subscribe} = config;
 
   if (__DEV__) {
@@ -44,14 +44,14 @@ export function createSubscription<Property, Value>(
     }
   }
 
-  type Props = {
+  type Props = {|
     children: (value: Value) => React$Element<any>,
     source: Property,
-  };
-  type State = {
+  |};
+  type State = {|
     source: Property,
     value: Value | void,
-  };
+  |};
 
   // Reference: https://gist.github.com/bvaughn/d569177d70b50b58bff69c3c4a5353f3
   class Subscription extends React.Component<Props, State> {

packages/legacy-events/EventPluginRegistry.js

@@ -16,7 +16,7 @@ import type {
 
 import invariant from 'shared/invariant';
 
-type NamesToPlugins = {[key: PluginName]: PluginModule<AnyNativeEvent>};
+type NamesToPlugins = {[key: PluginName]: PluginModule<AnyNativeEvent>, ...};
 type EventPluginOrder = null | Array<PluginName>;
 
 /**

packages/legacy-events/PluginModuleType.js

@@ -15,7 +15,7 @@ import type {
 import type {TopLevelType} from './TopLevelEventTypes';
 import type {EventSystemFlags} from 'legacy-events/EventSystemFlags';
 
-export type EventTypes = {[key: string]: DispatchConfig};
+export type EventTypes = {[key: string]: DispatchConfig, ...};
 
 export type AnyNativeEvent = Event | KeyboardEvent | MouseEvent | Touch;
 
@@ -31,4 +31,5 @@ export type PluginModule<NativeEvent> = {
     eventSystemFlags: EventSystemFlags,
   ) => ?ReactSyntheticEvent,
   tapMoveThreshold?: number,
+  ...
 };

packages/legacy-events/ReactSyntheticEventType.js

@@ -12,17 +12,17 @@ import type {Fiber} from 'react-reconciler/src/ReactFiber';
 import type {EventPriority} from 'shared/ReactTypes';
 import type {TopLevelType} from './TopLevelEventTypes';
 
-export type DispatchConfig = {
+export type DispatchConfig = {|
   dependencies: Array<TopLevelType>,
-  phasedRegistrationNames?: {
+  phasedRegistrationNames?: {|
     bubbled: string,
     captured: string,
-  },
+  |},
   registrationName?: string,
   eventPriority: EventPriority,
-};
+|};
 
-export type ReactSyntheticEvent = {
+export type ReactSyntheticEvent = {|
   dispatchConfig: DispatchConfig,
   getPooled: (
     dispatchConfig: DispatchConfig,
@@ -31,4 +31,4 @@ export type ReactSyntheticEvent = {
     nativeEventTarget: EventTarget,
   ) => ReactSyntheticEvent,
   isPersistent: () => boolean,
-} & SyntheticEvent<>;
+|} & SyntheticEvent<>;

packages/legacy-events/ResponderTouchHistoryStore.js

@@ -16,7 +16,7 @@ import {isStartish, isMoveish, isEndish} from './ResponderTopLevelEventTypes';
  * should typically only see IDs in the range of 1-20 because IDs get recycled
  * when touches end and start again.
  */
-type TouchRecord = {
+type TouchRecord = {|
   touchActive: boolean,
   startPageX: number,
   startPageY: number,
@@ -27,7 +27,7 @@ type TouchRecord = {
   previousPageX: number,
   previousPageY: number,
   previousTimeStamp: number,
-};
+|};
 
 const MAX_TOUCH_BANK = 20;
 const touchBank: Array<TouchRecord> = [];
@@ -46,10 +46,12 @@ type Touch = {
   pageX: number,
   pageY: number,
   timestamp: number,
+  ...
 };
 type TouchEvent = {
   changedTouches: Array<Touch>,
   touches: Array<Touch>,
+  ...
 };
 
 function timestampForTouch(touch: Touch): number {

packages/react-cache/src/ReactCache.js

@@ -13,11 +13,10 @@ import {createLRU} from './LRU';
 
 type Thenable<T> = {
   then(resolve: (T) => mixed, reject: (mixed) => mixed): mixed,
+  ...
 };
 
-type Suspender = {
-  then(resolve: () => mixed, reject: () => mixed): mixed,
-};
+type Suspender = {then(resolve: () => mixed, reject: () => mixed): mixed, ...};
 
 type PendingResult = {|
   status: 0,
@@ -39,6 +38,7 @@ type Result<V> = PendingResult | ResolvedResult<V> | RejectedResult;
 type Resource<I, V> = {
   read(I): V,
   preload(I): void,
+  ...
 };
 
 const Pending = 0;

packages/react-debug-tools/src/ReactDebugHooks.js

@@ -36,6 +36,7 @@ type HookLogEntry = {
   primitive: string,
   stackError: Error,
   value: mixed,
+  ...
 };
 
 let hookLog: Array<HookLogEntry> = [];
@@ -142,7 +143,7 @@ function useReducer<S, I, A>(
   return [state, (action: A) => {}];
 }
 
-function useRef<T>(initialValue: T): {current: T} {
+function useRef<T>(initialValue: T): {|current: T|} {
   let hook = nextHook();
   let ref = hook !== null ? hook.memoizedState : {current: initialValue};
   hookLog.push({
@@ -174,7 +175,7 @@ function useEffect(
 }
 
 function useImperativeHandle<T>(
-  ref: {current: T | null} | ((inst: T | null) => mixed) | null | void,
+  ref: {|current: T | null|} | ((inst: T | null) => mixed) | null | void,
   create: () => T,
   inputs: Array<mixed> | void | null,
 ): void {
@@ -285,6 +286,7 @@ export type HooksNode = {
   name: string,
   value: mixed,
   subHooks: Array<HooksNode>,
+  ...
 };
 export type HooksTree = Array<HooksNode>;
 

packages/react-devtools-core/src/backend.js

@@ -27,6 +27,7 @@ type ConnectOptions = {
   resolveRNStyle?: ResolveNativeStyle,
   isAppActive?: () => boolean,
   websocket?: ?WebSocket,
+  ...
 };
 
 installHook(window);
@@ -120,7 +121,7 @@ export function connectToDevTools(options: ?ConnectOptions) {
     });
     bridge.addListener(
       'inspectElement',
-      ({id, rendererID}: {id: number, rendererID: number}) => {
+      ({id, rendererID}: {id: number, rendererID: number, ...}) => {
         const renderer = agent.rendererInterfaces[rendererID];
         if (renderer != null) {
           // Send event for RN to highlight.

packages/react-devtools-shared/src/backend/agent.js

@@ -109,7 +109,7 @@ export default class Agent extends EventEmitter<{|
   _bridge: BackendBridge;
   _isProfiling: boolean = false;
   _recordChangeDescriptions: boolean = false;
-  _rendererInterfaces: {[key: RendererID]: RendererInterface} = {};
+  _rendererInterfaces: {[key: RendererID]: RendererInterface, ...} = {};
   _persistedSelection: PersistedSelection | null = null;
   _persistedSelectionMatch: PathMatch | null = null;
   _traceUpdatesEnabled: boolean = false;
@@ -185,7 +185,7 @@ export default class Agent extends EventEmitter<{|
     setupTraceUpdates(this);
   }
 
-  get rendererInterfaces(): {[key: RendererID]: RendererInterface} {
+  get rendererInterfaces(): {[key: RendererID]: RendererInterface, ...} {
     return this._rendererInterfaces;
   }
 

packages/react-devtools-shared/src/backend/index.js

@@ -30,6 +30,7 @@ export function initBackend(
         id: number,
         renderer: ReactRenderer,
         rendererInterface: RendererInterface,
+        ...
       }) => {
         agent.setRendererInterface(id, rendererInterface);
 
@@ -91,7 +92,7 @@ export function initBackend(
   subs.push(
     hook.sub(
       'renderer',
-      ({id, renderer}: {id: number, renderer: ReactRenderer}) => {
+      ({id, renderer}: {id: number, renderer: ReactRenderer, ...}) => {
         attachRenderer(id, renderer);
       },
     ),

packages/react-devtools-shared/src/backend/legacy/utils.js

@@ -19,7 +19,7 @@ export function decorate(object: Object, attr: string, fn: Function): Function {
 
 export function decorateMany(
   source: Object,
-  fns: {[attr: string]: Function},
+  fns: {[attr: string]: Function, ...},
 ): Object {
   const olds = {};
   for (const name in fns) {

packages/react-devtools-shared/src/backend/renderer.js

@@ -76,7 +76,7 @@ import type {
 type getDisplayNameForFiberType = (fiber: Fiber) => string | null;
 type getTypeSymbolType = (type: any) => Symbol | number;
 
-type ReactSymbolsType = {
+type ReactSymbolsType = {|
   CONCURRENT_MODE_NUMBER: number,
   CONCURRENT_MODE_SYMBOL_STRING: string,
   DEPRECATED_ASYNC_MODE_SYMBOL_STRING: string,
@@ -94,7 +94,7 @@ type ReactSymbolsType = {
   STRICT_MODE_SYMBOL_STRING: string,
   SCOPE_NUMBER: number,
   SCOPE_SYMBOL_STRING: string,
-};
+|};
 
 type ReactPriorityLevelsType = {|
   ImmediatePriority: number,

packages/react-devtools-shared/src/backend/types.js

@@ -48,44 +48,39 @@ export type FindNativeNodesForFiberID = (id: number) => ?Array<NativeType>;
 export type ReactProviderType<T> = {
   $$typeof: Symbol | number,
   _context: ReactContext<T>,
+  ...
 };
 
 export type ReactRenderer = {
   findFiberByHostInstance: (hostInstance: NativeType) => ?Fiber,
   version: string,
   bundleType: BundleType,
-
   // 16.9+
   overrideHookState?: ?(
     fiber: Object,
     id: number,
     path: Array<string | number>,
     value: any,
   ) => void,
-
   // 16.7+
   overrideProps?: ?(
     fiber: Object,
     path: Array<string | number>,
     value: any,
   ) => void,
-
   // 16.9+
   scheduleUpdate?: ?(fiber: Object) => void,
   setSuspenseHandler?: ?(shouldSuspend: (fiber: Object) => boolean) => void,
-
   // Only injected by React v16.8+ in order to support hooks inspection.
   currentDispatcherRef?: {|current: null | Dispatcher|},
-
   // Only injected by React v16.9+ in DEV mode.
   // Enables DevTools to append owners-only component stack to error messages.
   getCurrentFiber?: () => Fiber | null,
-
   // Uniquely identifies React DOM v15.
   ComponentTree?: any,
-
   // Present for React DOM v12 (possibly earlier) through v15.
   Mount?: any,
+  ...
 };
 
 export type ChangeDescription = {|
@@ -267,12 +262,13 @@ export type RendererInterface = {
     count: number,
   ) => void,
   updateComponentFilters: (componentFilters: Array<ComponentFilter>) => void,
+  ...
 };
 
 export type Handler = (data: any) => void;
 
 export type DevToolsHook = {
-  listeners: {[key: string]: Array<Handler>},
+  listeners: {[key: string]: Array<Handler>, ...},
   rendererInterfaces: Map<RendererID, RendererInterface>,
   renderers: Map<RendererID, ReactRenderer>,
 
@@ -299,4 +295,5 @@ export type DevToolsHook = {
     // Added in v16.9 to support Fast Refresh
     didError?: boolean,
   ) => void,
+  ...
 };

packages/react-devtools-shared/src/backend/views/Highlighter/index.js

@@ -95,6 +95,7 @@ export default function setupHighlighter(
     openNativeElementsPanel: boolean,
     rendererID: number,
     scrollIntoView: boolean,
+    ...
   }) {
     const renderer = agent.rendererInterfaces[rendererID];
     if (renderer == null) {

packages/react-devtools-shared/src/backend/views/utils.js

@@ -14,6 +14,7 @@ export type Rect = {
   right: number,
   top: number,
   width: number,
+  ...
 };
 
 // Get the window object for the document that a node belongs to,

packages/react-devtools-shared/src/devtools/cache.js

@@ -21,11 +21,10 @@ import React, {createContext} from 'react';
 
 export type Thenable<T> = {
   then(resolve: (T) => mixed, reject: (mixed) => mixed): mixed,
+  ...
 };
 
-type Suspender = {
-  then(resolve: () => mixed, reject: () => mixed): mixed,
-};
+type Suspender = {then(resolve: () => mixed, reject: () => mixed): mixed, ...};
 
 type PendingResult = {|
   status: 0,
@@ -50,6 +49,7 @@ export type Resource<Input, Key, Value> = {
   read(Input): Value,
   preload(Input): void,
   write(Key, Value): void,
+  ...
 };
 
 const Pending = 0;
@@ -73,9 +73,7 @@ function readContext(Context, observedBits) {
 
 const CacheContext = createContext(null);
 
-type Config = {
-  useWeakMap?: boolean,
-};
+type Config = {useWeakMap?: boolean, ...};
 
 const entries: Map<
   Resource<any, any, any>,