mirror of
https://github.com/Kpa-clawbot/meshcore-analyzer.git
synced 2026-03-29 14:19:53 +00:00
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>
This commit is contained in:
@@ -22,9 +22,9 @@
|
||||
<meta name="twitter:title" content="MeshCore Analyzer">
|
||||
<meta name="twitter:description" content="Real-time MeshCore LoRa mesh network analyzer — live packet visualization, node tracking, channel decryption, and route analysis.">
|
||||
<meta name="twitter:image" content="https://raw.githubusercontent.com/Kpa-clawbot/meshcore-analyzer/master/public/og-image.png">
|
||||
<link rel="stylesheet" href="style.css?v=1774625000">
|
||||
<link rel="stylesheet" href="home.css?v=1774625000">
|
||||
<link rel="stylesheet" href="live.css?v=1774625000">
|
||||
<link rel="stylesheet" href="style.css?v=1774627822">
|
||||
<link rel="stylesheet" href="home.css?v=1774627822">
|
||||
<link rel="stylesheet" href="live.css?v=1774627822">
|
||||
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"
|
||||
integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY="
|
||||
crossorigin="anonymous">
|
||||
@@ -81,29 +81,29 @@
|
||||
<main id="app" role="main"></main>
|
||||
|
||||
<script src="vendor/qrcode.js"></script>
|
||||
<script src="roles.js?v=1774625000"></script>
|
||||
<script src="customize.js?v=1774625000" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="region-filter.js?v=1774625000"></script>
|
||||
<script src="hop-resolver.js?v=1774625000"></script>
|
||||
<script src="hop-display.js?v=1774625000"></script>
|
||||
<script src="app.js?v=1774625000"></script>
|
||||
<script src="home.js?v=1774625000"></script>
|
||||
<script src="packet-filter.js?v=1774625000"></script>
|
||||
<script src="packets.js?v=1774625000"></script>
|
||||
<script src="map.js?v=1774625000" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="channels.js?v=1774625000" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="nodes.js?v=1774625000" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="traces.js?v=1774625000" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="analytics.js?v=1774625000" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="audio.js?v=1774625000" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="audio-v1-constellation.js?v=1774625000" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="audio-v2-constellation.js?v=1774625000" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="audio-lab.js?v=1774625000" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="live.js?v=1774625000" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="observers.js?v=1774625000" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="observer-detail.js?v=1774625000" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="compare.js?v=1774625000" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="node-analytics.js?v=1774625000" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="perf.js?v=1774625000" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="roles.js?v=1774627822"></script>
|
||||
<script src="customize.js?v=1774627822" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="region-filter.js?v=1774627822"></script>
|
||||
<script src="hop-resolver.js?v=1774627822"></script>
|
||||
<script src="hop-display.js?v=1774627822"></script>
|
||||
<script src="app.js?v=1774627822"></script>
|
||||
<script src="home.js?v=1774627822"></script>
|
||||
<script src="packet-filter.js?v=1774627822"></script>
|
||||
<script src="packets.js?v=1774627822"></script>
|
||||
<script src="map.js?v=1774627822" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="channels.js?v=1774627822" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="nodes.js?v=1774627822" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="traces.js?v=1774627822" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="analytics.js?v=1774627822" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="audio.js?v=1774627822" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="audio-v1-constellation.js?v=1774627822" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="audio-v2-constellation.js?v=1774627822" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="audio-lab.js?v=1774627822" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="live.js?v=1774627822" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="observers.js?v=1774627822" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="observer-detail.js?v=1774627822" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="compare.js?v=1774627822" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="node-analytics.js?v=1774627822" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="perf.js?v=1774627822" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -180,7 +180,7 @@
|
||||
filters.node = routeParam;
|
||||
}
|
||||
}
|
||||
app.innerHTML = `<div class="split-layout">
|
||||
app.innerHTML = `<div class="split-layout detail-collapsed">
|
||||
<div class="panel-left" id="pktLeft"></div>
|
||||
<div class="panel-right empty" id="pktRight" aria-live="polite">
|
||||
<div class="panel-resize-handle" id="pktResizeHandle"></div>
|
||||
|
||||
@@ -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*`<div class="split-layout([^"]*)">/);
|
||||
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`);
|
||||
|
||||
Reference in New Issue
Block a user