Move methods to access internals of DOM nodes to a separate module (#48854)

Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/48854

Changelog: [internal]

Moves the internals to access instance handle and shadow node from public instances from `ReadOnlyNode` to `NodeInternals` so it's more obvious when people are reaching into internal APIs/state.

Reviewed By: javache

Differential Revision: D67654404

fbshipit-source-id: 1063bc9451eeacb79af34614df3be02466f93fa3

packages/react-native-fantom/src/index.js

@@ -15,13 +15,13 @@ import type {
 import type {MixedElement} from 'react';
 
 import ReactNativeElement from '../../react-native/src/private/webapis/dom/nodes/ReadOnlyNode';
-import {getShadowNode} from '../../react-native/src/private/webapis/dom/nodes/ReadOnlyNode';
 import * as Benchmark from './Benchmark';
 import getFantomRenderedOutput from './getFantomRenderedOutput';
 import ReactFabric from 'react-native/Libraries/Renderer/shims/ReactFabric';
 import NativeFantom, {
   NativeEventCategory,
 } from 'react-native/src/private/specs/modules/NativeFantom';
+import {getShadowNode} from 'react-native/src/private/webapis/dom/nodes/internals/NodeInternals';
 
 let globalSurfaceIdCounter = 1;
 

packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap

@@ -11382,20 +11382,9 @@ exports[`public API should not change unintentionally src/private/webapis/dom/no
   static DOCUMENT_POSITION_CONTAINED_BY: number;
   static DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC: number;
 }
-declare export function getInstanceHandle(
-  node: ReadOnlyNode
-): InternalInstanceHandle;
-declare export function setInstanceHandle(
-  node: ReadOnlyNode,
-  instanceHandle: InternalInstanceHandle
-): void;
-declare export function getShadowNode(node: ReadOnlyNode): ?ShadowNode;
 declare export function getChildNodes(
   node: ReadOnlyNode
 ): $ReadOnlyArray<ReadOnlyNode>;
-declare export function getPublicInstanceFromInternalInstanceHandle(
-  instanceHandle: InternalInstanceHandle
-): ?ReadOnlyNode;
 "
 `;
 

packages/react-native/src/private/webapis/dom/nodes/ReactNativeElement.js

@@ -24,12 +24,13 @@ import TextInputState from '../../../../../Libraries/Components/TextInput/TextIn
 import {getFabricUIManager} from '../../../../../Libraries/ReactNative/FabricUIManager';
 import {create as createAttributePayload} from '../../../../../Libraries/ReactNative/ReactFabricPublicInstance/ReactNativeAttributePayload';
 import warnForStyleProps from '../../../../../Libraries/ReactNative/ReactFabricPublicInstance/warnForStyleProps';
-import ReadOnlyElement, {getBoundingClientRect} from './ReadOnlyElement';
-import ReadOnlyNode, {setInstanceHandle} from './ReadOnlyNode';
 import {
   getPublicInstanceFromInternalInstanceHandle,
   getShadowNode,
-} from './ReadOnlyNode';
+  setInstanceHandle,
+} from './internals/NodeInternals';
+import ReadOnlyElement, {getBoundingClientRect} from './ReadOnlyElement';
+import ReadOnlyNode from './ReadOnlyNode';
 import NativeDOM from './specs/NativeDOM';
 import nullthrows from 'nullthrows';
 

packages/react-native/src/private/webapis/dom/nodes/ReadOnlyCharacterData.js

@@ -12,9 +12,10 @@
 
 import type ReadOnlyElement from './ReadOnlyElement';
 
-import ReadOnlyNode, {getShadowNode} from './ReadOnlyNode';
+import {getShadowNode} from './internals/NodeInternals';
+import {getElementSibling} from './internals/Traversal';
+import ReadOnlyNode from './ReadOnlyNode';
 import NativeDOM from './specs/NativeDOM';
-import {getElementSibling} from './utilities/Traversal';
 
 export default class ReadOnlyCharacterData extends ReadOnlyNode {
   get nextElementSibling(): ReadOnlyElement | null {

packages/react-native/src/private/webapis/dom/nodes/ReadOnlyElement.js

@@ -14,13 +14,10 @@ import type HTMLCollection from '../oldstylecollections/HTMLCollection';
 
 import DOMRect from '../geometry/DOMRect';
 import {createHTMLCollection} from '../oldstylecollections/HTMLCollection';
-import ReadOnlyNode, {
-  getChildNodes,
-  getInstanceHandle,
-  getShadowNode,
-} from './ReadOnlyNode';
+import {getInstanceHandle, getShadowNode} from './internals/NodeInternals';
+import {getElementSibling} from './internals/Traversal';
+import ReadOnlyNode, {getChildNodes} from './ReadOnlyNode';
 import NativeDOM from './specs/NativeDOM';
-import {getElementSibling} from './utilities/Traversal';
 
 export default class ReadOnlyElement extends ReadOnlyNode {
   get childElementCount(): number {

packages/react-native/src/private/webapis/dom/nodes/ReadOnlyNode.js

@@ -10,14 +10,16 @@
 
 // flowlint unsafe-getters-setters:off
 
-import type {
-  InternalInstanceHandle,
-  Node as ShadowNode,
-} from '../../../../../Libraries/Renderer/shims/ReactNativeTypes';
+import type {InternalInstanceHandle} from '../../../../../Libraries/Renderer/shims/ReactNativeTypes';
 import type NodeList from '../oldstylecollections/NodeList';
 import type ReadOnlyElement from './ReadOnlyElement';
 
 import {createNodeList} from '../oldstylecollections/NodeList';
+import {
+  getPublicInstanceFromInternalInstanceHandle,
+  getShadowNode,
+  setInstanceHandle,
+} from './internals/NodeInternals';
 import NativeDOM from './specs/NativeDOM';
 
 // We initialize this lazily to avoid a require cycle
@@ -288,37 +290,6 @@ export default class ReadOnlyNode {
   static DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC: number = 32;
 }
 
-const INSTANCE_HANDLE_KEY = Symbol('internalInstanceHandle');
-
-export function getInstanceHandle(node: ReadOnlyNode): InternalInstanceHandle {
-  // $FlowExpectedError[prop-missing]
-  return node[INSTANCE_HANDLE_KEY];
-}
-
-export function setInstanceHandle(
-  node: ReadOnlyNode,
-  instanceHandle: InternalInstanceHandle,
-): void {
-  // $FlowExpectedError[prop-missing]
-  node[INSTANCE_HANDLE_KEY] = instanceHandle;
-}
-
-let RendererProxy;
-function getRendererProxy() {
-  if (RendererProxy == null) {
-    // Lazy import Fabric here to avoid DOM Node APIs classes from having side-effects.
-    // With a static import we can't use these classes for Paper-only variants.
-    RendererProxy = require('../../../../../Libraries/ReactNative/RendererProxy');
-  }
-  return RendererProxy;
-}
-
-export function getShadowNode(node: ReadOnlyNode): ?ShadowNode {
-  return getRendererProxy().getNodeFromInternalInstanceHandle(
-    getInstanceHandle(node),
-  );
-}
-
 export function getChildNodes(
   node: ReadOnlyNode,
 ): $ReadOnlyArray<ReadOnlyNode> {
@@ -354,14 +325,3 @@ function getNodeSiblingsAndPosition(
 
   return [siblings, position];
 }
-
-export function getPublicInstanceFromInternalInstanceHandle(
-  instanceHandle: InternalInstanceHandle,
-): ?ReadOnlyNode {
-  const mixedPublicInstance =
-    getRendererProxy().getPublicInstanceFromInternalInstanceHandle(
-      instanceHandle,
-    );
-  // $FlowExpectedError[incompatible-return] React defines public instances as "mixed" because it can't access the definition from React Native.
-  return mixedPublicInstance;
-}

packages/react-native/src/private/webapis/dom/nodes/internals/NodeInternals.js

@@ -0,0 +1,57 @@
+/**
+ * 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.
+ *
+ * @format
+ * @flow strict-local
+ */
+
+import type {
+  InternalInstanceHandle,
+  Node as ShadowNode,
+} from '../../../../../../Libraries/Renderer/shims/ReactNativeTypes';
+import type ReadOnlyNode from '../ReadOnlyNode';
+
+let RendererProxy;
+function getRendererProxy() {
+  if (RendererProxy == null) {
+    // Lazy import Fabric here to avoid DOM Node APIs classes from having side-effects.
+    // With a static import we can't use these classes for Paper-only variants.
+    RendererProxy = require('../../../../../../Libraries/ReactNative/RendererProxy');
+  }
+  return RendererProxy;
+}
+
+const INSTANCE_HANDLE_KEY = Symbol('internalInstanceHandle');
+
+export function getInstanceHandle(node: ReadOnlyNode): InternalInstanceHandle {
+  // $FlowExpectedError[prop-missing]
+  return node[INSTANCE_HANDLE_KEY];
+}
+
+export function setInstanceHandle(
+  node: ReadOnlyNode,
+  instanceHandle: InternalInstanceHandle,
+): void {
+  // $FlowExpectedError[prop-missing]
+  node[INSTANCE_HANDLE_KEY] = instanceHandle;
+}
+
+export function getShadowNode(node: ReadOnlyNode): ?ShadowNode {
+  return getRendererProxy().getNodeFromInternalInstanceHandle(
+    getInstanceHandle(node),
+  );
+}
+
+export function getPublicInstanceFromInternalInstanceHandle(
+  instanceHandle: InternalInstanceHandle,
+): ?ReadOnlyNode {
+  const mixedPublicInstance =
+    getRendererProxy().getPublicInstanceFromInternalInstanceHandle(
+      instanceHandle,
+    );
+  // $FlowExpectedError[incompatible-return] React defines public instances as "mixed" because it can't access the definition from React Native.
+  return mixedPublicInstance;
+}

packages/react-native/src/private/webapis/intersectionobserver/internals/IntersectionObserverManager.js

@@ -26,7 +26,10 @@ import type IntersectionObserverEntry from '../IntersectionObserverEntry';
 
 import * as Systrace from '../../../../../Libraries/Performance/Systrace';
 import warnOnce from '../../../../../Libraries/Utilities/warnOnce';
-import {getInstanceHandle, getShadowNode} from '../../dom/nodes/ReadOnlyNode';
+import {
+  getInstanceHandle,
+  getShadowNode,
+} from '../../dom/nodes/internals/NodeInternals';
 import {createIntersectionObserverEntry} from '../IntersectionObserverEntry';
 import NativeIntersectionObserver from '../specs/NativeIntersectionObserver';
 

packages/react-native/src/private/webapis/mutationobserver/internals/MutationObserverManager.js

@@ -29,7 +29,7 @@ import warnOnce from '../../../../../Libraries/Utilities/warnOnce';
 import {
   getPublicInstanceFromInternalInstanceHandle,
   getShadowNode,
-} from '../../dom/nodes/ReadOnlyNode';
+} from '../../dom/nodes/internals/NodeInternals';
 import {createMutationRecord} from '../MutationRecord';
 import NativeMutationObserver from '../specs/NativeMutationObserver';