From f6c1ffc5e20526ee655b9eceecec6aba1808a096 Mon Sep 17 00:00:00 2001
From: Nanook <nanookclaw@users.noreply.github.com>
Date: Fri, 29 May 2026 18:12:36 +0000
Subject: [PATCH] fix: constrain request path table cells

---
 .../Rendering/HtmlRendererTests.cs            | 35 ++++++++++++++++++
 .../Assets/css/debugprobe.css                 | 37 ++++++++++++++++++-
 .../Internal/Rendering/HtmlRenderer.cs        | 12 ++++--
 3 files changed, 79 insertions(+), 5 deletions(-)

diff --git a/DebugProbe.AspNetCore.Tests/Rendering/HtmlRendererTests.cs b/DebugProbe.AspNetCore.Tests/Rendering/HtmlRendererTests.cs
index 7d5440d..413a8f1 100644
--- a/DebugProbe.AspNetCore.Tests/Rendering/HtmlRendererTests.cs
+++ b/DebugProbe.AspNetCore.Tests/Rendering/HtmlRendererTests.cs
@@ -1,4 +1,5 @@
 using DebugProbe.AspNetCore.Internal.Rendering;
+using DebugProbe.AspNetCore.Internal.Resources;
 using DebugProbe.AspNetCore.Models;
 
 namespace DebugProbe.AspNetCore.Tests.Rendering;
@@ -26,6 +27,40 @@ public void Render_index_page_builds_page_with_entries()
         Assert.Contains("200", html);
     }
 
+    [Fact]
+    public void Render_index_page_constrains_path_cell_and_preserves_full_path_title()
+    {
+        var path = "/" + new string('a', 240);
+        var query = "?filter=" + new string('b', 120);
+        var fullPath = path + query;
+
+        var html = HtmlRenderer.RenderIndexPage(
+        [
+            new DebugEntry
+            {
+                Id = "trace-1",
+                Method = "GET",
+                Path = path,
+                Query = query,
+                StatusCode = 200,
+                Timestamp = new DateTimeOffset(2026, 1, 2, 3, 4, 5, TimeSpan.Zero)
+            }
+        ]);
+
+        Assert.Contains($@"<td class=""request-path""><span class=""request-path-value"" title=""{fullPath}"">{fullPath}</span></td>", html);
+    }
+
+    [Fact]
+    public void Embedded_css_keeps_request_index_table_fixed_with_ellipsized_paths()
+    {
+        Assert.Contains("#requestTable", EmbeddedResources.Css);
+        Assert.Contains("table-layout: fixed;", EmbeddedResources.Css);
+        Assert.Contains(".request-path-value", EmbeddedResources.Css);
+        Assert.Contains("overflow: hidden;", EmbeddedResources.Css);
+        Assert.Contains("text-overflow: ellipsis;", EmbeddedResources.Css);
+        Assert.Contains("white-space: nowrap;", EmbeddedResources.Css);
+    }
+
     [Fact]
     public void Details_page_renders_captured_values()
     {
diff --git a/DebugProbe.AspNetCore/Assets/css/debugprobe.css b/DebugProbe.AspNetCore/Assets/css/debugprobe.css
index ab3d8c2..43d30ba 100644
--- a/DebugProbe.AspNetCore/Assets/css/debugprobe.css
+++ b/DebugProbe.AspNetCore/Assets/css/debugprobe.css
@@ -429,6 +429,30 @@ table {
     border-collapse: collapse;
 }
 
+#requestTable {
+    table-layout: fixed;
+}
+
+#requestTable th:nth-child(1),
+#requestTable td:nth-child(1) {
+    width: 80px;
+}
+
+#requestTable th:nth-child(2),
+#requestTable td:nth-child(2) {
+    width: 96px;
+}
+
+#requestTable th:nth-child(4),
+#requestTable td:nth-child(4) {
+    width: 92px;
+}
+
+#requestTable th:nth-child(5),
+#requestTable td:nth-child(5) {
+    width: 100px;
+}
+
 .table-wrap {
     overflow-x: auto;
     background: #fff;
@@ -463,6 +487,18 @@ tbody tr:last-child td {
     cursor: pointer;
 }
 
+.request-path {
+    min-width: 0;
+}
+
+.request-path-value {
+    display: block;
+    overflow: hidden;
+    max-width: 100%;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
 .method-pill {
     display: inline-flex;
     min-width: 60px;
@@ -1092,4 +1128,3 @@ pre {
     background: #4a1717;
     color: #ff8a8a !important;
 }
-
diff --git a/DebugProbe.AspNetCore/Internal/Rendering/HtmlRenderer.cs b/DebugProbe.AspNetCore/Internal/Rendering/HtmlRenderer.cs
index 2d2c7fa..49aeb64 100644
--- a/DebugProbe.AspNetCore/Internal/Rendering/HtmlRenderer.cs
+++ b/DebugProbe.AspNetCore/Internal/Rendering/HtmlRenderer.cs
@@ -26,7 +26,11 @@ public static string RenderIndexPage(List<DebugEntry> items)
     {
         const int slowRequestThresholdMs = 1000;
 
-        var rows = string.Join("", items.Select(x => $@"
+        var rows = string.Join("", items.Select(x =>
+        {
+            var pathWithQuery = string.IsNullOrEmpty(x.Query) ? x.Path : $"{x.Path}{x.Query}";
+
+            return $@"
         <tr data-url=""/debug/{Encode(x.Id)}""
             data-method=""{Encode(x.Method)}""
             data-status-family=""{x.StatusCode / 100}""
@@ -34,11 +38,11 @@ public static string RenderIndexPage(List<DebugEntry> items)
             class=""clickable-row"">
             <td>{x.Timestamp:HH:mm:ss}</td>
             <td><span class=""method-pill"">{Encode(x.Method)}</span></td>
-            <td>{Encode(string.IsNullOrEmpty(x.Query) ? x.Path : $"{x.Path}{x.Query}")}</td>
+            <td class=""request-path""><span class=""request-path-value"" title=""{Encode(pathWithQuery)}"">{Encode(pathWithQuery)}</span></td>
             <td><span class=""status {GetStatusClass(x.StatusCode)}"">{x.StatusCode}</span></td>
             <td>{x.DurationMs} ms</td>
-        </tr>"
-        ));
+        </tr>";
+        }));
 
         if (string.IsNullOrEmpty(rows))
             rows = "<tr class='empty-row'><td colspan='5'>No data</td></tr>";