From e2cc315a1bec95477a4e7aff74bdb5151b935f75 Mon Sep 17 00:00:00 2001
From: "Sebastian \"Sebbie\" Silbermann" <sebastian.silbermann@vercel.com>
Date: Thu, 4 Sep 2025 16:39:07 +0200
Subject: [PATCH 1/2] [DevTools] Don't suspend shell while retrieving original
 source for "open-in-editor" (#34381)

---
 .../views/Components/OpenInEditorButton.js        | 15 ++++++++++++++-
 1 file changed, 14 insertions(+), 1 deletion(-)

diff --git a/packages/react-devtools-shared/src/devtools/views/Components/OpenInEditorButton.js b/packages/react-devtools-shared/src/devtools/views/Components/OpenInEditorButton.js
index 2ca44a623b8..b739a060281 100644
--- a/packages/react-devtools-shared/src/devtools/views/Components/OpenInEditorButton.js
+++ b/packages/react-devtools-shared/src/devtools/views/Components/OpenInEditorButton.js
@@ -23,7 +23,7 @@ type Props = {
   symbolicatedSourcePromise: Promise<SourceMappedLocation | null>,
 };
 
-function OpenInEditorButton({
+function OpenSymbolicatedSourceInEditorButton({
   editorURL,
   source,
   symbolicatedSourcePromise,
@@ -45,4 +45,17 @@ function OpenInEditorButton({
   );
 }
 
+function OpenInEditorButton(props: Props): React.Node {
+  return (
+    <React.Suspense
+      fallback={
+        <Button disabled={true} title="retrieving original source…">
+          <ButtonIcon type="editor" />
+        </Button>
+      }>
+      <OpenSymbolicatedSourceInEditorButton {...props} />
+    </React.Suspense>
+  );
+}
+
 export default OpenInEditorButton;

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 2/2] [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 59666f624ed..cbc4dab09d2 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', {