Migrate Libraries/Utilities/*.js to use export syntax. (#48665)

Summary:
Pull Request resolved: #48665

## Motivation
Modernising the react-native codebase to allow for ingestion by modern Flow tooling

## This diff
- Updates files in Libraries/Utilities to use `export` syntax
  - `export default` for qualified objects, many `export` statements for collections (determined by how it's imported)
- Appends `.default` to requires of the changed files.
- Updates Jest mocks of the `Platform` module, which happened to touch a lot of test files.
- Updates the public API snapshot (intented breaking change)

Changelog:
[General][Breaking] - Files inside `Libraries/Utilities` use `export` syntax, which requires the addition of `.default` when imported with the CJS `require` syntax.

Reviewed By: huntie

Differential Revision: D68152910

fbshipit-source-id: 07f3a0957f1dbaf44f53974c6f28b273558406eb

Author: iwoplaza

packages/react-native/Libraries/BatchedBridge/MessageQueue.js

@@ -11,9 +11,10 @@
 'use strict';
 
 const Systrace = require('../Performance/Systrace');
-const deepFreezeAndThrowOnMutationInDev = require('../Utilities/deepFreezeAndThrowOnMutationInDev');
+const deepFreezeAndThrowOnMutationInDev =
+  require('../Utilities/deepFreezeAndThrowOnMutationInDev').default;
 const stringifySafe = require('../Utilities/stringifySafe').default;
-const warnOnce = require('../Utilities/warnOnce');
+const warnOnce = require('../Utilities/warnOnce').default;
 const ErrorUtils = require('../vendor/core/ErrorUtils').default;
 const invariant = require('invariant');
 

packages/react-native/Libraries/BatchedBridge/NativeModules.js

@@ -187,7 +187,8 @@ if (global.nativeModuleProxy) {
     '__fbBatchedBridgeConfig is not set, cannot invoke native modules',
   );
 
-  const defineLazyObjectProperty = require('../Utilities/defineLazyObjectProperty');
+  const defineLazyObjectProperty =
+    require('../Utilities/defineLazyObjectProperty').default;
   (bridgeConfig.remoteModuleConfig || []).forEach(
     (config: ModuleConfig, moduleID: number) => {
       // Initially this config will only contain the module name when running in JSC. The actual

packages/react-native/Libraries/Components/Keyboard/__tests__/Keyboard-test.js

@@ -10,7 +10,7 @@
  */
 
 const LayoutAnimation = require('../../../LayoutAnimation/LayoutAnimation');
-const dismissKeyboard = require('../../../Utilities/dismissKeyboard');
+const dismissKeyboard = require('../../../Utilities/dismissKeyboard').default;
 const Keyboard = require('../Keyboard').default;
 
 jest.mock('../../../LayoutAnimation/LayoutAnimation');

packages/react-native/Libraries/Components/LayoutConformance/LayoutConformance.js

