Files
meshcore-analyzer/tests/unit/test-channel-sidebar-layout.js
Alex B 893773338e chore(tests): move root test-*.js into tests/unit and tests/e2e (#2036)
Moves 290 root test-*.js into tests/unit (177, listed in test-all.sh) and tests/e2e (113, classified in scripts/non-unit-tests.json), per #1981 and PR-D of #1385. Root goes from 348 entries to 48. test-all.sh and test-fixtures/ stay put. The inventory guard now fails if a test reappears in the root or sits in the wrong folder.

Verified independently of the diff: the invoked sets are unchanged (test-all.sh 177 before and after, deploy.yml 96 before and after, both identical as sets), and a full local run of test-all.sh on master and on the branch produced 4702 output lines each whose only differences are absolute paths, stack-trace line numbers shifted by the REPO_ROOT line, the inventory wording and two perf ratios. The guard was mutation-checked: a test back in the root, a unit suite in tests/e2e, and a suite dropped from test-all.sh each make it exit 1. CI run 35246304316 ran 97 suites from tests/e2e and is green.

Follow-up 9335c51d finished the instruction files: no bare root test command is left in AGENTS.md, the squad charters, .github or docs, and every tests/ path they name resolves.

Merged by the interim maintainer without a second human reviewer: CI and the local runs above are the independent checks.

Known and deliberately out of scope: 18 of the 113 files in tests/e2e are invoked by no runner at all, and one of them cannot run anywhere because it requires jsdom, which is not a declared dependency. Tracked separately.
2026-09-17 19:06:07 +02:00

82 lines
3.9 KiB
JavaScript

/**
* Regression: channel sidebar layout for user-added (PSK) channels was
* broken by #1024 (✕ remove + 🔑 badge) interacting with the outer
* `.ch-item` <button> wrapper.
*
* Root cause: HTML5 disallows nesting <button> inside <button>. The parser
* implicitly closes the outer `.ch-item` button as soon as it hits the
* inner `<button class="ch-remove-btn">`. This re-parents the remove
* button + everything after it (the `.ch-item-preview` "X: msg" line)
* outside the channel entry, producing the visible bug:
*
* [icon] Levski 🔑 <-- outer button closes early here
* ✕ <-- orphaned, "floats"
* KpaPocket: Тест <-- preview text orphaned
* [icon] #bookclub ...
*
* This test asserts the rendered template does NOT contain a nested
* `<button>` inside the `.ch-item` button. Plus the "No key" toggle gets
* clearer copy and stays grouped with the channel controls.
*/
'use strict';
const REPO_ROOT = require('path').resolve(__dirname, '..', '..');
const fs = require('fs');
const path = require('path');
let passed = 0, failed = 0;
function assert(cond, msg) {
if (cond) { passed++; console.log(' ✓ ' + msg); }
else { failed++; console.error(' ✗ ' + msg); }
}
const chSrc = fs.readFileSync(path.join(REPO_ROOT, 'public/channels.js'), 'utf8');
const cssSrc = fs.readFileSync(path.join(REPO_ROOT, 'public/style.css'), 'utf8');
console.log('\n=== Sidebar layout: no nested <button> inside .ch-item ===');
// The bug: a literal `<button class="ch-remove-btn"` inside the
// `.ch-item` template. After fix, the remove affordance must be a
// non-<button> element (e.g. <span role="button">) so HTML parsing
// keeps it inside the channel entry.
assert(!/<button[^>]*class="ch-remove-btn"/.test(chSrc),
'remove (✕) affordance must NOT be a <button> element (would close outer .ch-item button)');
// Remove control must still be discoverable (data attribute keeps the
// existing click handler in `addEventListener('click', ...)`).
// PR #1040 refactored to an iconBtn() helper, so the literal
// `data-remove-channel="..."` no longer appears verbatim in source —
// check that the helper is wired with the right data attribute instead.
assert(/data-remove-channel/.test(chSrc),
'remove affordance still carries data-remove-channel for click delegation');
console.log('\n=== Sidebar layout: ✕ visible on user-added rows (not opacity:0) ===');
// Bug compounded: even if the button rendered correctly, opacity:0
// hide-until-hover made it impossible to discover on touch devices.
// The user-added (PSK) row should expose ✕ at full visibility.
// PR #1040: shared base class .ch-icon-btn carries the opacity rule.
const baseRule = cssSrc.match(/\.ch-icon-btn\s*\{[^}]*\}/);
const removeRule = cssSrc.match(/\.ch-remove-btn\s*\{[^}]*\}/);
assert(baseRule || removeRule, 'found .ch-icon-btn or .ch-remove-btn CSS rule');
if (baseRule) {
assert(!/opacity:\s*0\s*[;}]/.test(baseRule[0]),
'.ch-icon-btn (base for ✕) must not be opacity:0 by default (was invisible on touch)');
}
console.log('\n=== Encrypted section: header exists and is collapsible (#1037 redesign) ===');
// #1037 replaced the binary "No key" visibility toggle with a sectioned
// sidebar — encrypted (no-key) channels live in their own collapsible
// section grouped with the rest. The old toggle is intentionally gone.
assert(/ch-section-encrypted/.test(chSrc),
'sidebar renders a dedicated Encrypted section');
assert(/id="chEncryptedToggle"/.test(chSrc),
'Encrypted section header is a toggle (button#chEncryptedToggle)');
assert(/aria-expanded=/.test(chSrc) && /aria-controls="chEncryptedBody"/.test(chSrc),
'toggle exposes ARIA collapsible state (aria-expanded + aria-controls)');
assert(/Encrypted \(\$\{encrypted\.length\}\)/.test(chSrc),
'Encrypted header shows live count');
console.log('\n=== Results ===');
console.log('Passed: ' + passed + ', Failed: ' + failed);
process.exit(failed > 0 ? 1 : 0);