diff --git a/packages/react-reconciler/src/ReactFiberComponentStack.js b/packages/react-reconciler/src/ReactFiberComponentStack.js index 5fbe1014b957..5867d4e9be6b 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 aa2774085dc1..24788e0e8724 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(); + ReactNoop.render( +
+ +
, + ); expect(Scheduler).toFlushWithoutYielding(); // Mount expect(() => { - ReactNoop.render(); + ReactNoop.render( +
+ +
, + ); 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( - , +
+ +
, ); expect(Scheduler).toFlushWithoutYielding(); }).toErrorDev([ diff --git a/packages/shared/ReactComponentStackFrame.js b/packages/shared/ReactComponentStackFrame.js index 956efa32f9bc..76043711fbeb 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,