tests: rebind runner to Ctrl+Shift+Alt+T and cover recent fixes

Plugin loader + runner shortcut moves to Ctrl+Shift+Alt+T (the old
Ctrl+Shift+T conflicts with the browser "reopen closed tab"). Loader
now imports runner.js *without* the cache-busting query so it picks
up the same module instance the test files register their suites
into — previously the shortcut opened a fresh runner with an empty
suites array and reported 0/0 passed.

New / fixed coverage:
- card-interactions: favorite toggle assertion is now case-insensitive
  (context menu was capitalized to "Unfavorite"/"Favorite" earlier);
  done-badge test guards against state.hideDone / hideTagged that would
  filter the test card off the board; new test for the always-on
  Mark done / Unmark done toggle on a card without due_date.
- context-menu: copy-text action exists; copy-text strips fenced code
  blocks, image markdown and inline #tags. Mocks navigator.clipboard
  via Object.defineProperty so the assertion works without a focused
  / secure-context clipboard.
- export: round-trip preserves a custom bucket color (covers the import
  handler regression that was wiping bucket colors on every test run).
- theme: design preset selection persists in localStorage across
  settings open/close, refreshPresetSelect ignores unknown keys.
  afterEach restores both hyprcrd-design-active-preset and
  hyprcrd-design so a test run can't permanently swap the user's
  design.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
thandClaude Opus 4.6 committed 2026-04-11 18:50:25 +02:00
1 parent ccd0477841
commit 43c15b81a3
8 files changed
+241 -13

No files matched your search

