From b9a045368bc1186fcaff6e8b027cfca28c857f04 Mon Sep 17 00:00:00 2001
From: "Sebastian \"Sebbie\" Silbermann" <sebastian.silbermann@vercel.com>
Date: Thu, 4 Sep 2025 16:42:25 +0200
Subject: [PATCH] [DevTools] Allow inspecting root when navigating Suspense
 timeline (#34380)

---
 .../src/devtools/views/SuspenseTab/SuspenseTimeline.js   | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/packages/react-devtools-shared/src/devtools/views/SuspenseTab/SuspenseTimeline.js b/packages/react-devtools-shared/src/devtools/views/SuspenseTab/SuspenseTimeline.js
index 59666f624e..cbc4dab09d 100644
--- a/packages/react-devtools-shared/src/devtools/views/SuspenseTab/SuspenseTimeline.js
+++ b/packages/react-devtools-shared/src/devtools/views/SuspenseTab/SuspenseTimeline.js
@@ -45,10 +45,9 @@ function getSuspendableDocumentOrderSuspense(
       if (current === undefined) {
         continue;
       }
-      // Don't include the root. It's currently not supported to suspend the shell.
-      if (current !== suspense) {
-        suspenseTreeList.push(current);
-      }
+      // Include the root even if we won't suspend it.
+      // You should be able to see what suspended the shell.
+      suspenseTreeList.push(current);
       // Add children in reverse order to maintain document order
       for (let j = current.children.length - 1; j >= 0; j--) {
         const childSuspense = store.getSuspenseByID(current.children[j]);
@@ -139,7 +138,7 @@ function SuspenseTimelineInput({rootID}: {rootID: Element['id'] | void}) {
 
     const pendingValue = +event.currentTarget.value;
     const suspendedSet = timeline
-      .slice(pendingValue + 1)
+      .slice(pendingValue)
       .map(suspense => suspense.id);
 
     bridge.send('overrideSuspenseMilestone', {