From 6570514f4d998abe45ceb2ec02dc36b7d2aeae29 Mon Sep 17 00:00:00 2001
From: Sebastian Markbage <sebastian@calyptus.eu>
Date: Thu, 16 Oct 2025 11:11:34 -0400
Subject: [PATCH] Adjust the size by one pixel

---
 .../src/devtools/views/SuspenseTab/SuspenseRects.js       | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/packages/react-devtools-shared/src/devtools/views/SuspenseTab/SuspenseRects.js b/packages/react-devtools-shared/src/devtools/views/SuspenseTab/SuspenseRects.js
index 5f07bb61001ee..c2a131916504c 100644
--- a/packages/react-devtools-shared/src/devtools/views/SuspenseTab/SuspenseRects.js
+++ b/packages/react-devtools-shared/src/devtools/views/SuspenseTab/SuspenseRects.js
@@ -36,12 +36,14 @@ function ScaledRect({
   rect,
   visible,
   suspended,
+  adjust,
   ...props
 }: {
   className: string,
   rect: Rect,
   visible: boolean,
   suspended: boolean,
+  adjust?: boolean,
   ...
 }): React$Node {
   const viewBox = useContext(ViewBox);
@@ -57,8 +59,9 @@ function ScaledRect({
       data-visible={visible}
       data-suspended={suspended}
       style={{
-        width,
-        height,
+        // Shrink one pixel so that the bottom outline will line up with the top outline of the next one.
+        width: adjust ? 'calc(' + width + ' - 1px)' : width,
+        height: adjust ? 'calc(' + height + ' - 1px)' : height,
         top: y,
         left: x,
       }}
@@ -160,6 +163,7 @@ function SuspenseRects({
                 className={styles.SuspenseRectsRect}
                 rect={rect}
                 data-highlighted={selected}
+                adjust={true}
                 onClick={handleClick}
                 onDoubleClick={handleDoubleClick}
                 onPointerOver={handlePointerOver}