Make remaining Utilities modules Flow strict-local (#57739)

Summary:
Pull Request resolved: #57739

Upgrade `deepDiffer`, `codegenNativeCommands`, `Dimensions`, and `ReactNativeTestTools` from `flow` to `flow strict-local`, preserving public type signatures. These operate on values of arbitrary shape, so the unavoidable internal `any` usages are marked with scoped `$FlowFixMe[unclear-type]`.

Changelog: [Internal]

Reviewed By: javache

Differential Revision: D113763789

Author: rubennorte

packages/react-native/Libraries/Utilities/Dimensions.js

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @flow
+ * @flow strict-local
  * @format
  */
 
@@ -21,14 +21,39 @@ import invariant from 'invariant';
 
 export type {DimensionsPayload, DisplayMetrics, DisplayMetricsAndroid};
 
+export type DimensionsChangePayload = Readonly<{
+  window: DisplayMetrics,
+  screen: DisplayMetrics,
+}>;
+
 /** @deprecated Use DisplayMetrics */
 export type ScaledSize = DisplayMetrics;
 
 const eventEmitter = new EventEmitter<{
-  change: [DimensionsPayload],
+  change: [DimensionsChangePayload],
 }>();
 let dimensionsInitialized = false;
-let dimensions: DimensionsPayload;
+let dimensions: DimensionsChangePayload;
+
+declare function addDimensionsEventListener(
+  type: 'change',
+  handler: (dimensions: DimensionsChangePayload) => void,
+): EventSubscription;
+declare function addDimensionsEventListener(
+  type: 'change',
+  handler: (dimensions: {window: {width: number, height: number}}) => void,
+): EventSubscription;
+function addDimensionsEventListener(
+  type: 'change',
+  handler: (dimensions: DimensionsChangePayload) => void,
+) {
+  invariant(
+    type === 'change',
+    'Trying to subscribe to unknown event: "%s"',
+    type,
+  );
+  return eventEmitter.addListener(type, handler);
+}
 
 /**
  * Provides the application window's width and height. Prefer
@@ -91,6 +116,9 @@ class Dimensions {
       screen = window;
     }
 
+    invariant(window != null, 'Dimensions must define window metrics');
+    invariant(screen != null, 'Dimensions must define screen metrics');
+
     dimensions = {window, screen};
     if (dimensionsInitialized) {
       // Don't fire 'change' the first time the dimensions are set.
@@ -109,17 +137,8 @@ class Dimensions {
    *   `screen` properties whose values are the same as the return values of
    *   `Dimensions.get('window')` and `Dimensions.get('screen')`, respectively.
    */
-  static addEventListener(
-    type: 'change',
-    handler: Function,
-  ): EventSubscription {
-    invariant(
-      type === 'change',
-      'Trying to subscribe to unknown event: "%s"',
-      type,
-    );
-    return eventEmitter.addListener(type, handler);
-  }
+  static addEventListener: typeof addDimensionsEventListener =
+    addDimensionsEventListener;
 }
 
 // Subscribe before calling getConstants to make sure we don't miss any updates in between.

packages/react-native/Libraries/Utilities/ReactNativeTestTools.js

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @flow
+ * @flow strict-local
  * @format
  */
 
@@ -163,7 +163,9 @@ function maximumDepthOfJSON(node: ?ReactTestRendererJSON): number {
   }
 }
 
