@office-iss/react-native-win32 0.81.2 → 0.82.0-preview.2

package/Libraries/Network/XMLHttpRequest.js

@@ -34,6 +34,9 @@ const RCTNetworking = require('./RCTNetworking').default;
 const base64 = require('base64-js');
 const invariant = require('invariant');
 
+const PERFORMANCE_TRACK_NAME = 'Network (JS-initiated only)';
+const PERFORMANCE_TRACK_GROUP = 'Chrome DevTools Temp Compat';
+
 declare var performance: Performance;
 
 const DEBUG_NETWORK_SEND_DELAY: false = false; // Set to a number of milliseconds when debugging
@@ -385,6 +388,9 @@ class XMLHttpRequest extends EventTarget {
     if (requestId !== this._requestId) {
       return;
     }
+
+    const start = XMLHttpRequest._profiling ? performance.now() : undefined;
+
     if (!this._response) {
       this._response = responseText;
     } else {
@@ -392,8 +398,12 @@ class XMLHttpRequest extends EventTarget {
     }
 
     if (XMLHttpRequest._profiling) {
-      performance.mark(
-        'Track:XMLHttpRequest:Incremental Data: ' + this._getMeasureURL(),
+      console.timeStamp(
+        'Incremental Data: ' + this._getMeasureURL(),
+        start,
+        undefined,
+        PERFORMANCE_TRACK_NAME,
+        PERFORMANCE_TRACK_GROUP,
       );
     }
     XMLHttpRequest._interceptor &&
@@ -442,10 +452,13 @@ class XMLHttpRequest extends EventTarget {
       this.setReadyState(this.DONE);
       if (XMLHttpRequest._profiling && this._startTime != null) {
         const start = this._startTime;
-        performance.measure('Track:XMLHttpRequest:' + this._getMeasureURL(), {
+        console.timeStamp(
+          this._getMeasureURL(),
           start,
-          end: performance.now(),
-        });
+          undefined,
+          PERFORMANCE_TRACK_NAME,
+          PERFORMANCE_TRACK_GROUP,
+        );
       }
       if (error) {
         XMLHttpRequest._interceptor &&
@@ -646,6 +659,8 @@ class XMLHttpRequest extends EventTarget {
         this.withCredentials,
       );
     };
+    /* $FlowFixMe[constant-condition] Error discovered during Constant
+     * Condition roll out. See https://fburl.com/workplace/1v97vimq. */
     if (DEBUG_NETWORK_SEND_DELAY) {
       setTimeout(doSend, DEBUG_NETWORK_SEND_DELAY);
     } else {

package/Libraries/Network/convertRequestBody.js

@@ -36,7 +36,7 @@ function convertRequestBody(body: RequestBody): Object {
     return {formData: body.getParts()};
   }
   if (body instanceof ArrayBuffer || ArrayBuffer.isView(body)) {
-    /* $FlowFixMe[incompatible-call] : no way to assert that 'body' is indeed
+    /* $FlowFixMe[incompatible-type] : no way to assert that 'body' is indeed
      * an ArrayBufferView */
     return {base64: binaryToBase64(body)};
   }

package/Libraries/PermissionsAndroid/PermissionsAndroid.js

@@ -8,6 +8,8 @@
  * @format
  */
 
+import type {DialogOptions} from '../../src/private/specs_DEPRECATED/modules/NativeDialogManagerAndroid';
+
 import NativeDialogManagerAndroid from '../NativeModules/specs/NativeDialogManagerAndroid';
 import NativePermissionsAndroid from './NativePermissionsAndroid';
 import invariant from 'invariant';
@@ -249,24 +251,24 @@ class PermissionsAndroidImpl {
 
       if (shouldShowRationale && !!NativeDialogManagerAndroid) {
         return new Promise((resolve, reject) => {
-          const options = {
+          /* $FlowFixMe[incompatible-exact] (>=0.111.0 site=react_native_fb)
+           * This comment suppresses an error found when Flow v0.111 was
+           * deployed. To see the error, delete this comment and run Flow.
+           */
+          const options: DialogOptions = {
             ...rationale,
           };
           NativeDialogManagerAndroid.showAlert(
-            /* $FlowFixMe[incompatible-exact] (>=0.111.0 site=react_native_fb)
-             * This comment suppresses an error found when Flow v0.111 was
-             * deployed. To see the error, delete this comment and run Flow.
-             */
             options,
             () => reject(new Error('Error showing rationale')),
             () =>
-              // $FlowFixMe[incompatible-call]
+              // $FlowFixMe[incompatible-type]
               resolve(NativePermissionsAndroid.requestPermission(permission)),
           );
         });
       }
     }
-    // $FlowFixMe[incompatible-return]
+    // $FlowFixMe[incompatible-type]
     return NativePermissionsAndroid.requestPermission(permission);
   }
 
@@ -291,8 +293,7 @@ class PermissionsAndroidImpl {
       NativePermissionsAndroid,
       'PermissionsAndroid is not installed correctly.',
     );
-    // $FlowFixMe[incompatible-return]
-    // $FlowFixMe[incompatible-call]
+    // $FlowFixMe[incompatible-type]
     return NativePermissionsAndroid.requestMultiplePermissions(permissions);
   }
 }

package/Libraries/Pressability/HoverState.js

@@ -14,6 +14,8 @@ let isEnabled = false;
 
 /* $FlowFixMe[incompatible-type] Error found due to incomplete typing of
  * Platform.flow.js */
+/* $FlowFixMe[invalid-compare] Error discovered during Constant Condition roll
+ * out. See https://fburl.com/workplace/4oq3zi07. */
 if (Platform.OS === 'web') {
   const canUseDOM = Boolean(
     typeof window !== 'undefined' &&

package/Libraries/Pressability/HoverState.win32.js

@@ -14,6 +14,8 @@ let isEnabled = false;
 
 /* $FlowFixMe[incompatible-type] Error found due to incomplete typing of
  * Platform.flow.js */
+/* $FlowFixMe[invalid-compare] Error discovered during Constant Condition roll
+ * out. See https://fburl.com/workplace/4oq3zi07. */
 if (Platform.OS === 'web') {
   const canUseDOM = Boolean(
     typeof window !== 'undefined' &&

package/Libraries/Pressability/Pressability.js

@@ -16,8 +16,8 @@ import type {
   MouseEvent,
 } from '../Types/CoreEventTypes';
 
+import * as ReactNativeFeatureFlags from '../../src/private/featureflags/ReactNativeFeatureFlags';
 import SoundManager from '../Components/Sound/SoundManager';
-import ReactNativeFeatureFlags from '../ReactNative/ReactNativeFeatureFlags';
 import UIManager from '../ReactNative/UIManager';
 import {type RectOrSize, normalizeRect} from '../StyleSheet/Rect';
 import {type PointerEvent} from '../Types/CoreEventTypes';

package/Libraries/Pressability/Pressability.win32.js

@@ -17,8 +17,8 @@ import type {
   MouseEvent,
 } from '../Types/CoreEventTypes';
 
+import * as ReactNativeFeatureFlags from '../../src/private/featureflags/ReactNativeFeatureFlags';
 import SoundManager from '../Components/Sound/SoundManager';
-import ReactNativeFeatureFlags from '../ReactNative/ReactNativeFeatureFlags';
 import UIManager from '../ReactNative/UIManager';
 import {type RectOrSize, normalizeRect} from '../StyleSheet/Rect';
 import {type PointerEvent} from '../Types/CoreEventTypes';

package/Libraries/PushNotificationIOS/PushNotificationIOS.js

@@ -210,7 +210,7 @@ class PushNotificationIOS {
       NativePushNotificationManagerIOS,
       'PushNotificationManager is not available.',
     );
-    // $FlowFixMe[prop-missing]
+    // $FlowFixMe[incompatible-type]
     NativePushNotificationManagerIOS.presentLocalNotification(details);
   }
 
@@ -235,7 +235,7 @@ class PushNotificationIOS {
       NativePushNotificationManagerIOS,
       'PushNotificationManager is not available.',
     );
-    // $FlowFixMe[prop-missing]
+    // $FlowFixMe[incompatible-type]
     NativePushNotificationManagerIOS.scheduleLocalNotification(details);
   }
 

package/Libraries/ReactNative/AppRegistryImpl.js

@@ -26,8 +26,6 @@ import createPerformanceLogger from '../Utilities/createPerformanceLogger';
 import SceneTracker from '../Utilities/SceneTracker';
 import {coerceDisplayMode} from './DisplayMode';
 import HeadlessJsTaskError from './HeadlessJsTaskError';
-import NativeHeadlessJsTaskSupport from './NativeHeadlessJsTaskSupport';
-import renderApplication from './renderApplication';
 import {unmountComponentAtNodeAndRemoveContainer} from './RendererProxy';
 import invariant from 'invariant';
 
@@ -86,6 +84,7 @@ export function registerComponent(
 ): string {
   const scopedPerformanceLogger = createPerformanceLogger();
   runnables[appKey] = (appParameters, displayMode) => {
+    const renderApplication = require('./renderApplication').default;
     renderApplication(
       componentProviderInstrumentationHook(
         componentProvider,
@@ -258,6 +257,9 @@ export function startHeadlessTask(
   taskKey: string,
   data: any,
 ): void {
+  const NativeHeadlessJsTaskSupport =
+    require('./NativeHeadlessJsTaskSupport').default;
+
   const taskProvider = taskProviders.get(taskKey);
   if (!taskProvider) {
     console.warn(`No task registered for key ${taskKey}`);

package/Libraries/ReactNative/ReactFabricPublicInstance/ReactFabricHostComponent.js

@@ -58,10 +58,12 @@ export default class ReactFabricHostComponent implements NativeMethods {
   }
 
   blur() {
+    // $FlowFixMe[incompatible-type] - Error supressed during the migration of HostInstance to ReactNativeElement
     TextInputState.blurTextInput(this);
   }
 
   focus() {
+    // $FlowFixMe[incompatible-type] - Error supressed during the migration of HostInstance to ReactNativeElement
     TextInputState.focusTextInput(this);
   }
 

package/Libraries/ReactNative/ReactFabricPublicInstance/ReactFabricPublicInstance.js

@@ -132,7 +132,7 @@ export function getNodeFromPublicInstance(
     RendererProxy = require('../../ReactNative/RendererProxy');
   }
   return RendererProxy.getNodeFromInternalInstanceHandle(
-    // $FlowExpectedError[incompatible-call] __internalInstanceHandle is always an InternalInstanceHandle from React when we get here.
+    // $FlowExpectedError[incompatible-type] __internalInstanceHandle is always an InternalInstanceHandle from React when we get here.
     publicInstance.__internalInstanceHandle,
   );
 }
@@ -143,10 +143,10 @@ export function getInternalInstanceHandleFromPublicInstance(
   // TODO(T174762768): Remove this once OSS versions of renderers will be synced.
   // $FlowExpectedError[prop-missing] Keeping this for backwards-compatibility with the renderers versions in open source.
   if (publicInstance._internalInstanceHandle != null) {
-    // $FlowExpectedError[incompatible-return] Keeping this for backwards-compatibility with the renderers versions in open source.
+    // $FlowExpectedError[incompatible-type] Keeping this for backwards-compatibility with the renderers versions in open source.
     return publicInstance._internalInstanceHandle;
   }
 
-  // $FlowExpectedError[incompatible-return] __internalInstanceHandle is always an InternalInstanceHandle from React when we get here.
+  // $FlowExpectedError[incompatible-type] __internalInstanceHandle is always an InternalInstanceHandle from React when we get here.
   return publicInstance.__internalInstanceHandle;
 }

package/Libraries/ReactNative/RendererImplementation.js

@@ -9,19 +9,71 @@
  */
 
 import type {HostInstance} from '../../src/private/types/HostInstance';
-import type {
-  InternalInstanceHandle,
-  Node,
-} from '../Renderer/shims/ReactNativeTypes';
+import typeof ReactFabricType from '../Renderer/shims/ReactFabric';
+import typeof ReactNativeType from '../Renderer/shims/ReactNative';
+import type {RootTag} from './RootTag';
 
 import {
   onCaughtError,
   onRecoverableError,
   onUncaughtError,
 } from '../../src/private/renderer/errorhandling/ErrorHandlers';
-import {type RootTag} from './RootTag';
 import * as React from 'react';
 
+let cachedFabricRenderer;
+let cachedPaperRenderer;
+
+function getFabricRenderer(): ReactFabricType {
+  if (cachedFabricRenderer == null) {
+    cachedFabricRenderer = require('../Renderer/shims/ReactFabric').default;
+  }
+  return cachedFabricRenderer;
+}
+
+function getPaperRenderer(): ReactNativeType {
+  if (cachedPaperRenderer == null) {
+    cachedPaperRenderer = require('../Renderer/shims/ReactNative').default;
+  }
+  return cachedPaperRenderer;
+}
+
+const getMethod: (<MethodName: $Keys<ReactFabricType>>(
+  () => ReactFabricType,
+  MethodName,
+) => ReactFabricType[MethodName]) &
+  (<MethodName: $Keys<ReactNativeType>>(
+    () => ReactNativeType,
+    MethodName,
+  ) => ReactNativeType[MethodName]) = (getRenderer, methodName) => {
+  let cachedImpl;
+
+  // $FlowExpectedError[incompatible-type]
+  return function (arg1, arg2, arg3, arg4, arg5, arg6) {
+    if (cachedImpl == null) {
+      // $FlowExpectedError[prop-missing]
+      cachedImpl = getRenderer()[methodName];
+    }
+
+    // $FlowExpectedError[extra-arg]
+    return cachedImpl(arg1, arg2, arg3, arg4, arg5);
+  };
+};
+
+function getFabricMethod<MethodName: $Keys<ReactFabricType>>(
+  methodName: MethodName,
+): ReactFabricType[MethodName] {
+  return getMethod(getFabricRenderer, methodName);
+}
+
+function getPaperMethod<MethodName: $Keys<ReactNativeType>>(
+  methodName: MethodName,
+): ReactNativeType[MethodName] {
+  return getMethod(getPaperRenderer, methodName);
+}
+
+let cachedFabricRender;
+let cachedPaperRender;
+
 export function renderElement({
   element,
   rootTag,
@@ -34,50 +86,30 @@ export function renderElement({
   useConcurrentRoot: boolean,
 }): void {
   if (useFabric) {
-    require('../Renderer/shims/ReactFabric').default.render(
-      element,
-      rootTag,
-      null,
-      useConcurrentRoot,
-      {
-        onCaughtError,
-        onUncaughtError,
-        onRecoverableError,
-      },
-    );
+    if (cachedFabricRender == null) {
+      cachedFabricRender = getFabricRenderer().render;
+    }
+
+    cachedFabricRender(element, rootTag, null, useConcurrentRoot, {
+      onCaughtError,
+      onUncaughtError,
+      onRecoverableError,
+    });
   } else {
-    require('../Renderer/shims/ReactNative').default.render(
-      element,
-      rootTag,
-      undefined,
-      {
-        onCaughtError,
-        onUncaughtError,
-        onRecoverableError,
-      },
-    );
-  }
-}
+    if (cachedPaperRender == null) {
+      cachedPaperRender = getPaperRenderer().render;
+    }
 
-export function findHostInstance_DEPRECATED<TElementType: React.ElementType>(
-  // $FlowFixMe[incompatible-call]
-  componentOrHandle: ?(React.ElementRef<TElementType> | number),
-): ?HostInstance {
-  return require('../Renderer/shims/ReactNative').default.findHostInstance_DEPRECATED(
-    // $FlowFixMe[incompatible-call]
-    componentOrHandle,
-  );
+    cachedPaperRender(element, rootTag, undefined, {
+      onCaughtError,
+      onUncaughtError,
+      onRecoverableError,
+    });
+  }
 }
 
-export function findNodeHandle<TElementType: React.ElementType>(
-  // $FlowFixMe[incompatible-call]
-  componentOrHandle: ?(React.ElementRef<TElementType> | number),
-): ?number {
-  return require('../Renderer/shims/ReactNative').default.findNodeHandle(
-    // $FlowFixMe[incompatible-call]
-    componentOrHandle,
-  );
-}
+let cachedFabricDispatchCommand;
+let cachedPaperDispatchCommand;
 
 export function dispatchCommand(
   handle: HostInstance,
@@ -87,90 +119,58 @@ export function dispatchCommand(
   if (global.RN$Bridgeless === true) {
     // Note: this function has the same implementation in the legacy and new renderer.
     // However, evaluating the old renderer comes with some side effects.
-    return require('../Renderer/shims/ReactFabric').default.dispatchCommand(
-      handle,
-      command,
-      args,
-    );
+    if (cachedFabricDispatchCommand == null) {
+      cachedFabricDispatchCommand = getFabricRenderer().dispatchCommand;
+    }
+
+    return cachedFabricDispatchCommand(handle, command, args);
   } else {
-    return require('../Renderer/shims/ReactNative').default.dispatchCommand(
-      handle,
-      command,
-      args,
-    );
+    if (cachedPaperDispatchCommand == null) {
+      cachedPaperDispatchCommand = getPaperRenderer().dispatchCommand;
+    }
+
+    return cachedPaperDispatchCommand(handle, command, args);
   }
 }
 
-export function sendAccessibilityEvent(
-  handle: HostInstance,
-  eventType: string,
-): void {
-  return require('../Renderer/shims/ReactNative').default.sendAccessibilityEvent(
-    handle,
-    eventType,
-  );
-}
+export const findHostInstance_DEPRECATED: <TElementType: React.ElementType>(
+  // $FlowExpectedError[incompatible-type]
+  componentOrHandle: ?(React.ElementRef<TElementType> | number),
+) => ?HostInstance = getPaperMethod('findHostInstance_DEPRECATED');
+
+export const findNodeHandle: <TElementType: React.ElementType>(
+  // $FlowExpectedError[incompatible-type]
+  componentOrHandle: ?(React.ElementRef<TElementType> | number),
+) => ?number = getPaperMethod('findNodeHandle');
+
+export const sendAccessibilityEvent: ReactNativeType['sendAccessibilityEvent'] =
+  getPaperMethod('sendAccessibilityEvent');
 
 /**
  * This method is used by AppRegistry to unmount a root when using the old
  * React Native renderer (Paper).
  */
-export function unmountComponentAtNodeAndRemoveContainer(rootTag: RootTag) {
-  // $FlowExpectedError[incompatible-type] rootTag is an opaque type so we can't really cast it as is.
-  const rootTagAsNumber: number = rootTag;
-  require('../Renderer/shims/ReactNative').default.unmountComponentAtNodeAndRemoveContainer(
-    rootTagAsNumber,
-  );
-}
+export const unmountComponentAtNodeAndRemoveContainer: (
+  rootTag: RootTag,
+) => void =
+  // $FlowExpectedError[incompatible-type]
+  getPaperMethod('unmountComponentAtNodeAndRemoveContainer');
 
-export function unstable_batchedUpdates<T>(
-  fn: T => void,
-  bookkeeping: T,
-): void {
-  // This doesn't actually do anything when batching updates for a Fabric root.
-  return require('../Renderer/shims/ReactNative').default.unstable_batchedUpdates(
-    fn,
-    bookkeeping,
-  );
-}
+export const unstable_batchedUpdates: ReactNativeType['unstable_batchedUpdates'] =
+  getPaperMethod('unstable_batchedUpdates');
 
-export function isProfilingRenderer(): boolean {
-  return Boolean(__DEV__);
-}
+export const isChildPublicInstance: ReactNativeType['isChildPublicInstance'] =
+  getPaperMethod('isChildPublicInstance');
 
-export function isChildPublicInstance(
-  parentInstance: HostInstance,
-  childInstance: HostInstance,
-): boolean {
-  return require('../Renderer/shims/ReactNative').default.isChildPublicInstance(
-    parentInstance,
-    childInstance,
-  );
-}
+export const getNodeFromInternalInstanceHandle: ReactFabricType['getNodeFromInternalInstanceHandle'] =
+  getFabricMethod('getNodeFromInternalInstanceHandle');
 
-export function getNodeFromInternalInstanceHandle(
-  internalInstanceHandle: InternalInstanceHandle,
-): ?Node {
-  // This is only available in Fabric
-  return require('../Renderer/shims/ReactFabric').default.getNodeFromInternalInstanceHandle(
-    internalInstanceHandle,
-  );
-}
+export const getPublicInstanceFromInternalInstanceHandle: ReactFabricType['getPublicInstanceFromInternalInstanceHandle'] =
+  getFabricMethod('getPublicInstanceFromInternalInstanceHandle');
 
-export function getPublicInstanceFromInternalInstanceHandle(
-  internalInstanceHandle: InternalInstanceHandle,
-): mixed /*PublicInstance | PublicTextInstance | null*/ {
-  // This is only available in Fabric
-  return require('../Renderer/shims/ReactFabric').default.getPublicInstanceFromInternalInstanceHandle(
-    internalInstanceHandle,
-  );
-}
+export const getPublicInstanceFromRootTag: ReactFabricType['getPublicInstanceFromRootTag'] =
+  getFabricMethod('getPublicInstanceFromRootTag');
 
-export function getPublicInstanceFromRootTag(
-  rootTag: number,
-): mixed /*PublicRootInstance | null*/ {
-  // This is only available in Fabric
-  return require('../Renderer/shims/ReactFabric').default.getPublicInstanceFromRootTag(
-    rootTag,
-  );
+export function isProfilingRenderer(): boolean {
+  return Boolean(__DEV__);
 }

package/Libraries/ReactNative/UIManager.js

@@ -45,7 +45,7 @@ const UIManager: UIManagerJSInterface = {
         FabricUIManager.measure(shadowNode, callback);
       } else {
         console.warn(`measure cannot find view with tag #${reactTag}`);
-        // $FlowFixMe[incompatible-call]
+        // $FlowFixMe[incompatible-type]
         callback();
       }
     } else {
@@ -71,7 +71,7 @@ const UIManager: UIManagerJSInterface = {
         FabricUIManager.measureInWindow(shadowNode, callback);
       } else {
         console.warn(`measure cannot find view with tag #${reactTag}`);
-        // $FlowFixMe[incompatible-call]
+        // $FlowFixMe[incompatible-type]
         callback();
       }
     } else {
@@ -182,7 +182,7 @@ const UIManager: UIManagerJSInterface = {
       UIManagerImpl.dispatchViewManagerCommand(
         reactTag,
         // We have some legacy components that are actually already using strings. ¯\_(ツ)_/¯
-        // $FlowFixMe[incompatible-call]
+        // $FlowFixMe[incompatible-type]
         commandName,
         commandArgs,
       );

package/Libraries/ReactNative/renderApplication.js

@@ -76,6 +76,7 @@ export default function renderApplication<Props: Object>(
   if (useOffscreen && displayMode != null) {
     // $FlowFixMe[incompatible-type]
     // $FlowFixMe[prop-missing]
+    // $FlowFixMe[missing-export]
     const Activity: ActivityType = React.unstable_Activity;
 
     renderable = (

package/Libraries/ReactPrivate/ReactNativePrivateInterface.js

@@ -86,7 +86,7 @@ module.exports = {
   // TODO: Remove when React has migrated to `createAttributePayload` and `diffAttributePayloads`
   get flattenStyle(): flattenStyle<DangerouslyImpreciseStyleProp> {
     // $FlowFixMe[underconstrained-implicit-instantiation]
-    // $FlowFixMe[incompatible-return]
+    // $FlowFixMe[incompatible-type]
     return require('../StyleSheet/flattenStyle').default;
   },
   get ReactFiberErrorDialog(): ReactFiberErrorDialog {