From 602b56754179f5b3a80f96d0b68709fa4b7ab2a3 Mon Sep 17 00:00:00 2001 From: Sathya Gunsasekaran Date: Fri, 12 Apr 2024 15:25:40 +0100 Subject: [PATCH] [Devtools] Look for a ReactMemoCacheSentinel on state The polyfill doesn't have access to the fiber, and it simply uses state, which makes it not work with the devtools. With this PR, devtools will look for this special sentinel on very first hook's state for this sentinel and display the Forget badge if present. The poylfill will add this sentinel to it's state (the cache array). --- packages/react-devtools-shared/src/backend/renderer.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/packages/react-devtools-shared/src/backend/renderer.js b/packages/react-devtools-shared/src/backend/renderer.js index 1d1bcb15eb39b..5d8e62ba91a9f 100644 --- a/packages/react-devtools-shared/src/backend/renderer.js +++ b/packages/react-devtools-shared/src/backend/renderer.js @@ -86,6 +86,7 @@ import { STRICT_MODE_SYMBOL_STRING, PROFILER_NUMBER, PROFILER_SYMBOL_STRING, + REACT_MEMO_CACHE_SENTINEL, SCOPE_NUMBER, SCOPE_SYMBOL_STRING, FORWARD_REF_NUMBER, @@ -475,7 +476,11 @@ export function getInternalReactConstants(version: string): { let resolvedContext: any = null; // $FlowFixMe[incompatible-type] fiber.updateQueue is mixed - if (!shouldSkipForgetCheck && fiber.updateQueue?.memoCache != null) { + if ( + !shouldSkipForgetCheck && + (fiber.updateQueue?.memoCache != null || + fiber.memoizedState?.memoizedState?.[REACT_MEMO_CACHE_SENTINEL]) + ) { const displayNameWithoutForgetWrapper = getDisplayNameForFiber( fiber, true,