Merged master

src/backend/agent.js

@@ -141,7 +141,7 @@ export default class Agent extends EventEmitter {
         const renderer = ((this._rendererInterfaces[
           (rendererID: any)
         ]: any): RendererInterface);
-        return renderer.getInternalIDFromNative(node, true);
+        return renderer.getFiberIDForNative(node, true);
       } catch (e) {}
     }
     return null;
@@ -186,7 +186,9 @@ export default class Agent extends EventEmitter {
 
     let nodes: ?Array<HTMLElement> = null;
     if (renderer !== null) {
-      nodes = ((renderer.getNativeFromInternal(id): any): ?Array<HTMLElement>);
+      nodes = ((renderer.findNativeNodesForFiberID(
+        id
+      ): any): ?Array<HTMLElement>);
     }
 
     if (nodes != null && nodes[0] != null) {

src/backend/legacy/renderer.js

@@ -25,8 +25,7 @@ import {
 
 import type {
   DevToolsHook,
-  GetInternalIDFromNative,
-  GetNativeFromInternal,
+  GetFiberIDForNative,
   NativeType,
   PathFrame,
   PathMatch,
@@ -87,38 +86,36 @@ export function attach(
     return null;
   }
 
-  let getInternalIDFromNative: GetInternalIDFromNative = ((null: any): GetInternalIDFromNative);
-  let getNativeFromInternal: (
-    id: number
-  ) => ?NativeType = ((null: any): GetNativeFromInternal);
+  let getInternalIDForNative: GetFiberIDForNative = ((null: any): GetFiberIDForNative);
+  let findNativeNodeForInternalID: (id: number) => ?NativeType;
 
   // React Native
   if (renderer.Mount.findNodeHandle && renderer.Mount.nativeTagToRootNodeID) {
-    getInternalIDFromNative = (nativeTag, findNearestUnfilteredAncestor) => {
+    getInternalIDForNative = (nativeTag, findNearestUnfilteredAncestor) => {
       const internalInstance = renderer.Mount.nativeTagToRootNodeID(nativeTag);
       return findNearestAncestorInTree(internalInstance);
     };
-    getNativeFromInternal = (id: number) => {
+    findNativeNodeForInternalID = (id: number) => {
       const internalInstance = idToInternalInstanceMap.get(id);
       return renderer.Mount.findNodeHandle(internalInstance);
     };
 
     // React DOM 15+
   } else if (renderer.ComponentTree) {
-    getInternalIDFromNative = (node, findNearestUnfilteredAncestor) => {
+    getInternalIDForNative = (node, findNearestUnfilteredAncestor) => {
       const internalInstance = renderer.ComponentTree.getClosestInstanceFromNode(
         node
       );
       return findNearestAncestorInTree(internalInstance);
     };
-    getNativeFromInternal = (id: number) => {
+    findNativeNodeForInternalID = (id: number) => {
       const internalInstance = idToInternalInstanceMap.get(id);
       return renderer.ComponentTree.getNodeFromInstance(internalInstance);
     };
 
     // React DOM
   } else if (renderer.Mount.getID && renderer.Mount.getNode) {
-    getInternalIDFromNative = (node, findNearestUnfilteredAncestor) => {
+    getInternalIDForNative = (node, findNearestUnfilteredAncestor) => {
       let id = renderer.Mount.getID(node);
       while (node && node.parentNode && !id) {
         node = node.parentNode;
@@ -127,7 +124,7 @@ export function attach(
       return id;
     };
 
-    getNativeFromInternal = (id: number) => {
+    findNativeNodeForInternalID = (id: number) => {
       try {
         const internalInstance = idToInternalInstanceMap.get(id);
         if (internalInstance != null) {
@@ -580,7 +577,7 @@ export function attach(
     if (result.context !== null) {
       console.log('State:', result.context);
     }
-    const nativeNode = getNativeFromInternal(id);
+    const nativeNode = findNativeNodeForInternalID(id);
     if (nativeNode !== null) {
       console.log('Node:', nativeNode);
     }
@@ -807,8 +804,11 @@ export function attach(
     cleanup,
     flushInitialOperations,
     getBestMatchForTrackedPath,
-    getInternalIDFromNative,
-    getNativeFromInternal,
+    getFiberIDForNative: getInternalIDForNative,
+    findNativeNodesForFiberID: (id: number) => {
+      const nativeNode = findNativeNodeForInternalID(id);
+      return nativeNode == null ? null : [nativeNode];
+    },
     getOwnersList,
     getPathForElement,
     getProfilingData,

src/backend/renderer.js

@@ -724,7 +724,7 @@ export function attach(
 
     // Identify which renderer this update is coming from.
     // This enables roots to be mapped to renderers,
-    // Which in turn enables fiber properations, states, and hooks to be inspected.
+    // Which in turn enables fiber props, states, and hooks to be inspected.
     let i = 0;
     operations[i++] = rendererID;
     operations[i++] = currentRootID; // Use this ID in case the root was unmounted!
@@ -1435,7 +1435,7 @@ export function attach(
     return fibers;
   }
 
-  function getNativeFromInternal(id: number) {
+  function findNativeNodesForFiberID(id: number) {
     try {
       let fiber = findCurrentFiberUsingSlowPathById(id);
       if (fiber === null) {
@@ -1460,7 +1460,7 @@ export function attach(
     }
   }
 
-  function getInternalIDFromNative(
+  function getFiberIDForNative(
     hostInstance,
     findNearestUnfilteredAncestor = false
   ) {
@@ -1672,7 +1672,7 @@ export function attach(
       return;
     }
 
-    const { memoizedProps, stateNode, tag, type } = fiber;
+    const { elementType, memoizedProps, stateNode, tag, type } = fiber;
 
     switch (tag) {
       case ClassComponent:
@@ -1692,6 +1692,16 @@ export function attach(
           type: type.render,
         };
         break;
+      case MemoComponent:
+      case SimpleMemoComponent:
+        global.$r = {
+          props: memoizedProps,
+          type:
+            elementType != null && elementType.type != null
+              ? elementType.type
+              : type,
+        };
+        break;
       default:
         global.$r = null;
         break;
@@ -1705,19 +1715,20 @@ export function attach(
       return;
     }
 
-    switch (fiber.tag) {
+    const { elementType, tag, type } = fiber;
+
+    switch (tag) {
       case ClassComponent:
       case IncompleteClassComponent:
       case IndeterminateComponent:
       case FunctionComponent:
-        global.$type = fiber.type;
+        global.$type = type;
         break;
       case ForwardRef:
-        global.$type = fiber.type.render;
+        global.$type = type.render;
         break;
       case MemoComponent:
       case SimpleMemoComponent:
-        const { elementType, type } = fiber;
         global.$type =
           elementType != null && elementType.type != null
             ? elementType.type
@@ -1965,7 +1976,7 @@ export function attach(
     if (result.hooks !== null) {
       console.log('Hooks:', result.hooks);
     }
-    const nativeNodes = getNativeFromInternal(id);
+    const nativeNodes = findNativeNodesForFiberID(id);
     if (nativeNodes !== null) {
       console.log('Nodes:', nativeNodes);
     }
@@ -2455,8 +2466,8 @@ export function attach(
     cleanup,
     flushInitialOperations,
     getBestMatchForTrackedPath,
-    getInternalIDFromNative,
-    getNativeFromInternal,
+    getFiberIDForNative,
+    findNativeNodesForFiberID,
     getOwnersList,
     getPathForElement,
     getProfilingData,

src/backend/types.js

@@ -88,11 +88,11 @@ export type RendererID = number;
 
 type Dispatcher = any;
 
-export type GetInternalIDFromNative = (
+export type GetFiberIDForNative = (
   component: NativeType,
   findNearestUnfilteredAncestor?: boolean
 ) => number | null;
-export type GetNativeFromInternal = (id: number) => ?NativeType;
+export type FindNativeNodesForFiberID = (id: number) => ?Array<NativeType>;
 
 export type ReactRenderer = {
   findFiberByHostInstance: (hostInstance: NativeType) => ?Fiber,
@@ -164,10 +164,10 @@ export type PathMatch = {|
 
 export type RendererInterface = {
   cleanup: () => void,
+  findNativeNodesForFiberID: FindNativeNodesForFiberID,
   flushInitialOperations: () => void,
   getBestMatchForTrackedPath: () => PathMatch | null,
-  getInternalIDFromNative: GetInternalIDFromNative,
-  getNativeFromInternal: GetNativeFromInternal,
+  getFiberIDForNative: GetFiberIDForNative,
   getProfilingData(): ProfilingDataBackend,
   getOwnersList: (id: number) => Array<Owner> | null,
   getPathForElement: (id: number) => Array<PathFrame> | null,