[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.
Sebastian Markbåge committed
Oct 13, 2025 at 12:11 UTC
e2ce64acb94968d8ca464f37fab2a7ed77848fa9
1 file changed
+2
-2
packages/react-devtools-shared/src/devtools/views/Components/InspectedElement.js
+2
-2
@@ -194,7 +194,7 @@ export default function InspectedElementWrapper(_: Props): React.Node {
194
}
195
196
let strictModeBadge = null;
197
- if (element.isStrictModeNonCompliant) {
197
+ if (element.isStrictModeNonCompliant && element.parentID !== 0) {
198
strictModeBadge = (
199
<Tooltip label="This component is not running in StrictMode. Click to learn more.">
200
<a
@@ -237,7 +237,7 @@ export default function InspectedElementWrapper(_: Props): React.Node {
237
<div className={styles.SelectedComponentName}>
238
<div
239
className={
240
- element.isStrictModeNonCompliant
240
+ element.isStrictModeNonCompliant && element.parentID !== 0
241
? `${styles.ComponentName} ${styles.StrictModeNonCompliantComponentName}`
242
: styles.ComponentName
243
}