Fix parsing for minified prod bundles

facebook · Apr 3, 2024 · 43ed39e · 43ed39e
1 parent a8c4804
commit 43ed39e
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 3 deletions.
diff --git a/packages/react-debug-tools/src/ReactDebugHooks.js b/packages/react-debug-tools/src/ReactDebugHooks.js
@@ -962,7 +962,15 @@ function parseHookName(functionName: void | string): string {
   if (!functionName) {
     return '';
   }
-  let startIndex = functionName.lastIndexOf('.');
+  let startIndex = functionName.lastIndexOf('[as ');
+
+  if (startIndex !== -1) {
+    // Workaround for sourcemaps in Jest and Chrome.
+    // In `node --enable-source-maps`, we don't see "Object.useHostTransitionStatus [as useFormStatus]" but "Object.useFormStatus"
+    // "Object.useHostTransitionStatus [as useFormStatus]" -> "useFormStatus"
+    return parseHookName(functionName.slice(startIndex + '[as '.length, -1));
+  }
+  startIndex = functionName.lastIndexOf('.');
   if (startIndex === -1) {
     startIndex = 0;
   } else {

diff --git a/packages/react-debug-tools/src/__tests__/ReactHooksInspectionIntegrationDOM-test.js b/packages/react-debug-tools/src/__tests__/ReactHooksInspectionIntegrationDOM-test.js
@@ -38,8 +38,6 @@ describe('ReactHooksInspectionIntegration', () => {
     ReactDebugTools = require('react-debug-tools');
   });
 
-  // Gating production, non-source builds only for Jest.
-  // @gate source || build === "development"
   it('should support useFormStatus hook', async () => {
     function FormStatus() {
       const status = ReactDOM.useFormStatus();