From 5adda9c56fcfe8fa3a7b3f9be9833709acde16c5 Mon Sep 17 00:00:00 2001
From: Sebastian Markbage <sebastian@calyptus.eu>
Date: Sun, 26 May 2024 17:39:33 -0400
Subject: [PATCH] Don't append Component Stack in React DevTools if we already
 have a native task

If the current Fiber already has a native task, then it might be in a native async task and so we already have a component stack.

If it doesn't have a native task, it's because this is not DEV mode or it's an older React or React didn't detect console.createTask.
---
 .../src/backend/DevToolsFiberComponentStack.js         |  7 +++++++
 packages/react-devtools-shared/src/backend/console.js  | 10 ++++++++--
 2 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/packages/react-devtools-shared/src/backend/DevToolsFiberComponentStack.js b/packages/react-devtools-shared/src/backend/DevToolsFiberComponentStack.js
index 6d99cf4f21e52..a4311797de36c 100644
--- a/packages/react-devtools-shared/src/backend/DevToolsFiberComponentStack.js
+++ b/packages/react-devtools-shared/src/backend/DevToolsFiberComponentStack.js
@@ -98,3 +98,10 @@ export function getStackByFiberInDevAndProd(
     return '\nError generating stack: ' + x.message + '\n' + x.stack;
   }
 }
+
+export function supportsNativeConsoleTasks(fiber: Fiber): boolean {
+  // If this Fiber supports native console.createTask then we are already running
+  // inside a native async stack trace if it's active - meaning the DevTools is open.
+  // Ideally we'd detect if this task was created while the DevTools was open or not.
+  return !!fiber._debugTask;
+}
diff --git a/packages/react-devtools-shared/src/backend/console.js b/packages/react-devtools-shared/src/backend/console.js
index 40649abe9ee46..13c2249013a3e 100644
--- a/packages/react-devtools-shared/src/backend/console.js
+++ b/packages/react-devtools-shared/src/backend/console.js
@@ -18,7 +18,10 @@ import type {
 import {format, formatWithStyles} from './utils';
 
 import {getInternalReactConstants, getDispatcherRef} from './renderer';
-import {getStackByFiberInDevAndProd} from './DevToolsFiberComponentStack';
+import {
+  getStackByFiberInDevAndProd,
+  supportsNativeConsoleTasks,
+} from './DevToolsFiberComponentStack';
 import {consoleManagedByDevToolsDuringStrictMode} from 'react-devtools-feature-flags';
 import {castBool, castBrowserTheme} from '../utils';
 
@@ -235,7 +238,10 @@ export function patch({
                   }
                 }
 
-                if (shouldAppendWarningStack) {
+                if (
+                  shouldAppendWarningStack &&
+                  !supportsNativeConsoleTasks(current)
+                ) {
                   const componentStack = getStackByFiberInDevAndProd(
                     workTagMap,
                     current,