@@ -37,7 +37,7 @@ function LayoutConformance(props: Props): React.Node {
 
 function UnimplementedLayoutConformance(props: Props): React.Node {
   if (__DEV__) {
-    const warnOnce = require('../../Utilities/warnOnce');
+    const warnOnce = require('../../Utilities/warnOnce').default;
 
     warnOnce(
       'layoutconformance-unsupported',

packages/react-native/Libraries/Components/RefreshControl/RefreshControl.js

@@ -19,7 +19,7 @@ import PullToRefreshViewNativeComponent, {
 } from './PullToRefreshViewNativeComponent';
 import React from 'react';
 
-const Platform = require('../../Utilities/Platform');
+const Platform = require('../../Utilities/Platform').default;
 
 type IOSProps = $ReadOnly<{
   /**

packages/react-native/Libraries/Components/ScrollView/ScrollViewNativeComponent.js

@@ -42,7 +42,7 @@ export const __INTERNAL_VIEW_CONFIG: PartialViewConfig =
         },
         validAttributes: {
           contentOffset: {
-            diff: require('../../Utilities/differ/pointsDiffer'),
+            diff: require('../../Utilities/differ/pointsDiffer').default,
           },
           decelerationRate: true,
           disableIntervalMomentum: true,
@@ -126,10 +126,10 @@ export const __INTERNAL_VIEW_CONFIG: PartialViewConfig =
           canCancelContentTouches: true,
           centerContent: true,
           contentInset: {
-            diff: require('../../Utilities/differ/insetsDiffer'),
+            diff: require('../../Utilities/differ/insetsDiffer').default,
           },
           contentOffset: {
-            diff: require('../../Utilities/differ/pointsDiffer'),
+            diff: require('../../Utilities/differ/pointsDiffer').default,
           },
           contentInsetAdjustmentBehavior: true,
           decelerationRate: true,
@@ -147,7 +147,7 @@ export const __INTERNAL_VIEW_CONFIG: PartialViewConfig =
           scrollEnabled: true,
           scrollEventThrottle: true,
           scrollIndicatorInsets: {
-            diff: require('../../Utilities/differ/insetsDiffer'),
+            diff: require('../../Utilities/differ/insetsDiffer').default,
           },
           scrollToOverflowEnabled: true,
           scrollsToTop: true,
@@ -159,7 +159,7 @@ export const __INTERNAL_VIEW_CONFIG: PartialViewConfig =
           snapToOffsets: true,
           snapToStart: true,
           verticalScrollIndicatorInsets: {
-            diff: require('../../Utilities/differ/insetsDiffer'),
+            diff: require('../../Utilities/differ/insetsDiffer').default,
           },
           zoomScale: true,
           ...ConditionallyIgnoredEventHandlers({

packages/react-native/Libraries/Components/TextInput/RCTTextInputViewConfig.js

@@ -97,8 +97,9 @@ const RCTTextInputViewConfig = {
     fontSize: true,
     fontWeight: true,
     fontVariant: true,
-    // flowlint-next-line untyped-import:off
-    textShadowOffset: {diff: require('../../Utilities/differ/sizesDiffer')},
+    textShadowOffset: {
+      diff: require('../../Utilities/differ/sizesDiffer').default,
+    },
     allowFontScaling: true,
     fontStyle: true,
     textTransform: true,

packages/react-native/Libraries/Components/TextInput/TextInputState.js

@@ -23,7 +23,7 @@ import {Commands as AndroidTextInputCommands} from '../../Components/TextInput/A
 import {Commands as iOSTextInputCommands} from '../../Components/TextInput/RCTSingelineTextInputNativeComponent';
 
 const {findNodeHandle} = require('../../ReactNative/RendererProxy');
-const Platform = require('../../Utilities/Platform');
+const Platform = require('../../Utilities/Platform').default;
 
 let currentlyFocusedInputRef: ?HostInstance = null;
 const inputs = new Set<{

packages/react-native/Libraries/Core/InitializeCore.js

@@ -51,7 +51,8 @@ if (__DEV__) {
 
 require('../ReactNative/AppRegistry');
 
-const GlobalPerformanceLogger = require('../Utilities/GlobalPerformanceLogger');
+const GlobalPerformanceLogger =
+  require('../Utilities/GlobalPerformanceLogger').default;
 // We could just call GlobalPerformanceLogger.markPoint at the top of the file,
 // but then we'd be excluding the time it took to require the logger.
 // Instead, we just use Date.now and backdate the timestamp.

packages/react-native/Libraries/Core/setUpBatchedBridge.js

@@ -16,20 +16,24 @@ registerModule('Systrace', () => require('../Performance/Systrace'));
 if (!(global.RN$Bridgeless === true)) {
   registerModule('JSTimers', () => require('./Timers/JSTimers').default);
 }
-registerModule('RCTLog', () => require('../Utilities/RCTLog'));
+registerModule('RCTLog', () => require('../Utilities/RCTLog').default);
 registerModule(
   'RCTDeviceEventEmitter',
   () => require('../EventEmitter/RCTDeviceEventEmitter').default,
 );
 registerModule('RCTNativeAppEventEmitter', () =>
   require('../EventEmitter/RCTNativeAppEventEmitter'),
 );
-registerModule('GlobalPerformanceLogger', () =>
-  require('../Utilities/GlobalPerformanceLogger'),
+registerModule(
+  'GlobalPerformanceLogger',
+  () => require('../Utilities/GlobalPerformanceLogger').default,
 );
 
 if (__DEV__) {
-  registerModule('HMRClient', () => require('../Utilities/HMRClient'));
+  registerModule('HMRClient', () => require('../Utilities/HMRClient').default);
 } else {
-  registerModule('HMRClient', () => require('../Utilities/HMRClientProdShim'));
+  registerModule(
+    'HMRClient',
+    () => require('../Utilities/HMRClientProdShim').default,
+  );
 }

packages/react-native/Libraries/Core/setUpDeveloperTools.js

@@ -38,7 +38,7 @@ if (__DEV__) {
     global.navigator.appName === 'Netscape'; // Any real browser
 
   if (!Platform.isTesting) {
-    const HMRClient = require('../Utilities/HMRClient');
+    const HMRClient = require('../Utilities/HMRClient').default;
 
     if (global.__FUSEBOX_HAS_FULL_CONSOLE_SUPPORT__) {
       HMRClient.unstable_notifyFuseboxConsoleEnabled();

packages/react-native/Libraries/Core/setUpReactRefresh.js

@@ -11,7 +11,7 @@
 'use strict';
 
 if (__DEV__) {
-  const DevSettings = require('../Utilities/DevSettings');
+  const DevSettings = require('../Utilities/DevSettings').default;
 
   if (typeof DevSettings.reload !== 'function') {
     throw new Error('Could not find the reload() implementation.');

packages/react-native/Libraries/Image/AssetSourceResolver.js

@@ -24,7 +24,7 @@ import type {
 } from '@react-native/assets-registry/registry';
 
 const PixelRatio = require('../Utilities/PixelRatio').default;
-const Platform = require('../Utilities/Platform');
+const Platform = require('../Utilities/Platform').default;
 const {pickScale} = require('./AssetUtils');
 const {
   getAndroidResourceFolderName,

packages/react-native/Libraries/Image/ImageViewNativeComponent.js

@@ -143,7 +143,7 @@ export const __INTERNAL_VIEW_CONFIG: PartialViewConfig =
         validAttributes: {
           blurRadius: true,
           capInsets: {
-            diff: require('../Utilities/differ/insetsDiffer'),
+            diff: require('../Utilities/differ/insetsDiffer').default,
           },
           defaultSource: {
             process: require('./resolveAssetSource'),

packages/react-native/Libraries/Image/__tests__/resolveAssetSource-test.js

@@ -23,7 +23,7 @@ describe('resolveAssetSource', () => {
     resolveAssetSource = require('../resolveAssetSource');
     NativeSourceCode =
       require('../../NativeModules/specs/NativeSourceCode').default;
-    Platform = require('../../Utilities/Platform');
+    Platform = require('../../Utilities/Platform').default;
   });
 
   it('returns same source for simple static and network images', () => {

packages/react-native/Libraries/Inspector/ElementProperties.js

@@ -23,7 +23,7 @@ const View = require('../Components/View/View');
 const flattenStyle = require('../StyleSheet/flattenStyle');
 const StyleSheet = require('../StyleSheet/StyleSheet');
 const Text = require('../Text/Text').default;
-const mapWithSeparator = require('../Utilities/mapWithSeparator');
+const mapWithSeparator = require('../Utilities/mapWithSeparator').default;
 const BoxInspector = require('./BoxInspector');
 const StyleInspector = require('./StyleInspector');
 

packages/react-native/Libraries/Inspector/Inspector.js

@@ -26,7 +26,7 @@ const PressabilityDebug = require('../Pressability/PressabilityDebug');
 const {findNodeHandle} = require('../ReactNative/RendererProxy');
 const StyleSheet = require('../StyleSheet/StyleSheet');
 const Dimensions = require('../Utilities/Dimensions').default;
-const Platform = require('../Utilities/Platform');
+const Platform = require('../Utilities/Platform').default;
 const getInspectorDataForViewAtPoint = require('./getInspectorDataForViewAtPoint');
 const InspectorOverlay = require('./InspectorOverlay');
 const InspectorPanel = require('./InspectorPanel');

packages/react-native/Libraries/Inspector/PerformanceOverlay.js

@@ -15,7 +15,8 @@ import React from 'react';
 const View = require('../Components/View/View');
 const StyleSheet = require('../StyleSheet/StyleSheet');
 const Text = require('../Text/Text').default;
-const PerformanceLogger = require('../Utilities/GlobalPerformanceLogger');
+const PerformanceLogger =
+  require('../Utilities/GlobalPerformanceLogger').default;
 
 class PerformanceOverlay extends React.Component<{...}> {
   render(): React.Node {

packages/react-native/Libraries/Interaction/InteractionManager.js

@@ -14,7 +14,7 @@ import * as ReactNativeFeatureFlags from '../../src/private/featureflags/ReactNa
 import EventEmitter from '../vendor/emitter/EventEmitter';
 
 const BatchedBridge = require('../BatchedBridge/BatchedBridge').default;
-const infoLog = require('../Utilities/infoLog');
+const infoLog = require('../Utilities/infoLog').default;
 const TaskQueue = require('./TaskQueue');
 const invariant = require('invariant');
 

packages/react-native/Libraries/Interaction/JSEventLoopWatchdog.js

@@ -10,7 +10,7 @@
 
 'use strict';
 
-const infoLog = require('../Utilities/infoLog');
+const infoLog = require('../Utilities/infoLog').default;
 
 type Handler = {
   onIterate?: () => void,

packages/react-native/Libraries/Interaction/TaskQueue.js

@@ -10,7 +10,7 @@
 
 'use strict';
 
-const infoLog = require('../Utilities/infoLog');
+const infoLog = require('../Utilities/infoLog').default;
 const invariant = require('invariant');
 
 type SimpleTask = {

packages/react-native/Libraries/Lists/FlatList.js

@@ -28,8 +28,8 @@ import memoizeOne from 'memoize-one';
 import React from 'react';
 
 const StyleSheet = require('../StyleSheet/StyleSheet');
-const deepDiffer = require('../Utilities/differ/deepDiffer');
-const Platform = require('../Utilities/Platform');
+const deepDiffer = require('../Utilities/differ/deepDiffer').default;
+const Platform = require('../Utilities/Platform').default;
 const invariant = require('invariant');
 
 type RequiredProps<ItemT> = {

packages/react-native/Libraries/Modal/Modal.js

@@ -26,7 +26,7 @@ const AppContainer = require('../ReactNative/AppContainer');
 const I18nManager = require('../ReactNative/I18nManager');
 const {RootTagContext} = require('../ReactNative/RootTag');
 const StyleSheet = require('../StyleSheet/StyleSheet');
-const Platform = require('../Utilities/Platform');
+const Platform = require('../Utilities/Platform').default;
 
 type ModalEventDefinitions = {
   modalDismissed: [{modalID: number}],

packages/react-native/Libraries/NativeComponent/BaseViewConfig.ios.js

@@ -201,13 +201,13 @@ const validAttributesForNonEventProps = {
   cursor: true,
   opacity: true,
   shadowColor: {process: require('../StyleSheet/processColor').default},
-  shadowOffset: {diff: require('../Utilities/differ/sizesDiffer')},
+  shadowOffset: {diff: require('../Utilities/differ/sizesDiffer').default},
   shadowOpacity: true,
   shadowRadius: true,
   needsOffscreenAlphaCompositing: true,
   overflow: true,
   shouldRasterizeIOS: true,
-  transform: {diff: require('../Utilities/differ/matricesDiffer')},
+  transform: {diff: require('../Utilities/differ/matricesDiffer').default},
   transformOrigin: true,
   accessibilityRole: true,
   accessibilityState: true,
@@ -222,7 +222,7 @@ const validAttributesForNonEventProps = {
   borderWidth: true,
   borderBlockWidth: true,
   borderStyle: true,
-  hitSlop: {diff: require('../Utilities/differ/insetsDiffer')},
+  hitSlop: {diff: require('../Utilities/differ/insetsDiffer').default},
   collapsable: true,
   collapsableChildren: true,
   filter: {

packages/react-native/Libraries/Network/XMLHttpRequest.js

@@ -16,7 +16,8 @@ import {type EventSubscription} from '../vendor/emitter/EventEmitter';
 import EventTarget from 'event-target-shim';
 
 const BlobManager = require('../Blob/BlobManager').default;
-const GlobalPerformanceLogger = require('../Utilities/GlobalPerformanceLogger');
+const GlobalPerformanceLogger =
+  require('../Utilities/GlobalPerformanceLogger').default;
 const RCTNetworking = require('./RCTNetworking').default;
 const base64 = require('base64-js');
 const invariant = require('invariant');

packages/react-native/Libraries/Network/__tests__/XMLHttpRequest-test.js

@@ -12,12 +12,19 @@
 
 const createPerformanceLogger =
   require('../../Utilities/createPerformanceLogger').default;
-const GlobalPerformanceLogger = require('../../Utilities/GlobalPerformanceLogger');
-const Platform = require('../../Utilities/Platform');
+const GlobalPerformanceLogger =
+  require('../../Utilities/GlobalPerformanceLogger').default;
+const Platform = require('../../Utilities/Platform').default;
 const XMLHttpRequest = require('../XMLHttpRequest');
 
 jest.unmock('../../Utilities/Platform');
-jest.mock('../../Utilities/GlobalPerformanceLogger');
+jest
+  .spyOn(GlobalPerformanceLogger, 'startTimespan')
+  .mockImplementation(() => {});
+jest
+  .spyOn(GlobalPerformanceLogger, 'stopTimespan')
+  .mockImplementation(() => {});
+
 let requestId = 1;
 function setRequestId(id) {
   if (Platform.OS === 'ios') {

packages/react-native/Libraries/Network/convertRequestBody.js

@@ -13,7 +13,7 @@
 import typeof BlobT from '../Blob/Blob';
 
 const Blob: BlobT = require('../Blob/Blob').default;
-const binaryToBase64 = require('../Utilities/binaryToBase64');
+const binaryToBase64 = require('../Utilities/binaryToBase64').default;
 const FormData = require('./FormData');
 
 export type RequestBody =

packages/react-native/Libraries/PermissionsAndroid/PermissionsAndroid.js

@@ -17,7 +17,7 @@ import NativeDialogManagerAndroid from '../NativeModules/specs/NativeDialogManag
 import NativePermissionsAndroid from './NativePermissionsAndroid';
 import invariant from 'invariant';
 
-const Platform = require('../Utilities/Platform');
+const Platform = require('../Utilities/Platform').default;
 
 export type Rationale = {
   title: string,

packages/react-native/Libraries/Pressability/__tests__/Pressability-test.js

@@ -16,7 +16,7 @@ import type {PressEvent} from '../../Types/CoreEventTypes';
 import type {PressabilityConfig} from '../Pressability';
 
 const UIManager = require('../../ReactNative/UIManager');
-const Platform = require('../../Utilities/Platform');
+const Platform = require('../../Utilities/Platform').default;
 const HoverState = require('../HoverState');
 const Pressability = require('../Pressability').default;
 const invariant = require('invariant');

packages/react-native/Libraries/ReactNative/PaperUIManager.js

@@ -15,8 +15,9 @@ import NativeUIManager from './NativeUIManager';
 import nullthrows from 'nullthrows';
 
 const NativeModules = require('../BatchedBridge/NativeModules').default;
-const defineLazyObjectProperty = require('../Utilities/defineLazyObjectProperty');
-const Platform = require('../Utilities/Platform');
+const defineLazyObjectProperty =
+  require('../Utilities/defineLazyObjectProperty').default;
+const Platform = require('../Utilities/Platform').default;
 const UIManagerProperties = require('./UIManagerProperties');
 
 const viewManagerConfigs: {[string]: any | null} = {};

packages/react-native/Libraries/ReactNative/getNativeComponentAttributes.js

@@ -19,10 +19,10 @@ const processBackgroundImage =
 const processColor = require('../StyleSheet/processColor').default;
 const processColorArray = require('../StyleSheet/processColorArray');
 const processFilter = require('../StyleSheet/processFilter').default;
-const insetsDiffer = require('../Utilities/differ/insetsDiffer');
-const matricesDiffer = require('../Utilities/differ/matricesDiffer');
-const pointsDiffer = require('../Utilities/differ/pointsDiffer');
-const sizesDiffer = require('../Utilities/differ/sizesDiffer');
+const insetsDiffer = require('../Utilities/differ/insetsDiffer').default;
+const matricesDiffer = require('../Utilities/differ/matricesDiffer').default;
+const pointsDiffer = require('../Utilities/differ/pointsDiffer').default;
+const sizesDiffer = require('../Utilities/differ/sizesDiffer').default;
 const UIManager = require('./UIManager');
 const nullthrows = require('nullthrows');