From 43c15b81a3606e805c969089422856eb15381b5c Mon Sep 17 00:00:00 2001 From: th Date: Sat, 11 Apr 2026 18:50:25 +0200 Subject: [PATCH] tests: rebind runner to Ctrl+Shift+Alt+T and cover recent fixes MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 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) --- .../plugins/tests/card-interactions.test.js | 45 +++++++++- public/plugins/tests/context-menu.test.js | 79 ++++++++++++++++- public/plugins/tests/export.test.js | 24 ++++++ public/plugins/tests/loader.js | 12 ++- public/plugins/tests/plugin.json | 2 +- public/plugins/tests/runner.js | 4 +- public/plugins/tests/tests.md | 2 +- public/plugins/tests/theme.test.js | 86 ++++++++++++++++++- 8 files changed, 241 insertions(+), 13 deletions(-) diff --git a/public/plugins/tests/card-interactions.test.js b/public/plugins/tests/card-interactions.test.js index 452e78e..a7dac63 100644 --- a/public/plugins/tests/card-interactions.test.js +++ b/public/plugins/tests/card-interactions.test.js @@ -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() }, diff --git a/public/plugins/tests/context-menu.test.js b/public/plugins/tests/context-menu.test.js index 054a6ce..7884cda 100644 --- a/public/plugins/tests/context-menu.test.js +++ b/public/plugins/tests/context-menu.test.js @@ -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 {} + } + }); }); diff --git a/public/plugins/tests/export.test.js b/public/plugins/tests/export.test.js index cd591fc..4bfe127 100644 --- a/public/plugins/tests/export.test.js +++ b/public/plugins/tests/export.test.js @@ -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'); + }); }); diff --git a/public/plugins/tests/loader.js b/public/plugins/tests/loader.js index ceb6c9f..fab5a53 100644 --- a/public/plugins/tests/loader.js +++ b/public/plugins/tests/loader.js @@ -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?.()) ); } }); diff --git a/public/plugins/tests/plugin.json b/public/plugins/tests/plugin.json index 94fa8d6..fa7e65f 100644 --- a/public/plugins/tests/plugin.json +++ b/public/plugins/tests/plugin.json @@ -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": [], diff --git a/public/plugins/tests/runner.js b/public/plugins/tests/runner.js index 4a7d3bf..0bc9abd 100644 --- a/public/plugins/tests/runner.js +++ b/public/plugins/tests/runner.js @@ -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(); } diff --git a/public/plugins/tests/tests.md b/public/plugins/tests/tests.md index 9346582..11120bb 100644 --- a/public/plugins/tests/tests.md +++ b/public/plugins/tests/tests.md @@ -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 diff --git a/public/plugins/tests/theme.test.js b/public/plugins/tests/theme.test.js index ffe75e5..9fcdc86 100644 --- a/public/plugins/tests/theme.test.js +++ b/public/plugins/tests/theme.test.js @@ -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); + }); +});