+43 -2
View File
@@ -70,6 +70,7 @@ describe('Card: Due Date & Done', () => {
it('card with #done tag shows done badge', async () => {
if (localStorage.getItem('hyprcrd-show-done-badge') === '0') return;
if (state.hideDone || state.hideTagged) return;
const res = await fetch('api/cards', {
method: 'POST', headers: { 'Content-Type': 'application/json', 'X-CSRF-Token': csrf() },
body: JSON.stringify({ title: '__test_done_badge__', body: '#done', color: '#38bdf8' }),
@@ -110,7 +111,7 @@ describe('Card: Context Menu Actions', () => {
rightClick(card);
await sleep(150);
const favBtn = $$('#ctx-items [data-action="favorite"]')[0];
const wasFav = favBtn?.textContent.includes('unfavorite');
const wasFav = favBtn?.textContent.toLowerCase().includes('unfavorite');
click(favBtn);
await sleep(200);
@@ -118,13 +119,53 @@ describe('Card: Context Menu Actions', () => {
rightClick(card);
await sleep(150);
const favBtn2 = $$('#ctx-items [data-action="favorite"]')[0];
const isFav = favBtn2?.textContent.includes('unfavorite');
const isFav = favBtn2?.textContent.toLowerCase().includes('unfavorite');
expect(isFav).toBe(!wasFav);
// Toggle back
click(favBtn2);
await sleep(100);
});
it('mark done toggles #done on cards without due_date', async () => {
// After clicking, the card has #done — if either filter is on it would
// disappear from the board before the second right-click can find it.
if (state.hideDone || state.hideTagged) return;
// Create a card with no due_date — Mark done used to be hidden in this case
const res = await fetch('api/cards', {
method: 'POST', headers: { 'Content-Type': 'application/json', 'X-CSRF-Token': csrf() },
body: JSON.stringify({ title: '__test_mark_done__', body: 'plain text', color: '#38bdf8' }),
}).then(r => r.json());
await window._reloadAll?.();
await sleep(200);
const cardEl = document.querySelector(`[data-id="${res.id}"]`);
if (!cardEl) return;
rightClick(cardEl);
await sleep(150);
// The action must always be present, even with no due_date
const doneBtn = $$('#ctx-items [data-action="due-done"]')[0];
expect(doneBtn).toExist();
expect(doneBtn.textContent.toLowerCase()).toContain('mark done');
click(doneBtn);
await sleep(300);
let updated = await fetch(`api/cards?ids=${res.id}`).then(r => r.json());
expect((updated[0].body || '').toLowerCase()).toContain('#done');
expect(updated[0].tags || '').toContain('done');
// Re-open menu — the entry should now flip to "Unmark done"
rightClick(document.querySelector(`[data-id="${res.id}"]`));
await sleep(150);
const doneBtn2 = $$('#ctx-items [data-action="due-done"]')[0];
expect(doneBtn2.textContent.toLowerCase()).toContain('unmark');
click(doneBtn2);
await sleep(300);
updated = await fetch(`api/cards?ids=${res.id}`).then(r => r.json());
expect((updated[0].body || '').toLowerCase().includes('#done')).toBe(false);
});
it('color submenu changes card color', async () => {
const res = await fetch('api/cards', {
method: 'POST', headers: { 'Content-Type': 'application/json', 'X-CSRF-Token': csrf() },
+78 -1
View File
@@ -1,4 +1,4 @@
import { describe, it, afterEach, expect, $, $$, rightClick, sleep } from './runner.js';
import { describe, it, afterEach, expect, $, $$, click, rightClick, sleep, csrf } from './runner.js';
describe('Context Menu', () => {
afterEach(async () => {
@@ -52,4 +52,81 @@ describe('Context Menu', () => {
await sleep(50);
expect($('#ctx-menu').classList.contains('hidden')).toBe(true);
});
it('has copy-text action', async () => {
const card = $('#board [data-id]');
if (!card) return;
rightClick(card);
await sleep(150);
const actions = $$('#ctx-items [data-action]').map(b => b.dataset.action);
expect(actions).toContain('copy-text');
});
it('copy-text strips tags, code blocks and image markdown', async () => {
// Stub navigator.clipboard.writeText so we can capture what would be copied
// without depending on a focused/secure-context clipboard.
const origWrite = navigator.clipboard?.writeText?.bind(navigator.clipboard);
let captured = null;
try {
Object.defineProperty(navigator, 'clipboard', {
value: { writeText: async (t) => { captured = t; } },
configurable: true,
});
} catch {
// some browsers don't allow re-defining `clipboard` — bail out cleanly
return;
}
try {
const body = [
'first line',
'',
'![alt](uploads/foo.png)',
'```js',
'console.log("nope")',
'```',
'second line #tagone with #tagtwo inline',
].join('\n');
const res = await fetch('api/cards', {
method: 'POST', headers: { 'Content-Type': 'application/json', 'X-CSRF-Token': csrf() },
body: JSON.stringify({ title: '__test_copy_text__', body, color: '#38bdf8' }),
}).then(r => r.json());
await window._reloadAll?.();
await sleep(200);
const cardEl = document.querySelector(`[data-id="${res.id}"]`);
if (!cardEl) return;
rightClick(cardEl);
await sleep(150);
const copyBtn = $$('#ctx-items [data-action="copy-text"]')[0];
expect(copyBtn).toExist();
click(copyBtn);
await sleep(100);
expect(captured).toExist();
// Title goes first, separated by a blank line
expect(captured.startsWith('__test_copy_text__\n\n')).toBe(true);
expect(captured).toContain('first line');
expect(captured).toContain('second line');
// Tags removed (chip + suffix), but the surrounding word "with" stays
expect(captured).toContain('with');
expect(captured.includes('#tagone')).toBe(false);
expect(captured.includes('#tagtwo')).toBe(false);
// Fenced code block dropped entirely
expect(captured.includes('console.log')).toBe(false);
expect(captured.includes('```')).toBe(false);
// Image markdown dropped
expect(captured.includes('uploads/foo.png')).toBe(false);
expect(captured.includes('![')).toBe(false);
} finally {
try {
Object.defineProperty(navigator, 'clipboard', {
value: { writeText: origWrite || (async () => {}) },
configurable: true,
});
} catch {}
}
});
});
+24
View File
@@ -114,4 +114,28 @@ describe('Export: Backup Integrity', () => {
expect(found.tags).toContain('beta');
expect(found.due_date).toBe('2099-12-31');
});
it('export→import preserves bucket color', async () => {
// Create a bucket with a recognizable name and patch a custom color onto it
const b = await fetch('api/buckets', {
method: 'POST', headers: { 'Content-Type': 'application/json', 'X-CSRF-Token': csrf() },
body: JSON.stringify({ name: '__test_bucket_color__' }),
}).then(r => r.json());
await fetch(`api/buckets/${b.id}`, {
method: 'PATCH', headers: { 'Content-Type': 'application/json', 'X-CSRF-Token': csrf() },
body: JSON.stringify({ color: '#fb7185' }),
});
// Round-trip through export → replace-import
const blob = await fetch('api/export').then(r => r.blob());
const form = new FormData();
form.append('file', blob, 'roundtrip.zip');
await fetch('api/import', { method: 'POST', body: form, headers: { 'X-CSRF-Token': csrf() } });
// The bucket must reappear with the same custom color (not the schema default)
const buckets = await fetch('api/buckets').then(r => r.json());
const found = buckets.find(x => x.name === '__test_bucket_color__');
expect(found).toExist();
expect(found.color).toBe('#fb7185');
});
});
+8 -4
View File
@@ -2,7 +2,7 @@
//
// The test runner is heavy (40+ test files), so we only load it when:
// - URL contains ?test query param → auto-run
// - Ctrl+Shift+T pressed → manual open
// - Ctrl+Shift+Alt+T pressed → manual open
//
// Tests are completely optional — without this plugin the app has no
// test runner code loaded at all.
@@ -19,12 +19,16 @@ if (new URLSearchParams(location.search).has('test')) {
import('./tests.js' + V);
}
// Keyboard shortcut: Ctrl+Shift+T → open runner
// Keyboard shortcut: Ctrl+Shift+Alt+T → open runner.
// Import runner.js *without* the cache-busting query so we get the same
// module instance that the test files register their suites into. With a
// `?v=` suffix the browser treats it as a distinct module and we'd open
// a fresh runner whose `suites` array is empty (→ "0/0 passed").
document.addEventListener('keydown', e => {
if (e.ctrlKey && e.shiftKey && e.key === 'T') {
if (e.ctrlKey && e.shiftKey && e.altKey && (e.key === 'T' || e.key === 't')) {
e.preventDefault();
import('./tests.js' + V).then(() =>
import('./runner.js' + V).then(m => m.open?.())
import('./runner.js').then(m => m.open?.())
);
}
});
+1 -1
View File
@@ -1,7 +1,7 @@
{
"name": "tests",
"version": "1.0.0",
"description": "UI + state test runner. Loads only when ?test query param is present or Ctrl+Shift+T is pressed.",
"description": "UI + state test runner. Loads only when ?test query param is present or Ctrl+Shift+Alt+T is pressed.",
"frontend": {
"js": ["loader.js"],
"css": [],
+2 -2
View File
@@ -1,6 +1,6 @@
// ── hyprcrd GUI Test Runner ──
// Self-contained in-app test framework. No external dependencies.
// Activate: ?test=1 in URL or Ctrl+Shift+T
// Activate: ?test=1 in URL or Ctrl+Shift+Alt+T
// Panel is hidden during test run so interactions are visible.
// Backup is created before and auto-restored after every run.
@@ -351,7 +351,7 @@ if (new URLSearchParams(location.search).has('test')) {
}
document.addEventListener('keydown', e => {
if (e.ctrlKey && e.shiftKey && e.key === 'T') {
if (e.ctrlKey && e.shiftKey && e.altKey && (e.key === 'T' || e.key === 't')) {
e.preventDefault();
panel ? close() : open();
}
+1 -1
View File
@@ -5,7 +5,7 @@ Self-contained in-app test suite. No external dependencies.
## Activation
- **URL**: append `?test=1`
- **Keyboard**: `Ctrl+Shift+T`
- **Keyboard**: `Ctrl+Shift+Alt+T`
- **Safety**: automatic backup before run, auto-restore after
- **Visibility**: panel hides during tests so you can watch interactions, shows results after
- **Sync paused**: background sync and autoSync disabled during tests
+84 -2
View File
@@ -1,4 +1,4 @@
import { describe, it, expect } from './runner.js';
import { describe, it, afterEach, expect, $, $$, click, closeAll, sleep } from './runner.js';
describe('Theme', () => {
it('CSS custom properties set', () => {
@@ -28,8 +28,90 @@ describe('Theme', () => {
});
describe('Keyboard Shortcuts', () => {
it('Ctrl+Shift+T bound (test runner)', () => {
it('Ctrl+Shift+Alt+T bound (test runner)', () => {
// Just verify we got here — the test runner itself proves this works
expect(true).toBe(true);
});
});
describe('Theme: Design preset persistence', () => {
const STORAGE_KEY = 'hyprcrd-design-active-preset';
const DESIGN_KEY = 'hyprcrd-design';
let savedActive = null;
let savedDesign = null;
afterEach(async () => {
// Restore the user's actual preset selection AND committed design.
// loadSelectedPreset() in the test fires commitDesign() which writes
// to hyprcrd-design — without this restore, running the test would
// permanently swap the user's design.
if (savedActive === null) localStorage.removeItem(STORAGE_KEY);
else localStorage.setItem(STORAGE_KEY, savedActive);
if (savedDesign === null) localStorage.removeItem(DESIGN_KEY);
else localStorage.setItem(DESIGN_KEY, savedDesign);
await closeAll();
});
function snapshot() {
savedActive = localStorage.getItem(STORAGE_KEY);
savedDesign = localStorage.getItem(DESIGN_KEY);
}
async function openThemeTab() {
click('#settings-btn');
await sleep(150);
const tab = $$('.settings-tab').find(t => t.dataset.tab === 'theme');
if (tab) click(tab);
await sleep(150);
}
it('preset select exists in theme tab', async () => {
snapshot();
await openThemeTab();
expect($('#design-preset-select')).toExist();
});
it('changing preset writes active key to localStorage', async () => {
snapshot();
await openThemeTab();
const sel = $('#design-preset-select');
if (!sel) return;
const opt = sel.querySelector('option[value^="builtin:"]');
if (!opt) return;
sel.value = opt.value;
sel.dispatchEvent(new Event('change', { bubbles: true }));
await sleep(100);
expect(localStorage.getItem(STORAGE_KEY)).toBe(opt.value);
});
it('reopening settings restores the previously selected preset', async () => {
snapshot();
// Pre-seed an active preset before settings is ever opened in this test
await openThemeTab();
const sel = $('#design-preset-select');
if (!sel) return;
const opts = [...sel.querySelectorAll('option[value^="builtin:"]')];
if (opts.length < 2) return;
const target = opts[1].value;
localStorage.setItem(STORAGE_KEY, target);
// Close + reopen settings to trigger initDesignSettings → refreshPresetSelect
click('#settings-close');
await sleep(150);
await openThemeTab();
const sel2 = $('#design-preset-select');
expect(sel2.value).toBe(target);
});
it('refreshPresetSelect ignores unknown preset keys', async () => {
snapshot();
localStorage.setItem(STORAGE_KEY, 'user:__definitely_not_a_real_preset__');
await openThemeTab();
const sel = $('#design-preset-select');
if (!sel) return;
// Must not throw and must not assign the bogus value to the select
expect(sel.value).toBe(sel.value); // sanity: didn't crash above
expect(sel.value === 'user:__definitely_not_a_real_preset__').toBe(false);
});
});