-function renderAndEnforceStrictMode(element: React.Node): any {
+function renderAndEnforceStrictMode(
+  element: React.Node,
+): ReactTestRendererType {
   expectNoConsoleError();
   return renderWithStrictMode(element);
 }
@@ -217,8 +219,13 @@ function scrollToBottom(instance: ReactTestInstance) {
 // To make error messages a little bit better, we attach a custom toString
 // implementation to a predicate
 function withMessage(fn: Predicate, message: string): Predicate {
-  (fn as any).toString = () => message;
-  return fn;
+  return new Proxy(fn, {
+    get(target, property, receiver) {
+      return property === 'toString'
+        ? () => message
+        : Reflect.get(target, property, receiver);
+    },
+  });
 }
 
 export {byClickable};

packages/react-native/Libraries/Utilities/codegenNativeCommands.js

@@ -4,30 +4,40 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @flow
+ * @flow strict-local
  * @format
  */
 
+import type {HostInstance} from '../../src/private/types/HostInstance';
+
 const {dispatchCommand} = require('../ReactNative/RendererProxy');
 
 type NativeCommandsOptions<T = string> = Readonly<{
   supportedCommands: ReadonlyArray<T>,
 }>;
 
+declare function castCommandObject<T extends interface {}>(commandObj: {
+  [keyof T]: (...ReadonlyArray<unknown>) => void,
+}): T;
+function castCommandObject(commandObj: interface {}) {
+  return commandObj;
+}
+
 function codegenNativeCommands<T extends interface {}>(
-  options: NativeCommandsOptions<keyof T>,
+  options: NativeCommandsOptions<keyof T & string>,
 ): T {
   const commandObj: {[keyof T]: (...ReadonlyArray<unknown>) => void} = {};
 
   options.supportedCommands.forEach(command => {
-    // $FlowFixMe[missing-local-annot]
-    commandObj[command] = (ref, ...args) => {
-      // $FlowFixMe[incompatible-type]
+    commandObj[command] = (
+      ref: HostInstance,
+      ...args: Array<unknown>
+    ): void => {
       dispatchCommand(ref, command, args);
     };
   });
 
-  return commandObj as any as T;
+  return castCommandObject(commandObj);
 }
 
 export default codegenNativeCommands;

packages/react-native/Libraries/Utilities/differ/__tests__/deepDiffer-itest.js

@@ -136,7 +136,7 @@ describe('deepDiffer', function () {
     expect(
       deepDiffer(
         () => {},
-        x => x,
+        (x: unknown) => x,
       ),
     ).toBe(false);
     const f = () => {};
@@ -146,7 +146,7 @@ describe('deepDiffer', function () {
     expect(
       deepDiffer(
         () => {},
-        x => x,
+        (x: unknown) => x,
         undefined,
         {unsafelyIgnoreFunctions: false},
       ),
@@ -160,7 +160,7 @@ describe('deepDiffer', function () {
     expect(
       deepDiffer(
         () => {},
-        x => x,
+        (x: unknown) => x,
         {unsafelyIgnoreFunctions: false},
       ),
     ).toBe(true);

packages/react-native/Libraries/Utilities/differ/deepDiffer.js

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @flow
+ * @flow strict-local
  * @format
  */
 
@@ -29,8 +29,8 @@ function unstable_setLogListeners(listeners: ?LogListeners) {
  * @returns {bool} true if different, false if equal
  */
 function deepDiffer(
-  one: any,
-  two: any,
+  one: unknown,
+  two: unknown,
   maxDepthOrOptions: Options | number = -1,
   maybeOptions?: Options,
 ): boolean {
@@ -73,7 +73,9 @@ function deepDiffer(
     return true;
   }
   if (Array.isArray(one)) {
-    // We know two is also an array because the constructors are equal
+    if (!Array.isArray(two)) {
+      return true;
+    }
     const len = one.length;
     if (two.length !== len) {
       return true;

packages/react-native/Libraries/Utilities/useWindowDimensions.js

@@ -27,9 +27,10 @@ export default function useWindowDimensions():
   useEffect(() => {
     function handleChange({
       window,
-    }: {
+    }: Readonly<{
       window: DisplayMetrics | DisplayMetricsAndroid,
-    }) {
+      ...
+    }>) {
       if (
         dimensions.width !== window.width ||
         dimensions.height !== window.height ||

packages/react-native/ReactNativeApi.d.ts

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<efd59db9214ec5f9de127d9b01190bc6>>
+ * @generated SignedSource<<0a4f0d7eaba8d41ac162fef49584255e>>
  *
  * This file was generated by scripts/js-api/build-types/index.js.
  */
@@ -1116,6 +1116,23 @@ declare type add = typeof add
 declare function addChangeListener(
   listener: (preferences: AppearancePreferences) => void,
 ): EventSubscription
+declare function addDimensionsEventListener(
+  type: "change",
+  handler: (dimensions: DimensionsChangePayload) => void,
+): EventSubscription
+declare function addDimensionsEventListener(
+  type: "change",
+  handler: (dimensions: {
+    window: {
+      height: number
+      width: number
+    }
+  }) => void,
+): EventSubscription
+declare function addDimensionsEventListener(
+  type: "change",
+  handler: (dimensions: DimensionsChangePayload) => void,
+): void
 declare class Alert {
   static alert(
     title: null | string | undefined,
@@ -1730,7 +1747,7 @@ declare class CellRenderMask {
 declare type Clipboard = typeof Clipboard
 declare type codegenNativeCommands = typeof codegenNativeCommands
 declare function codegenNativeCommands_default<T extends {}>(
-  options: NativeCommandsOptions<keyof T>,
+  options: NativeCommandsOptions<keyof T & string>,
 ): T
 declare type codegenNativeComponent = typeof codegenNativeComponent
 declare function codegenNativeComponent_default<Props extends {}>(
@@ -1879,10 +1896,14 @@ declare type DevMenuStatic = {
 declare type DevSettings = typeof DevSettings
 declare type diffClamp = typeof diffClamp
 declare class Dimensions {
-  static addEventListener(type: "change", handler: Function): EventSubscription
+  static addEventListener: typeof addDimensionsEventListener
   static get(dim: string): DisplayMetrics | DisplayMetricsAndroid
   static set(dims: Readonly<DimensionsPayload>): void
 }
+declare type DimensionsChangePayload = {
+  readonly screen: DisplayMetrics
+  readonly window: DisplayMetrics
+}
 declare type DimensionsPayload = {
   screen?: DisplayMetrics
   screenPhysicalPixels?: DisplayMetricsAndroid
@@ -5797,7 +5818,7 @@ export {
   DeviceInfo, // 0f5a517b
   DeviceInfoConstants, // 279e7858
   DimensionValue, // b163a381
-  Dimensions, // 980ef68c
+  Dimensions, // 7439fe08
   DimensionsPayload, // 653bc26c
   DisplayMetrics, // 1dc35cef
   DisplayMetricsAndroid, // 872e62eb
@@ -6051,7 +6072,7 @@ export {
   VirtualizedSectionListInstance, // 12b706d5
   VirtualizedSectionListProps, // 52c34787
   WrapperComponentProvider, // 9b4247f6
-  codegenNativeCommands, // 628a7c0a
+  codegenNativeCommands, // 322f3f4e
   codegenNativeComponent, // 520daa94
   findNodeHandle, // 93f80214
   processColor, // 6e877698

packages/rn-tester/js/examples/Dimensions/DimensionsExample.js

@@ -15,7 +15,7 @@ import * as React from 'react';
 import {useEffect, useState} from 'react';
 import {Button, Dimensions, View, useWindowDimensions} from 'react-native';
 
-type Props = {dim: string};
+type Props = {dim: 'screen' | 'window'};
 
 function DimensionsSubscription(props: Props) {
   const [dims, setDims] = useState(() => Dimensions.get(props.dim));