From e2ce64acb94968d8ca464f37fab2a7ed77848fa9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sebastian=20Markb=C3=A5ge?= <sebastian@calyptus.eu>
Date: Mon, 13 Oct 2025 12:11:52 -0400
Subject: [PATCH] [DevTools] Don't show the root as being non-compliant
 (#34827)

`isStrictModeNonCompliant` on the root just means that it supports
strict mode. It's inherited by other nodes.

It's not possible to opt-in to strict mode on the root itself but rather
right below it. So we should not mark the root as being non-compliant.

This lets you select the root in the suspense tab and it shouldn't show
as red with a warning.
---
 .../src/devtools/views/Components/InspectedElement.js         | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/react-devtools-shared/src/devtools/views/Components/InspectedElement.js b/packages/react-devtools-shared/src/devtools/views/Components/InspectedElement.js
index 88aeab7bfd..633a4d382e 100644
--- a/packages/react-devtools-shared/src/devtools/views/Components/InspectedElement.js
+++ b/packages/react-devtools-shared/src/devtools/views/Components/InspectedElement.js
@@ -194,7 +194,7 @@ export default function InspectedElementWrapper(_: Props): React.Node {
   }
 
   let strictModeBadge = null;
-  if (element.isStrictModeNonCompliant) {
+  if (element.isStrictModeNonCompliant && element.parentID !== 0) {
     strictModeBadge = (
       <Tooltip label="This component is not running in StrictMode. Click to learn more.">
         <a
@@ -237,7 +237,7 @@ export default function InspectedElementWrapper(_: Props): React.Node {
         <div className={styles.SelectedComponentName}>
           <div
             className={
-              element.isStrictModeNonCompliant
+              element.isStrictModeNonCompliant && element.parentID !== 0
                 ? `${styles.ComponentName} ${styles.StrictModeNonCompliantComponentName}`
                 : styles.ComponentName
             }