Files
react/scripts/flow/react-native-host-hooks.js
Rubén Norte bb0944fe5b [RN] Use microtasks in the RN renderer based on a global flag defined by RN (#28472)
## Summary

We want to enable the new event loop in React Native
(https://github.com/react-native-community/discussions-and-proposals/pull/744)
for all users in the new architecture (determined by the use of
bridgeless, not by the use of Fabric). In order to leverage that, we
need to also set the flag for the React reconciler to use microtasks for
scheduling (so we'll execute them at the right time in the new event
loop).

This migrates from the previous approach using a dynamic flag (to be
used at Meta) with the check of a global set by React Native. The reason
for doing this is:
1) We still need to determine this dynamically in OSS (based on
Bridgeless, not on Fabric).
2) We still need the ability to configure the behavior at Meta, and for
internal build system reasons we cannot access the flag that enables
microtasks in
[`ReactNativeFeatureFlags`](6c28c87c4d/packages/react-native/src/private/featureflags/ReactNativeFeatureFlags.js (L121)).

## How did you test this change?

Manually synchronized the changes to React Native and ran all tests for
the new architecture on it. Also tested manually.

> [!NOTE]
> This change depends on
https://github.com/facebook/react-native/pull/43397 which has been
merged already
2024-03-13 10:00:10 +00:00

244 lines
7.4 KiB
JavaScript

