From cbab25bb5159e82f0d74b0d2ad84d7ad7dd3613a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sebastian=20Markb=C3=A5ge?= <sema@fb.com>
Date: Thu, 9 Apr 2020 11:42:22 -0700
Subject: [PATCH] Exclude forwardRef and memo from stack frames (#18559)

We can't patch the row. We could give these their own "built-in" stack
frame since they're conceptually HoCs. However, from a debugging
perspective this is not very useful meta data and quite noisy. So I'm
just going to exclude them.
---
 .../src/ReactFiberComponentStack.js              |  3 ---
 .../src/__tests__/ReactMemo-test.js              | 16 +++++++++++++---
 packages/shared/ReactComponentStackFrame.js      |  4 +++-
 3 files changed, 16 insertions(+), 7 deletions(-)

diff --git a/packages/react-reconciler/src/ReactFiberComponentStack.js b/packages/react-reconciler/src/ReactFiberComponentStack.js
index 5fbe1014b9579..5867d4e9be6b9 100644
--- a/packages/react-reconciler/src/ReactFiberComponentStack.js
+++ b/packages/react-reconciler/src/ReactFiberComponentStack.js
@@ -17,7 +17,6 @@ import {
   FunctionComponent,
   IndeterminateComponent,
   ForwardRef,
-  MemoComponent,
   SimpleMemoComponent,
   Block,
   ClassComponent,
@@ -50,8 +49,6 @@ function describeFiber(fiber: Fiber): string {
       return describeFunctionComponentFrame(fiber.type, source, owner);
     case ForwardRef:
       return describeFunctionComponentFrame(fiber.type.render, source, owner);
-    case MemoComponent:
-      return describeFunctionComponentFrame(fiber.type.type, source, owner);
     case Block:
       return describeFunctionComponentFrame(fiber.type._render, source, owner);
     case ClassComponent:
diff --git a/packages/react-reconciler/src/__tests__/ReactMemo-test.js b/packages/react-reconciler/src/__tests__/ReactMemo-test.js
index aa2774085dc1c..24788e0e87249 100644
--- a/packages/react-reconciler/src/__tests__/ReactMemo-test.js
+++ b/packages/react-reconciler/src/__tests__/ReactMemo-test.js
@@ -392,12 +392,20 @@ describe('memo', () => {
         Outer.defaultProps = {outer: 0};
 
         // No warning expected because defaultProps satisfy both.
-        ReactNoop.render(<Outer />);
+        ReactNoop.render(
+          <div>
+            <Outer />
+          </div>,
+        );
         expect(Scheduler).toFlushWithoutYielding();
 
         // Mount
         expect(() => {
-          ReactNoop.render(<Outer inner="2" middle="3" outer="4" />);
+          ReactNoop.render(
+            <div>
+              <Outer inner="2" middle="3" outer="4" />
+            </div>,
+          );
           expect(Scheduler).toFlushWithoutYielding();
         }).toErrorDev([
           'Invalid prop `outer` of type `string` supplied to `Inner`, expected `number`.',
@@ -408,7 +416,9 @@ describe('memo', () => {
         // Update
         expect(() => {
           ReactNoop.render(
-            <Outer inner={false} middle={false} outer={false} />,
+            <div>
+              <Outer inner={false} middle={false} outer={false} />
+            </div>,
           );
           expect(Scheduler).toFlushWithoutYielding();
         }).toErrorDev([
diff --git a/packages/shared/ReactComponentStackFrame.js b/packages/shared/ReactComponentStackFrame.js
index 956efa32f9bc5..76043711fbeb6 100644
--- a/packages/shared/ReactComponentStackFrame.js
+++ b/packages/shared/ReactComponentStackFrame.js
@@ -121,7 +121,8 @@ export function describeUnknownElementTypeFrameInDEV(
       case REACT_FORWARD_REF_TYPE:
         return describeFunctionComponentFrame(type.render, source, ownerFn);
       case REACT_MEMO_TYPE:
-        return describeFunctionComponentFrame(type.type, source, ownerFn);
+        // Memo may contain any component type so we recursively resolve it.
+        return describeUnknownElementTypeFrameInDEV(type.type, source, ownerFn);
       case REACT_BLOCK_TYPE:
         return describeFunctionComponentFrame(type._render, source, ownerFn);
       case REACT_LAZY_TYPE: {
@@ -129,6 +130,7 @@ export function describeUnknownElementTypeFrameInDEV(
         const payload = lazyComponent._payload;
         const init = lazyComponent._init;
         try {
+          // Lazy may contain any component type so we recursively resolve it.
           return describeUnknownElementTypeFrameInDEV(
             init(payload),
             source,