attach() — react Function Reference

Source Code

packages/react-devtools-shared/src/backend/legacy/renderer.js lines 136–599

export function attach(
  hook: DevToolsHook,
  rendererID: number,
  renderer: LegacyRenderer,
  global: Object,
): RendererInterface {
  const idToInternalInstanceMap: Map<number, InternalInstance> = new Map();
  const internalInstanceToIDMap: WeakMap<InternalInstance, number> =
    new WeakMap();
  const internalInstanceToRootIDMap: WeakMap<InternalInstance, number> =
    new WeakMap();

  let getElementIDForHostInstance: GetElementIDForHostInstance =
    ((null: any): GetElementIDForHostInstance);
  let findHostInstanceForInternalID: (id: number) => ?HostInstance;
  let getNearestMountedDOMNode = (node: Element): null | Element => {
    // Not implemented.
    return null;
  };

  if (renderer.ComponentTree) {
    getElementIDForHostInstance = node => {
      const internalInstance =
        renderer.ComponentTree.getClosestInstanceFromNode(node);
      return internalInstanceToIDMap.get(internalInstance) || null;
    };
    findHostInstanceForInternalID = (id: number) => {
      const internalInstance = idToInternalInstanceMap.get(id);
      return renderer.ComponentTree.getNodeFromInstance(internalInstance);
    };
    getNearestMountedDOMNode = (node: Element): null | Element => {
      const internalInstance =
        renderer.ComponentTree.getClosestInstanceFromNode(node);
      if (internalInstance != null) {
        return renderer.ComponentTree.getNodeFromInstance(internalInstance);
      }
      return null;
    };
  } else if (renderer.Mount.getID && renderer.Mount.getNode) {
    getElementIDForHostInstance = node => {
      // Not implemented.
      return null;
    };
    findHostInstanceForInternalID = (id: number) => {
      // Not implemented.
      return null;
    };
  }

  const supportsTogglingSuspense = false;

  function getDisplayNameForElementID(id: number): string | null {
    const internalInstance = idToInternalInstanceMap.get(id);
    return internalInstance ? getData(internalInstance).displayName : null;
  }

  function getID(internalInstance: InternalInstance): number {
    if (typeof internalInstance !== 'object' || internalInstance === null) {
      throw new Error('Invalid internal instance: ' + internalInstance);
    }
    if (!internalInstanceToIDMap.has(internalInstance)) {
      const id = getUID();
      internalInstanceToIDMap.set(internalInstance, id);
      idToInternalInstanceMap.set(id, internalInstance);
    }
    return ((internalInstanceToIDMap.get(internalInstance): any): number);
  }

  function areEqualArrays(a: Array<any>, b: Array<any>) {
    if (a.length !== b.length) {
      return false;
    }
    for (let i = 0; i < a.length; i++) {
      if (a[i] !== b[i]) {
        return false;
      }
    }
    return true;
  }

  // This is shared mutable state that lets us keep track of where we are.