/**
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @flow
*/
/* eslint-disable */
// libdefs cannot actually import. These are supposed to be the types imported
// from 'react-native-renderer/src/ReactNativeTypes'
type __MeasureOnSuccessCallback = any;
type __MeasureInWindowOnSuccessCallback = any;
type __MeasureLayoutOnSuccessCallback = any;
type __ReactNativeBaseComponentViewConfig = any;
type __ViewConfigGetter = any;
type __ViewConfig = any;
// libdefs cannot actually import. This is supposed to be the type imported
// from 'react-native-renderer/src/legacy-events/TopLevelEventTypes';
type __RNTopLevelEventType = any;
// libdefs cannot actually import. This is supposed to be the type imported
// from 'react-reconciler/src/ReactCapturedValue'
type __CapturedError = any;
type DeepDifferOptions = {+unsafelyIgnoreFunctions?: boolean};
type RawEventEmitterEvent = $ReadOnly<{
eventName: string,
// We expect, but do not/cannot require, that nativeEvent is an object
// with the properties: key, elementType (string), type (string), tag (numeric),
// and a stateNode of the native element/Fiber the event was emitted to.
nativeEvent: {[string]: mixed, ...},
}>;
declare module 'react-native/Libraries/ReactPrivate/ReactNativePrivateInterface' {
declare export function deepDiffer(
one: any,
two: any,
maxDepth?: number,
options?: DeepDifferOptions,
): boolean;
declare export function deepDiffer(
one: any,
two: any,
options: DeepDifferOptions,
): boolean;
declare export function deepFreezeAndThrowOnMutationInDev<T>(obj: T): T;
declare export function flattenStyle(style: any): any;
declare export var RCTEventEmitter: {
register: (eventEmitter: mixed) => void,
...
};
declare export var TextInputState: {
blurTextInput: (object: any) => void,
focusTextInput: (object: any) => void,
...
};
declare export var ReactFiberErrorDialog: {
showErrorDialog: (error: __CapturedError) => boolean,
...
};
declare export var Platform: {OS: string, ...};
declare export var UIManager: {
customBubblingEventTypes: Object,
customDirectEventTypes: Object,
createView: (
reactTag: number,
viewName: string,
rootTag: number,
props: ?Object,
) => void,
dispatchViewManagerCommand: (
reactTag: number,
command: string,
args: Array<any>,
) => void,
manageChildren: (
containerTag: number,
moveFromIndices: Array<number>,
moveToIndices: Array<number>,
addChildReactTags: Array<number>,
addAtIndices: Array<number>,
removeAtIndices: Array<number>,
) => void,
measure: (hostComponent: mixed, callback: Function) => void,
measureInWindow: (nativeTag: ?number, callback: Function) => void,
measureLayout: (
nativeTag: mixed,
nativeNode: number,
onFail: Function,
onSuccess: Function,
) => void,
removeRootView: (containerTag: number) => void,
removeSubviewsFromContainerWithID: (containerId: number) => void,
replaceExistingNonRootView: () => void,
setChildren: (containerTag: number, reactTags: Array<number>) => void,
updateView: (reactTag: number, viewName: string, props: ?Object) => void,
__takeSnapshot: (
view?: 'window' | Element<any> | number,
options?: {
width?: number,
height?: number,
format?: 'png' | 'jpeg',
quality?: number,
...
},
) => Promise<any>,
setJSResponder: (reactTag: number, blockNativeResponder: boolean) => void,
clearJSResponder: () => void,
findSubviewIn: (
reactTag: ?number,
point: Array<number>,
callback: (
nativeViewTag: number,
left: number,
top: number,
width: number,
height: number,
) => void,
) => void,
...
};
declare export var legacySendAccessibilityEvent: (
reactTag: number,
eventTypeName: string,
) => void;
declare export var BatchedBridge: {
registerCallableModule: (name: string, module: Object) => void,
...
};
declare export var ReactNativeViewConfigRegistry: {
customBubblingEventTypes: Object,
customDirectEventTypes: Object,
register: (name: string, callback: __ViewConfigGetter) => string,
get: (name: string) => __ReactNativeBaseComponentViewConfig,
...
};
declare export var RawEventEmitter: {
emit: (channel: string, event: RawEventEmitterEvent) => string,
...
};
declare export opaque type PublicInstance;
declare export opaque type PublicTextInstance;
declare export function getNodeFromPublicInstance(
publicInstance: PublicInstance,
): Object;
declare export function getNativeTagFromPublicInstance(
publicInstance: PublicInstance,
): number;
declare export function createPublicInstance(
tag: number,
viewConfig: __ViewConfig,
internalInstanceHandle: mixed,
): PublicInstance;
declare export function createPublicTextInstance(
internalInstanceHandle: mixed,
): PublicTextInstance;
declare export function getInternalInstanceHandleFromPublicInstance(
publicInstance: PublicInstance,
): ?Object;
}
declare module 'react-native/Libraries/ReactPrivate/ReactNativePrivateInitializeCore' {
}
declare const RN$enableMicrotasksInReact: boolean;
// This is needed for a short term solution.
// See https://github.com/facebook/react/pull/15490 for more info
declare var nativeFabricUIManager: {
createNode: (
reactTag: number,
viewName: string,
rootTag: number,
props: ?Object,
eventTarget: Object,
) => Object,
cloneNode: (node: Object) => Object,
cloneNodeWithNewChildren: (
node: Object,
children?: $ReadOnlyArray<Object>,
) => Object,
cloneNodeWithNewProps: (node: Object, newProps: ?Object) => Object,
cloneNodeWithNewChildrenAndProps: (
node: Object,
newPropsOrChildren: ?Object | $ReadOnlyArray<Object>,
newProps?: ?Object,
) => Object,
appendChild: (node: Object, childNode: Object) => void,
createChildSet: () => Object,
appendChildToSet: (childSet: Object, childNode: Object) => void,
completeRoot: (rootTag: number, childSet: Object) => void,
registerEventHandler: (
callback: (
eventTarget: null | Object,
type: __RNTopLevelEventType,
payload: Object,
) => void,
) => void,
setNativeProps: (node: Object, nativeProps: Object) => Object,
dispatchCommand: (node: Object, command: string, args: Array<any>) => void,
sendAccessibilityEvent: (node: Object, eventTypeName: string) => void,
measure: (node: Object, callback: __MeasureOnSuccessCallback) => void,
measureInWindow: (
node: Object,
callback: __MeasureInWindowOnSuccessCallback,
) => void,
measureLayout: (
node: Object,
relativeNode: Object,
onFail: () => void,
onSuccess: __MeasureLayoutOnSuccessCallback,
) => void,
getBoundingClientRect: (
node: Object,
) => [
/* x:*/ number,
/* y:*/ number,
/* width:*/ number,
/* height:*/ number,
],
findNodeAtPoint: (
node: Object,
locationX: number,
locationY: number,
callback: (Object) => void,
) => void,
setIsJSResponder: (
node: Object,
isJsResponder: boolean,
blockNativeResponder: boolean,
) => void,
unstable_DefaultEventPriority: number,
unstable_DiscreteEventPriority: number,
unstable_getCurrentEventPriority: () => number,
...
};