Cleanup legacy library types in xplat: 1/n

packages/community-cli-plugin/src/dev-server/version.js

@@ -153,7 +153,7 @@ function buildDiffUrl(oldVersion: string, newVersion: string) {
  * Returns the most recent React Native version available to upgrade to.
  */
 async function getLatestRnDiffPurgeVersion(): Promise<LatestVersions | void> {
-  const options: RequestOptions = {
+  const options: RequestInit = {
     // https://developer.github.com/v3/#user-agent-required
     headers: {'User-Agent': '@react-native/community-cli-plugin'} as Headers,
   };

packages/react-native/Libraries/Animated/animations/DecayAnimation.js

@@ -42,7 +42,7 @@ export default class DecayAnimation extends Animation {
   _deceleration: number;
   _velocity: number;
   _onUpdate: (value: number) => void;
-  _animationFrame: ?AnimationFrameID;
+  _animationFrame: ?number;
   _platformConfig: ?PlatformConfig;
 
   constructor(config: DecayAnimationConfigSingle) {

packages/react-native/Libraries/Animated/animations/SpringAnimation.js

@@ -104,7 +104,7 @@ export default class SpringAnimation extends Animation {
   _lastTime: number;
   _frameTime: number;
   _onUpdate: (value: number) => void;
-  _animationFrame: ?AnimationFrameID;
+  _animationFrame: ?number;
   _platformConfig: ?PlatformConfig;
 
   constructor(config: SpringAnimationConfigSingle) {

packages/react-native/Libraries/Animated/animations/TimingAnimation.js

@@ -68,7 +68,7 @@ export default class TimingAnimation extends Animation {
   _delay: number;
   _easing: (value: number) => number;
   _onUpdate: (value: number) => void;
-  _animationFrame: ?AnimationFrameID;
+  _animationFrame: ?number;
   _timeout: ?TimeoutID;
   _platformConfig: ?PlatformConfig;
   _deferredStart: boolean;

packages/react-native/flow/bom.js.flow

@@ -479,14 +479,14 @@ declare class XMLHttpRequest extends EventTarget {
   LOADING: number;
   msCaching: string;
   msCachingEnabled(): boolean;
-  onabort: ProgressEventHandler;
-  onerror: ProgressEventHandler;
-  onload: ProgressEventHandler;
-  onloadend: ProgressEventHandler;
-  onloadstart: ProgressEventHandler;
-  onprogress: ProgressEventHandler;
+  onabort: (event: ProgressEvent) => unknown;
+  onerror: (event: ProgressEvent) => unknown;
+  onload: (event: ProgressEvent) => unknown;
+  onloadend: (event: ProgressEvent) => unknown;
+  onloadstart: (event: ProgressEvent) => unknown;
+  onprogress: (event: ProgressEvent) => unknown;
   onreadystatechange: (ev: $FlowFixMe) => unknown;
-  ontimeout: ProgressEventHandler;
+  ontimeout: (event: ProgressEvent) => unknown;
   open(
     method: string,
     url: string,
@@ -518,13 +518,13 @@ declare class XMLHttpRequest extends EventTarget {
 }
 
 declare class XMLHttpRequestEventTarget extends EventTarget {
-  onabort: ProgressEventHandler;
-  onerror: ProgressEventHandler;
-  onload: ProgressEventHandler;
-  onloadend: ProgressEventHandler;
-  onloadstart: ProgressEventHandler;
-  onprogress: ProgressEventHandler;
-  ontimeout: ProgressEventHandler;
+  onabort: (event: ProgressEvent) => unknown;
+  onerror: (event: ProgressEvent) => unknown;
+  onload: (event: ProgressEvent) => unknown;
+  onloadend: (event: ProgressEvent) => unknown;
+  onloadstart: (event: ProgressEvent) => unknown;
+  onprogress: (event: ProgressEvent) => unknown;
+  ontimeout: (event: ProgressEvent) => unknown;
 }
 
 // this part of spec is not finished yet, apparently
@@ -625,7 +625,7 @@ type BodyInit =
 
 type RequestInfo = Request | URL | string;
 
-type RequestOptions = {
+type RequestInit = {
   body?: ?BodyInit,
   cache?: CacheType,
   credentials?: CredentialsType,
@@ -684,7 +684,7 @@ declare class Request {
 
   cache: CacheType;
   clone(): Request;
-  constructor(input: RequestInfo, init?: RequestOptions): void;
+  constructor(input: RequestInfo, init?: RequestInit): void;
   credentials: CredentialsType;
   formData(): Promise<FormData>;
   headers: Headers;
@@ -720,7 +720,7 @@ declare class AbortSignal extends EventTarget {
 
 declare function fetch(
   input: RequestInfo,
-  init?: RequestOptions,
+  init?: RequestInit,
 ): Promise<Response>;
 
 declare class Location {
@@ -740,11 +740,6 @@ declare class Location {
   toString(): string;
 }
 
-declare class CanvasCaptureMediaStream extends MediaStream {
-  canvas: HTMLCanvasElement;
-  requestFrame(): void;
-}
-
 declare type FileSystemHandleKind = 'file' | 'directory';
 
 // https://wicg.github.io/file-system-access/#api-filesystemhandle

packages/react-native/flow/dom.js.flow

@@ -1260,7 +1260,7 @@ declare class SecurityPolicyViolationEvent extends Event {
 
 // https://developer.mozilla.org/en-US/docs/Web/API/USBConnectionEvent
 declare class USBConnectionEvent extends Event {
-  device: USBDevice;
+  device: unknown;
 }
 
 // TODO: *Event
@@ -4965,6 +4965,12 @@ declare class WebGLContextEvent extends Event {
 // http://www.w3.org/TR/html5/scripting-1.html#renderingcontext
 type RenderingContext = CanvasRenderingContext2D | WebGLRenderingContext;
 
+type CanvasCaptureMediaStream = MediaStream & {
+  canvas: HTMLCanvasElement,
+  requestFrame(): void,
+  ...
+};
+
 // https://www.w3.org/TR/html5/scripting-1.html#htmlcanvaselement
 declare class HTMLCanvasElement extends HTMLElement {
   tagName: 'CANVAS';
@@ -6100,21 +6106,19 @@ declare function getComputedStyle(
   elt: Element,
   pseudoElt?: string,
 ): CSSStyleDeclaration;
-declare opaque type AnimationFrameID;
 declare function requestAnimationFrame(
   callback: (timestamp: number) => void,
-): AnimationFrameID;
-declare function cancelAnimationFrame(requestId: AnimationFrameID): void;
-declare opaque type IdleCallbackID;
+): number;
+declare function cancelAnimationFrame(requestId: number): void;
 declare function requestIdleCallback(
   cb: (deadline: {
     didTimeout: boolean,
     timeRemaining: () => number,
     ...
   }) => void,
   opts?: {timeout: number, ...},
-): IdleCallbackID;
-declare function cancelIdleCallback(id: IdleCallbackID): void;
+): number;
+declare function cancelIdleCallback(id: number): void;
 declare var localStorage: Storage;
 declare var devicePixelRatio: number;
 declare function focus(): void;

packages/rn-tester/IntegrationTests/TimersTest.js

@@ -32,7 +32,7 @@ class TimersTest extends React.Component<Props, State> {
   _timeoutIDs: Set<TimeoutID> = new Set();
   _intervalIDs: Set<IntervalID> = new Set();
   _immediateIDs: Set<ImmediateID> = new Set();
-  _animationFrameIDs: Set<AnimationFrameID> = new Set();
+  _animationFrameIDs: Set<number> = new Set();
 
   state: State = {
     count: 0,
@@ -81,8 +81,8 @@ class TimersTest extends React.Component<Props, State> {
     return id;
   }
 
-  requestAnimationFrame(fn: () => void): AnimationFrameID {
-    const id: AnimationFrameID = requestAnimationFrame(() => {
+  requestAnimationFrame(fn: () => void): number {
+    const id: number = requestAnimationFrame(() => {
       this._animationFrameIDs.delete(id);
       fn();
     });
@@ -92,7 +92,7 @@ class TimersTest extends React.Component<Props, State> {
     return id;
   }
 
-  cancelAnimationFrame(id: AnimationFrameID): void {
+  cancelAnimationFrame(id: number): void {
     this._animationFrameIDs.delete(id);
     cancelAnimationFrame(id);
   }

packages/rn-tester/js/examples/Timer/TimerExample.js

@@ -33,7 +33,7 @@ class RequestIdleCallbackTester extends React.Component<
     message: '-',
   };
 
-  _idleTimer: ?IdleCallbackID = null;
+  _idleTimer: ?number = null;
   _iters = 0;
 
   componentWillUnmount() {
@@ -156,7 +156,7 @@ class TimerTester extends React.Component<TimerTesterProps> {
   _iters = 0;
   _start = 0;
   _timerId: ?TimeoutID = null;
-  _rafId: ?AnimationFrameID = null;
+  _rafId: ?number = null;
   _intervalId: ?IntervalID = null;
   _immediateId: ?Object = null;
   _timerFn: ?() => any = null;