From bad023ccad8bbfb12bd9be9670874f9f1a2c421c Mon Sep 17 00:00:00 2001 From: Kpa-clawbot <259247574+Kpa-clawbot@users.noreply.github.com> Date: Fri, 27 Mar 2026 09:10:51 -0700 Subject: [PATCH] fix: hide packet detail pane on fresh page load Add detail-collapsed class to split-layout initial HTML so the empty right panel is hidden before any packet is selected. The class is already removed when a packet row is clicked and re-added when the close button is pressed. Add 3 tests verifying the detail pane starts collapsed and that open/close toggling is wired correctly. Bump cache busters. Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com> --- public/index.html | 54 ++++++++++++++++++++-------------------- public/packets.js | 2 +- test-frontend-helpers.js | 24 ++++++++++++++++++ 3 files changed, 52 insertions(+), 28 deletions(-) diff --git a/public/index.html b/public/index.html index 111d04a..3b5f6cd 100644 --- a/public/index.html +++ b/public/index.html @@ -22,9 +22,9 @@ - - - + + + @@ -81,29 +81,29 @@
- - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/packets.js b/public/packets.js index d5fe6ec..06b7caf 100644 --- a/public/packets.js +++ b/public/packets.js @@ -180,7 +180,7 @@ filters.node = routeParam; } } - app.innerHTML = `
+ app.innerHTML = `
diff --git a/test-frontend-helpers.js b/test-frontend-helpers.js index 8bfd60a..b41a3ed 100644 --- a/test-frontend-helpers.js +++ b/test-frontend-helpers.js @@ -1116,6 +1116,30 @@ console.log('\n=== compare.js: comparePacketSets ==='); }); } +// ===== Packets page: detail pane starts collapsed ===== +{ + console.log('\nPackets page — detail pane initial state:'); + const packetsSource = fs.readFileSync('public/packets.js', 'utf8'); + + test('split-layout starts with detail-collapsed class', () => { + // The template literal that creates the split-layout must include detail-collapsed + const match = packetsSource.match(/innerHTML\s*=\s*`
/); + assert.ok(match, 'should find split-layout innerHTML assignment'); + assert.ok(match[1].includes('detail-collapsed'), + 'split-layout initial class should include detail-collapsed, got: "split-layout' + match[1] + '"'); + }); + + test('closeDetailPanel adds detail-collapsed', () => { + assert.ok(packetsSource.includes("classList.add('detail-collapsed')"), + 'closeDetailPanel should add detail-collapsed class'); + }); + + test('selectPacket removes detail-collapsed', () => { + assert.ok(packetsSource.includes("classList.remove('detail-collapsed')"), + 'selectPacket should remove detail-collapsed class'); + }); +} + // ===== SUMMARY ===== console.log(`\n${'═'.repeat(40)}`); console.log(` Frontend helpers: ${passed} passed, ${failed} failed`);