mirror of
https://github.com/Ark0N/Codeman.git
synced 2026-10-03 22:19:42 +02:00
Merge PR #146 from aakhter/cod-163-command-palette: searchable case picker + Command-K session palette
Includes review fixes: Session Manager aligned to the merged /api/sessions/unified contract with error states, Ctrl+K no longer leaks 0x0B into the PTY, shortcut registry finished (dispatch/persistence/rendering), shortcutOverrides preserved across settings saves, help modal kept reachable. # Conflicts: # README.md # src/web/public/index.html # src/web/public/session-ui.js
This commit is contained in:
Codeman maintainer
@@ -0,0 +1,454 @@
|
||||
import { readFileSync } from 'node:fs';
|
||||
import { resolve } from 'node:path';
|
||||
import vm from 'node:vm';
|
||||
import { describe, expect, it, vi } from 'vitest';
|
||||
|
||||
function loadPaletteHarness(overrides: Record<string, any> = {}) {
|
||||
const elements: Record<string, any> = {};
|
||||
const listeners: Record<string, (event: any) => void> = {};
|
||||
const CodemanApp = function CodemanApp(this: any) {};
|
||||
|
||||
const makeClassList = () => {
|
||||
const classes = new Set<string>();
|
||||
return {
|
||||
add: (...names: string[]) => names.forEach((name) => classes.add(name)),
|
||||
remove: (...names: string[]) => names.forEach((name) => classes.delete(name)),
|
||||
contains: (name: string) => classes.has(name),
|
||||
toggle: (name: string, force?: boolean) => {
|
||||
const shouldAdd = force ?? !classes.has(name);
|
||||
if (shouldAdd) classes.add(name);
|
||||
else classes.delete(name);
|
||||
return shouldAdd;
|
||||
},
|
||||
};
|
||||
};
|
||||
|
||||
elements.commandPaletteModal = {
|
||||
classList: makeClassList(),
|
||||
addEventListener: vi.fn((event: string, handler: (event: any) => void) => {
|
||||
listeners[`modal:${event}`] = handler;
|
||||
}),
|
||||
};
|
||||
elements.commandPaletteSearch = {
|
||||
value: '',
|
||||
focus: vi.fn(),
|
||||
select: vi.fn(),
|
||||
addEventListener: vi.fn((event: string, handler: (event: any) => void) => {
|
||||
listeners[`search:${event}`] = handler;
|
||||
}),
|
||||
};
|
||||
elements.commandPaletteList = {
|
||||
innerHTML: '',
|
||||
addEventListener: vi.fn((event: string, handler: (event: any) => void) => {
|
||||
listeners[`list:${event}`] = handler;
|
||||
}),
|
||||
};
|
||||
elements.quickStartCase = {
|
||||
value: 'plex-previews',
|
||||
};
|
||||
|
||||
const context = vm.createContext({
|
||||
CodemanApp,
|
||||
document: {
|
||||
getElementById: (id: string) => elements[id] ?? null,
|
||||
createElement: (tagName: string) => ({
|
||||
tagName: tagName.toUpperCase(),
|
||||
value: '',
|
||||
textContent: '',
|
||||
}),
|
||||
},
|
||||
console,
|
||||
escapeHtml: (value: string) =>
|
||||
String(value)
|
||||
.replace(/&/g, '&')
|
||||
.replace(/</g, '<')
|
||||
.replace(/>/g, '>')
|
||||
.replace(/"/g, '"')
|
||||
.replace(/'/g, '''),
|
||||
...overrides,
|
||||
});
|
||||
|
||||
const panelsUi = readFileSync(resolve(import.meta.dirname, '../src/web/public/panels-ui.js'), 'utf8');
|
||||
vm.runInContext(panelsUi, context, { filename: 'panels-ui.js' });
|
||||
|
||||
const app = new (CodemanApp as any)();
|
||||
app.sessions = new Map([
|
||||
[
|
||||
'sess-alpha',
|
||||
{
|
||||
id: 'sess-alpha',
|
||||
name: 'Alpha API cleanup',
|
||||
workingDir: '/repo/api',
|
||||
mode: 'codex',
|
||||
status: 'busy',
|
||||
},
|
||||
],
|
||||
[
|
||||
'sess-beta',
|
||||
{
|
||||
id: 'sess-beta',
|
||||
name: 'Billing prompt polish',
|
||||
workingDir: '/repo/billing',
|
||||
mode: 'claude',
|
||||
status: 'idle',
|
||||
},
|
||||
],
|
||||
[
|
||||
'sess-gamma',
|
||||
{
|
||||
id: 'sess-gamma',
|
||||
workingDir: '/repo/flux-player',
|
||||
mode: 'codex',
|
||||
status: 'busy',
|
||||
},
|
||||
],
|
||||
]);
|
||||
app.sessionOrder = ['sess-beta', 'sess-alpha', 'sess-gamma'];
|
||||
app.cases = [{ name: 'plex-previews' }, { name: 'flux-player' }, { name: 'api-tools' }];
|
||||
app.selectSession = vi.fn();
|
||||
app.run = vi.fn();
|
||||
app.getShortId = (id: string) => id.slice(0, 8);
|
||||
app.getSessionName = (session: any) =>
|
||||
session.name || session.workingDir?.split('/').pop() || app.getShortId(session.id);
|
||||
|
||||
return { app, elements, listeners };
|
||||
}
|
||||
|
||||
describe('Command-K session palette', () => {
|
||||
it('recognizes Cmd/Ctrl-K outside text-entry contexts only', () => {
|
||||
const { app } = loadPaletteHarness();
|
||||
|
||||
expect(app.shouldOpenCommandPaletteFromShortcut({ key: 'k', metaKey: true, ctrlKey: false, target: null })).toBe(
|
||||
true
|
||||
);
|
||||
expect(app.shouldOpenCommandPaletteFromShortcut({ key: 'K', metaKey: false, ctrlKey: true, target: null })).toBe(
|
||||
true
|
||||
);
|
||||
expect(
|
||||
app.shouldOpenCommandPaletteFromShortcut({
|
||||
key: 'k',
|
||||
metaKey: true,
|
||||
ctrlKey: false,
|
||||
target: { tagName: 'INPUT', isContentEditable: false },
|
||||
})
|
||||
).toBe(false);
|
||||
expect(
|
||||
app.shouldOpenCommandPaletteFromShortcut({
|
||||
key: 'k',
|
||||
metaKey: false,
|
||||
ctrlKey: true,
|
||||
target: { tagName: 'DIV', isContentEditable: true },
|
||||
})
|
||||
).toBe(false);
|
||||
});
|
||||
|
||||
it('recognizes Ctrl-K from the focused xterm helper textarea', () => {
|
||||
const { app } = loadPaletteHarness();
|
||||
|
||||
expect(
|
||||
app.shouldOpenCommandPaletteFromShortcut({
|
||||
key: 'k',
|
||||
code: 'KeyK',
|
||||
metaKey: false,
|
||||
ctrlKey: true,
|
||||
altKey: false,
|
||||
target: {
|
||||
tagName: 'TEXTAREA',
|
||||
isContentEditable: false,
|
||||
classList: { contains: (name: string) => name === 'xterm-helper-textarea' },
|
||||
},
|
||||
})
|
||||
).toBe(true);
|
||||
});
|
||||
|
||||
it('recognizes macOS Option-K by physical key code', () => {
|
||||
const { app } = loadPaletteHarness();
|
||||
|
||||
expect(
|
||||
app.shouldOpenCommandPaletteFromShortcut({
|
||||
key: '˚',
|
||||
code: 'KeyK',
|
||||
metaKey: false,
|
||||
ctrlKey: false,
|
||||
altKey: true,
|
||||
target: null,
|
||||
})
|
||||
).toBe(true);
|
||||
});
|
||||
|
||||
it('rejects the palette chord when extra modifiers are held (Ctrl+Shift+K is the Firefox devtools console)', () => {
|
||||
const { app } = loadPaletteHarness();
|
||||
|
||||
expect(
|
||||
app.shouldOpenCommandPaletteFromShortcut({ key: 'K', code: 'KeyK', ctrlKey: true, shiftKey: true, target: null })
|
||||
).toBe(false);
|
||||
});
|
||||
|
||||
it('honors a disabled or rebound palette shortcut from the registry', () => {
|
||||
const { app } = loadPaletteHarness();
|
||||
|
||||
// Disabled entry → never opens, even for the default chord.
|
||||
app.getShortcutRegistry = () => [
|
||||
{ id: 'command-palette', disabled: true, bindings: [{ modifiers: ['ctrl'], key: 'k', code: 'KeyK' }] },
|
||||
];
|
||||
app.matchesShortcutEvent = () => true;
|
||||
expect(app.shouldOpenCommandPaletteFromShortcut({ key: 'k', code: 'KeyK', ctrlKey: true, target: null })).toBe(
|
||||
false
|
||||
);
|
||||
|
||||
// Rebound entry → the new chord opens, the old default no longer does.
|
||||
app.getShortcutRegistry = () => [{ id: 'command-palette', bindings: [{ modifiers: ['ctrl'], code: 'KeyP' }] }];
|
||||
app.matchesShortcutEvent = (e: any, s: any) => e.code === s.bindings[0].code;
|
||||
expect(app.shouldOpenCommandPaletteFromShortcut({ key: 'k', code: 'KeyK', ctrlKey: true, target: null })).toBe(
|
||||
false
|
||||
);
|
||||
expect(app.shouldOpenCommandPaletteFromShortcut({ key: 'p', code: 'KeyP', ctrlKey: true, target: null })).toBe(
|
||||
true
|
||||
);
|
||||
});
|
||||
|
||||
it('opens and focuses the palette search box', () => {
|
||||
const { app, elements } = loadPaletteHarness();
|
||||
|
||||
app.openCommandPalette();
|
||||
|
||||
expect(elements.commandPaletteModal.classList.contains('active')).toBe(true);
|
||||
expect(elements.commandPaletteSearch.focus).toHaveBeenCalledTimes(1);
|
||||
expect(elements.commandPaletteList.innerHTML).toContain('Alpha API cleanup');
|
||||
});
|
||||
|
||||
it('filters currently open sessions and always includes a new-session action', () => {
|
||||
const { app } = loadPaletteHarness();
|
||||
|
||||
const results = app.buildCommandPaletteItems('bill');
|
||||
|
||||
expect(results.map((item: any) => item.id)).toEqual(['session:sess-beta', 'new-session', 'browse-sessions']);
|
||||
expect(results[0]).toMatchObject({ type: 'session', sessionId: 'sess-beta', title: 'Billing prompt polish' });
|
||||
expect(results[1]).toMatchObject({ type: 'new-session', title: 'New session' });
|
||||
expect(results[2]).toMatchObject({ type: 'browse-sessions' });
|
||||
});
|
||||
|
||||
it('uses the tab name instead of the short session id for unnamed sessions', () => {
|
||||
const { app } = loadPaletteHarness();
|
||||
|
||||
const results = app.buildCommandPaletteItems('flux-player');
|
||||
|
||||
expect(results[0]).toMatchObject({
|
||||
type: 'session',
|
||||
sessionId: 'sess-gamma',
|
||||
title: 'flux-player',
|
||||
});
|
||||
expect(results[0].title).not.toBe('sess-gam');
|
||||
});
|
||||
|
||||
it('uses the best matching case for the new-session action', async () => {
|
||||
const { app, elements } = loadPaletteHarness();
|
||||
|
||||
const results = app.buildCommandPaletteItems('flux');
|
||||
const newSession = results.find((item: any) => item.type === 'new-session');
|
||||
|
||||
expect(newSession).toMatchObject({
|
||||
type: 'new-session',
|
||||
caseName: 'flux-player',
|
||||
subtitle: 'Run Claude in flux-player',
|
||||
});
|
||||
|
||||
app.commandPaletteItems = [newSession];
|
||||
app.commandPaletteActiveIndex = 0;
|
||||
await app.activateCommandPaletteItem();
|
||||
|
||||
expect(elements.quickStartCase.value).toBe('flux-player');
|
||||
expect(app.run).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
|
||||
it('adds the matched case option before selecting it for a new session', async () => {
|
||||
const { app, elements } = loadPaletteHarness();
|
||||
const options = [{ value: 'plex-previews' }];
|
||||
elements.quickStartCase = {
|
||||
tagName: 'SELECT',
|
||||
options,
|
||||
appendChild: vi.fn((option: any) => options.push(option)),
|
||||
get value() {
|
||||
return this._value || '';
|
||||
},
|
||||
set value(next: string) {
|
||||
this._value = options.some((option) => option.value === next) ? next : '';
|
||||
},
|
||||
};
|
||||
elements.quickStartCase.value = 'plex-previews';
|
||||
|
||||
const newSession = app.buildCommandPaletteItems('flux').find((item: any) => item.type === 'new-session');
|
||||
app.commandPaletteItems = [newSession];
|
||||
app.commandPaletteActiveIndex = 0;
|
||||
|
||||
await app.activateCommandPaletteItem();
|
||||
|
||||
expect(elements.quickStartCase.appendChild).toHaveBeenCalledTimes(1);
|
||||
expect(elements.quickStartCase.value).toBe('flux-player');
|
||||
expect(app.run).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
|
||||
it('routes the new-session case pick through selectQuickStartCase when the picker mixin is loaded', async () => {
|
||||
const { app } = loadPaletteHarness();
|
||||
app.selectQuickStartCase = vi.fn();
|
||||
|
||||
const newSession = app.buildCommandPaletteItems('flux').find((item: any) => item.type === 'new-session');
|
||||
app.commandPaletteItems = [newSession];
|
||||
app.commandPaletteActiveIndex = 0;
|
||||
await app.activateCommandPaletteItem();
|
||||
|
||||
// Keeps the searchable combobox, dir display, and lastUsedCase in sync
|
||||
// instead of silently mutating the hidden native <select>.
|
||||
expect(app.selectQuickStartCase).toHaveBeenCalledWith('flux-player');
|
||||
expect(app.run).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
|
||||
it('activates the highlighted session result', async () => {
|
||||
const { app } = loadPaletteHarness();
|
||||
app.openCommandPalette();
|
||||
app.commandPaletteItems = app.buildCommandPaletteItems('api');
|
||||
app.commandPaletteActiveIndex = 0;
|
||||
|
||||
await app.activateCommandPaletteItem();
|
||||
|
||||
expect(app.selectSession).toHaveBeenCalledWith('sess-alpha');
|
||||
expect(app.run).not.toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it('activates the new-session result through the current run path', async () => {
|
||||
const { app } = loadPaletteHarness();
|
||||
app.openCommandPalette();
|
||||
app.commandPaletteItems = app.buildCommandPaletteItems('does-not-match');
|
||||
app.commandPaletteActiveIndex = 0;
|
||||
|
||||
await app.activateCommandPaletteItem();
|
||||
|
||||
expect(app.run).toHaveBeenCalledTimes(1);
|
||||
expect(app.selectSession).not.toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it('routes Enter from the palette search to the current result', async () => {
|
||||
const { app, listeners } = loadPaletteHarness();
|
||||
app.openCommandPalette();
|
||||
app.commandPaletteItems = app.buildCommandPaletteItems('api');
|
||||
app.commandPaletteActiveIndex = 0;
|
||||
|
||||
const event = { key: 'Enter', preventDefault: vi.fn(), stopPropagation: vi.fn() };
|
||||
await listeners['search:keydown'](event);
|
||||
|
||||
expect(event.preventDefault).toHaveBeenCalledTimes(1);
|
||||
expect(app.selectSession).toHaveBeenCalledWith('sess-alpha');
|
||||
});
|
||||
});
|
||||
|
||||
describe('Session Manager unified list', () => {
|
||||
it('maps UnifiedSessionItem fields to the history-record shape and routes clicks by liveness', async () => {
|
||||
const { app, elements } = loadPaletteHarness({
|
||||
fetch: async (url: string) => {
|
||||
expect(url).toBe('/api/sessions/unified?limit=200&q=api');
|
||||
return {
|
||||
ok: true,
|
||||
status: 200,
|
||||
json: async () => ({
|
||||
success: true,
|
||||
data: {
|
||||
sessions: [
|
||||
{
|
||||
sessionId: 'sess-alpha',
|
||||
name: 'Alpha API cleanup',
|
||||
workingDir: '/repo/api',
|
||||
lastActivityAt: 1751000000000,
|
||||
sources: ['live'],
|
||||
},
|
||||
{
|
||||
sessionId: 'conv-uuid-1',
|
||||
workingDir: '/repo/old',
|
||||
sizeBytes: 2048,
|
||||
firstPrompt: 'old prompt',
|
||||
lastActivityAt: 1750000000000,
|
||||
sources: ['history'],
|
||||
},
|
||||
],
|
||||
total: 2,
|
||||
},
|
||||
}),
|
||||
};
|
||||
},
|
||||
});
|
||||
elements.sessionManagerList = { replaceChildren: vi.fn(), appendChild: vi.fn() };
|
||||
app._buildHistoryItem = vi.fn(() => ({}));
|
||||
app.resumeHistorySession = vi.fn();
|
||||
|
||||
await app._loadSessionManagerList('api');
|
||||
|
||||
expect(app._buildHistoryItem).toHaveBeenCalledTimes(2);
|
||||
const [liveRecord, , liveOptions] = app._buildHistoryItem.mock.calls[0];
|
||||
expect(liveRecord).toMatchObject({
|
||||
sessionId: 'sess-alpha',
|
||||
workingDir: '/repo/api',
|
||||
sizeBytes: 0,
|
||||
firstPrompt: 'Alpha API cleanup',
|
||||
});
|
||||
expect(new Date(liveRecord.lastModified).getTime()).toBe(1751000000000);
|
||||
expect(liveOptions.showViewAll).toBe(false);
|
||||
|
||||
// Live row → switch to the session (resuming it would spawn a duplicate).
|
||||
liveOptions.onActivate();
|
||||
expect(app.selectSession).toHaveBeenCalledWith('sess-alpha');
|
||||
expect(app.resumeHistorySession).not.toHaveBeenCalled();
|
||||
|
||||
// History row → resume by conversation UUID.
|
||||
const [historyRecord, , historyOptions] = app._buildHistoryItem.mock.calls[1];
|
||||
expect(historyRecord).toMatchObject({ sessionId: 'conv-uuid-1', sizeBytes: 2048, firstPrompt: 'old prompt' });
|
||||
historyOptions.onActivate();
|
||||
expect(app.resumeHistorySession).toHaveBeenCalledWith('conv-uuid-1', '/repo/old');
|
||||
});
|
||||
|
||||
it('surfaces an error message instead of an empty list when the endpoint fails', async () => {
|
||||
const appended: any[] = [];
|
||||
const { app, elements } = loadPaletteHarness({
|
||||
fetch: async () => ({
|
||||
ok: false,
|
||||
status: 503,
|
||||
json: async () => ({ success: false, error: 'unified list unavailable', errorCode: 'OPERATION_FAILED' }),
|
||||
}),
|
||||
});
|
||||
elements.sessionManagerList = { replaceChildren: vi.fn(), appendChild: (el: any) => appended.push(el) };
|
||||
|
||||
await app._loadSessionManagerList('');
|
||||
|
||||
expect(appended).toHaveLength(1);
|
||||
expect(appended[0].textContent).toBe('unified list unavailable');
|
||||
expect(appended[0].textContent).not.toBe('No sessions found');
|
||||
});
|
||||
});
|
||||
|
||||
describe('panel close helpers', () => {
|
||||
it('closes panels when the mobile header helper is unavailable', () => {
|
||||
const CodemanApp = function CodemanApp(this: any) {};
|
||||
const elements: Record<string, any> = {
|
||||
monitorPanel: { classList: { remove: vi.fn() } },
|
||||
subagentsPanel: { classList: { remove: vi.fn() } },
|
||||
};
|
||||
const context = vm.createContext({
|
||||
CodemanApp,
|
||||
document: {
|
||||
getElementById: (id: string) => elements[id] ?? null,
|
||||
},
|
||||
console,
|
||||
});
|
||||
|
||||
const settingsUi = readFileSync(resolve(import.meta.dirname, '../src/web/public/settings-ui.js'), 'utf8');
|
||||
vm.runInContext(settingsUi, context, { filename: 'settings-ui.js' });
|
||||
|
||||
const app = new (CodemanApp as any)();
|
||||
app.closeSessionOptions = vi.fn();
|
||||
app.closeAppSettings = vi.fn();
|
||||
app.cancelCloseSession = vi.fn();
|
||||
app.closeTokenStats = vi.fn();
|
||||
|
||||
expect(() => app.closeAllPanels()).not.toThrow();
|
||||
expect(elements.monitorPanel.classList.remove).toHaveBeenCalledWith('open');
|
||||
expect(elements.subagentsPanel.classList.remove).toHaveBeenCalledWith('open');
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,68 @@
|
||||
import { readFileSync } from 'node:fs';
|
||||
import { join } from 'node:path';
|
||||
import { describe, expect, it } from 'vitest';
|
||||
|
||||
const INDEX_HTML = readFileSync(join(process.cwd(), 'src/web/public/index.html'), 'utf-8');
|
||||
|
||||
function normalizedHtml(value: string): string {
|
||||
return value.replace(/\s+/g, ' ');
|
||||
}
|
||||
|
||||
function extractElementById(html: string, id: string): string {
|
||||
const idIndex = html.indexOf(`id="${id}"`);
|
||||
expect(idIndex, `expected #${id} to exist`).toBeGreaterThanOrEqual(0);
|
||||
|
||||
const start = html.lastIndexOf('<', idIndex);
|
||||
expect(start, `expected #${id} start tag`).toBeGreaterThanOrEqual(0);
|
||||
|
||||
const nextSection = html.indexOf('<!-- Monitor Panel', idIndex);
|
||||
expect(nextSection, `expected section marker after #${id}`).toBeGreaterThanOrEqual(0);
|
||||
|
||||
const end = nextSection;
|
||||
return html.slice(start, end);
|
||||
}
|
||||
|
||||
function escapeRegExp(value: string): string {
|
||||
return value.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
|
||||
}
|
||||
|
||||
function expectShortcut(html: string, keys: string[], label: string): void {
|
||||
const keyPattern = keys.map((key) => `<kbd>${escapeRegExp(key)}</kbd>`).join('\\s*\\+\\s*');
|
||||
expect(html).toMatch(new RegExp(`${keyPattern}.*?${label}`, 'i'));
|
||||
}
|
||||
|
||||
describe('help modal shortcuts', () => {
|
||||
const helpModal = normalizedHtml(extractElementById(INDEX_HTML, 'helpModal'));
|
||||
|
||||
it('documents implemented global and tab shortcuts', () => {
|
||||
expectShortcut(helpModal, ['Ctrl', 'W'], 'Close Session');
|
||||
expectShortcut(helpModal, ['Ctrl', 'Tab'], 'Next Session');
|
||||
expectShortcut(helpModal, ['Alt/Option', '['], 'Previous / Next Session');
|
||||
expectShortcut(helpModal, ['Alt/Option', ']'], 'Previous / Next Session');
|
||||
expectShortcut(helpModal, ['Alt/Option', '1-9'], 'Switch to Tab N');
|
||||
expectShortcut(helpModal, ['Ctrl', '{'], 'Move Active Tab Left');
|
||||
expectShortcut(helpModal, ['Ctrl', '}'], 'Move Active Tab Right');
|
||||
expectShortcut(helpModal, ['Ctrl', '?'], 'Show Shortcuts');
|
||||
expect(helpModal).not.toMatch(/Ctrl<\/kbd>\s*\+\s*<kbd>\/<\/kbd>.*?Show Shortcuts/i);
|
||||
expectShortcut(helpModal, ['Ctrl', 'Shift', 'V'], 'Voice Input');
|
||||
expectShortcut(helpModal, ['Escape'], 'Close Panels');
|
||||
});
|
||||
|
||||
it('documents terminal input shortcuts without advertising stale run shortcuts', () => {
|
||||
expectShortcut(helpModal, ['Ctrl', 'L'], 'Clear Terminal');
|
||||
expectShortcut(helpModal, ['Ctrl', '+'], 'Increase Font');
|
||||
expectShortcut(helpModal, ['Ctrl', '-'], 'Decrease Font');
|
||||
expectShortcut(helpModal, ['Shift', 'Enter'], 'Insert Newline');
|
||||
expectShortcut(helpModal, ['Ctrl', 'Enter'], 'Insert Newline');
|
||||
// Ctrl+Shift+R (restore terminal size) is still dispatched — keep it documented.
|
||||
expectShortcut(helpModal, ['Ctrl', 'Shift', 'R'], 'Restore Terminal Size');
|
||||
|
||||
expect(helpModal).not.toMatch(/Ctrl<\/kbd>\s*\+\s*<kbd>K<\/kbd>/i);
|
||||
expect(helpModal).not.toMatch(/Ctrl<\/kbd>\s*\+\s*<kbd>Enter<\/kbd>.*?(Run|Start)/i);
|
||||
});
|
||||
|
||||
it('does not advertise the removed Ctrl+Enter run binding in launch UI hints', () => {
|
||||
expect(INDEX_HTML).not.toContain('Or press <kbd>Ctrl</kbd>+<kbd>Enter</kbd> to start');
|
||||
expect(INDEX_HTML).not.toContain('title="Run (Ctrl+Enter)"');
|
||||
});
|
||||
});
|
||||
@@ -24,7 +24,7 @@ describe('keyboard shortcuts', () => {
|
||||
// terminal-ui.js must gate its xterm pass-through on the SAME physical e.code set the
|
||||
// app.js handler consumes; otherwise Alt+[ / Alt+] (and Option+digit on remapped macOS
|
||||
// layouts) switch tabs AND inject ESC<char> into the focused terminal. Keep in sync.
|
||||
expect(terminalUiSource).toContain('/^(Digit[1-9]|BracketLeft|BracketRight)$/.test(ev.code');
|
||||
expect(terminalUiSource).toContain('/^(Digit[1-9]|BracketLeft|BracketRight|KeyK)$/.test(ev.code');
|
||||
});
|
||||
|
||||
it('documents the Alt/Option shortcuts in help and README', () => {
|
||||
@@ -34,4 +34,28 @@ describe('keyboard shortcuts', () => {
|
||||
expect(readme).toContain('`Alt/Option+[` / `Alt/Option+]`');
|
||||
expect(readme).toContain('`Alt/Option+1`-`Alt/Option+9`');
|
||||
});
|
||||
|
||||
it('documents the Command-K open-session palette in help and README', () => {
|
||||
expect(appSource).toContain('this.openCommandPalette()');
|
||||
expect(helpHtml).toContain('<kbd>Ctrl/Cmd/Option</kbd>+<kbd>K</kbd>');
|
||||
expect(readme).toMatch(/\| `Ctrl\/Cmd\/Option\+K`\s+\| Find open session or start a new one\s+\|/);
|
||||
});
|
||||
|
||||
it('gates the palette chord in the xterm custom key handler (no 0x0b kill-line into the PTY)', () => {
|
||||
// The document-level capture handler opens the palette, but preventDefault()
|
||||
// does NOT stop xterm from evaluating Ctrl+K into 0x0b and writing it to the
|
||||
// live PTY — terminal-ui.js must return false for the palette chord.
|
||||
expect(terminalUiSource).toMatch(/ev\.type === 'keydown' && this\.shouldOpenCommandPaletteFromShortcut\?\.\(ev\)/);
|
||||
});
|
||||
|
||||
it('dispatches document shortcuts through the shortcut registry (rebind/disable aware)', () => {
|
||||
// The legacy hardcoded SHORTCUTS table must stay gone — dispatch goes through
|
||||
// getShortcutRegistry() + matchesShortcutEvent() so overrides and per-shortcut
|
||||
// disables (App Settings → Shortcuts) actually take effect.
|
||||
expect(appSource).not.toContain('const SHORTCUTS = [');
|
||||
expect(appSource).toContain('const SHORTCUT_ACTIONS = {');
|
||||
expect(appSource).toContain('for (const shortcut of this.getShortcutRegistry())');
|
||||
expect(appSource).toContain('if (this.matchesShortcutEvent(e, shortcut))');
|
||||
expect(appSource).toContain('if (shortcut.disabled || !shortcut.action) continue;');
|
||||
});
|
||||
});
|
||||
|
||||
@@ -144,6 +144,233 @@ describe('Codex quick start settings', () => {
|
||||
});
|
||||
});
|
||||
|
||||
describe('case selector refresh', () => {
|
||||
it('sorts case picker options alphabetically and filters by case or host label', () => {
|
||||
const CodemanApp = function CodemanApp(this: any) {};
|
||||
const context = vm.createContext({
|
||||
CodemanApp,
|
||||
localStorage: { getItem: () => null, setItem: () => {} },
|
||||
document: { getElementById: () => null },
|
||||
console,
|
||||
});
|
||||
|
||||
const sessionUi = readFileSync(resolve(import.meta.dirname, '../src/web/public/session-ui.js'), 'utf8');
|
||||
vm.runInContext(sessionUi, context, { filename: 'session-ui.js' });
|
||||
|
||||
const app = new (CodemanApp as any)();
|
||||
const cases = [
|
||||
{ name: 'zeta' },
|
||||
{ name: 'moneytrove', location: 'remote', remote: { hostId: 'mac-mini', path: '/Users/saqeb/moneytrove' } },
|
||||
{ name: 'Alpha' },
|
||||
{ name: 'plex-previews' },
|
||||
];
|
||||
|
||||
const options = app.buildCasePickerOptions(cases);
|
||||
|
||||
expect(options.map((option: any) => option.name)).toEqual([
|
||||
'Alpha',
|
||||
'moneytrove',
|
||||
'plex-previews',
|
||||
'testcase',
|
||||
'zeta',
|
||||
]);
|
||||
expect(options.find((option: any) => option.name === 'moneytrove')?.label).toBe('moneytrove @ mac-mini');
|
||||
expect(app.filterCasePickerOptions(options, 'MAC').map((option: any) => option.name)).toEqual(['moneytrove']);
|
||||
expect(app.filterCasePickerOptions(options, 'plex').map((option: any) => option.name)).toEqual(['plex-previews']);
|
||||
});
|
||||
|
||||
it('launches the highlighted case with the current run mode when pressing Enter in the picker', () => {
|
||||
const elements: Record<string, any> = {};
|
||||
const listeners: Record<string, (event: any) => void> = {};
|
||||
const CodemanApp = function CodemanApp(this: any) {};
|
||||
|
||||
elements.quickStartCase = {
|
||||
value: 'Alpha',
|
||||
dataset: {},
|
||||
};
|
||||
elements.quickStartCaseSearch = {
|
||||
value: 'mon',
|
||||
dataset: {},
|
||||
setAttribute: vi.fn(),
|
||||
removeAttribute: vi.fn(),
|
||||
addEventListener: vi.fn((event: string, handler: (event: any) => void) => {
|
||||
listeners[event] = handler;
|
||||
}),
|
||||
select: vi.fn(),
|
||||
};
|
||||
elements.quickStartCaseList = {
|
||||
innerHTML: '',
|
||||
classList: { add: vi.fn(), remove: vi.fn() },
|
||||
addEventListener: vi.fn(),
|
||||
};
|
||||
elements.quickStartCasePicker = {
|
||||
contains: () => true,
|
||||
};
|
||||
|
||||
const context = vm.createContext({
|
||||
CodemanApp,
|
||||
localStorage: { getItem: () => null, setItem: () => {} },
|
||||
document: {
|
||||
getElementById: (id: string) => elements[id] ?? null,
|
||||
addEventListener: vi.fn(),
|
||||
},
|
||||
console,
|
||||
escapeHtml: (s: string) => s,
|
||||
});
|
||||
|
||||
const sessionUi = readFileSync(resolve(import.meta.dirname, '../src/web/public/session-ui.js'), 'utf8');
|
||||
vm.runInContext(sessionUi, context, { filename: 'session-ui.js' });
|
||||
|
||||
const app = new (CodemanApp as any)();
|
||||
app.cases = [
|
||||
{ name: 'Alpha' },
|
||||
{ name: 'moneytrove', location: 'remote', remote: { hostId: 'mac-mini', path: '/Users/saqeb/moneytrove' } },
|
||||
{ name: 'zeta' },
|
||||
];
|
||||
app.updateDirDisplayForCase = vi.fn();
|
||||
app.updateMobileCaseLabel = vi.fn();
|
||||
app.saveLastUsedCase = vi.fn();
|
||||
app.run = vi.fn(async () => {});
|
||||
|
||||
app.setupQuickStartCasePicker();
|
||||
listeners.keydown({ key: 'Enter', preventDefault: vi.fn() });
|
||||
|
||||
expect(elements.quickStartCase.value).toBe('moneytrove');
|
||||
expect(app.run).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
|
||||
it('creates remote shell sessions by caseName instead of remote display path', async () => {
|
||||
const elements: Record<string, any> = {
|
||||
quickStartCase: { value: 'gpu-work' },
|
||||
shellCount: { value: '1' },
|
||||
};
|
||||
const requests: Array<{ url: string; body?: any }> = [];
|
||||
const CodemanApp = function CodemanApp(this: any) {};
|
||||
|
||||
const context = vm.createContext({
|
||||
CodemanApp,
|
||||
localStorage: {
|
||||
getItem: () => null,
|
||||
setItem: () => {},
|
||||
},
|
||||
document: {
|
||||
getElementById: (id: string) => elements[id] ?? null,
|
||||
},
|
||||
fetch: async (url: string, init?: { body?: string }) => {
|
||||
requests.push({ url, body: init?.body ? JSON.parse(init.body) : undefined });
|
||||
if (url === '/api/cases/gpu-work') {
|
||||
return {
|
||||
json: async () => ({
|
||||
success: true,
|
||||
data: {
|
||||
name: 'gpu-work',
|
||||
path: 'ubuntu@10.0.0.42:/home/ubuntu/work',
|
||||
location: 'remote',
|
||||
remote: { hostId: 'gpu-box', path: '/home/ubuntu/work' },
|
||||
},
|
||||
}),
|
||||
};
|
||||
}
|
||||
if (url === '/api/sessions') {
|
||||
return { json: async () => ({ success: true, data: { session: { id: 'sess-1' } } }) };
|
||||
}
|
||||
if (url === '/api/sessions/sess-1/shell') return { json: async () => ({ success: true }) };
|
||||
throw new Error(`unexpected fetch: ${url}`);
|
||||
},
|
||||
console,
|
||||
});
|
||||
|
||||
const sessionUi = readFileSync(resolve(import.meta.dirname, '../src/web/public/session-ui.js'), 'utf8');
|
||||
vm.runInContext(sessionUi, context, { filename: 'session-ui.js' });
|
||||
|
||||
const app = new (CodemanApp as any)();
|
||||
app.terminal = { clear: () => {}, writeln: () => {}, focus: () => {} };
|
||||
app.sessions = new Map();
|
||||
app.cases = [{ name: 'gpu-work', path: 'ubuntu@10.0.0.42:/home/ubuntu/work', location: 'remote' }];
|
||||
app.getTerminalDimensions = () => null;
|
||||
app.selectSession = async () => {};
|
||||
|
||||
await app.runShell();
|
||||
|
||||
expect(requests.find((req) => req.url === '/api/sessions')?.body).toMatchObject({
|
||||
caseName: 'gpu-work',
|
||||
mode: 'shell',
|
||||
});
|
||||
expect(requests.find((req) => req.url === '/api/sessions')?.body).not.toHaveProperty('workingDir');
|
||||
});
|
||||
|
||||
it('removes a deleted selected case from the dropdown and blurs the native picker', async () => {
|
||||
const elements: Record<string, any> = {};
|
||||
const requests: Array<{ url: string; method: string; body?: any }> = [];
|
||||
const CodemanApp = function CodemanApp(this: any) {};
|
||||
const quickStartCase = {
|
||||
value: 'deleted-case',
|
||||
innerHTML: '<option value="deleted-case">deleted-case</option><option value="kept-case">kept-case</option>',
|
||||
dataset: {},
|
||||
blur: vi.fn(),
|
||||
addEventListener: vi.fn(),
|
||||
};
|
||||
|
||||
elements.quickStartCase = quickStartCase;
|
||||
elements.caseManageList = { innerHTML: '' };
|
||||
elements.mobileCaseName = { textContent: '' };
|
||||
elements.dirDisplay = { textContent: '' };
|
||||
elements.dirInput = { value: '' };
|
||||
|
||||
const context = vm.createContext({
|
||||
CodemanApp,
|
||||
MobileDetection: { getDeviceType: () => 'desktop' },
|
||||
localStorage: {
|
||||
getItem: () => null,
|
||||
setItem: () => {},
|
||||
},
|
||||
document: {
|
||||
getElementById: (id: string) => elements[id] ?? null,
|
||||
},
|
||||
confirm: () => true,
|
||||
fetch: async (url: string, init?: { method?: string; body?: string }) => {
|
||||
requests.push({ url, method: init?.method ?? 'GET', body: init?.body ? JSON.parse(init.body) : undefined });
|
||||
if (url === '/api/cases/deleted-case')
|
||||
return { json: async () => ({ success: true, data: { name: 'deleted-case' } }) };
|
||||
// The server's preSerialization hook wraps bare payloads as { success, data },
|
||||
// so the frontend reads `.data` off every JSON response — mirror that here.
|
||||
if (url === '/api/settings')
|
||||
return { ok: true, json: async () => ({ success: true, data: { lastUsedCase: 'deleted-case' } }) };
|
||||
if (url === '/api/cases')
|
||||
return { json: async () => ({ success: true, data: [{ name: 'kept-case', path: '/tmp/kept-case' }] }) };
|
||||
if (url === '/api/cases/kept-case')
|
||||
return { json: async () => ({ success: true, data: { path: '/tmp/kept-case' } }) };
|
||||
if (url === '/api/settings' && init?.method === 'PUT') return { json: async () => ({ success: true }) };
|
||||
throw new Error(`unexpected fetch: ${url}`);
|
||||
},
|
||||
console,
|
||||
escapeHtml: (s: string) => s,
|
||||
});
|
||||
|
||||
const sessionUi = readFileSync(resolve(import.meta.dirname, '../src/web/public/session-ui.js'), 'utf8');
|
||||
vm.runInContext(sessionUi, context, { filename: 'session-ui.js' });
|
||||
|
||||
const app = new (CodemanApp as any)();
|
||||
app.cases = [
|
||||
{ name: 'deleted-case', path: '/tmp/deleted-case' },
|
||||
{ name: 'kept-case', path: '/tmp/kept-case' },
|
||||
];
|
||||
app.showToast = vi.fn();
|
||||
|
||||
await app.deleteCase('deleted-case');
|
||||
|
||||
expect(quickStartCase.blur).toHaveBeenCalled();
|
||||
expect(quickStartCase.innerHTML).not.toContain('deleted-case');
|
||||
expect(quickStartCase.innerHTML).toContain('kept-case');
|
||||
expect(elements.mobileCaseName.textContent).toBe('kept-case');
|
||||
expect(requests).toContainEqual({
|
||||
url: '/api/settings',
|
||||
method: 'PUT',
|
||||
body: { lastUsedCase: 'kept-case' },
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('Gemini quick start', () => {
|
||||
// Regression guard for the ApiResponse-envelope unwrap in runGemini(): the
|
||||
// status check must read `.data.available` and the quick-start response must
|
||||
|
||||
@@ -0,0 +1,232 @@
|
||||
import { readFileSync } from 'node:fs';
|
||||
import { resolve } from 'node:path';
|
||||
import vm from 'node:vm';
|
||||
import { describe, expect, it, vi } from 'vitest';
|
||||
|
||||
const appSource = readFileSync('src/web/public/app.js', 'utf8');
|
||||
const settingsSource = readFileSync('src/web/public/settings-ui.js', 'utf8');
|
||||
const htmlSource = readFileSync('src/web/public/index.html', 'utf8');
|
||||
|
||||
describe('shortcut registry and overlay', () => {
|
||||
it('defines shortcut metadata that can be overridden from global settings', () => {
|
||||
expect(appSource).toContain('const DEFAULT_SHORTCUTS = [');
|
||||
expect(appSource).toContain('shortcutOverrides');
|
||||
expect(appSource).toContain('getShortcutRegistry()');
|
||||
expect(appSource).toContain('matchesShortcutEvent(e, shortcut)');
|
||||
});
|
||||
|
||||
it('renders a shortcut overlay modal from the registry', () => {
|
||||
expect(htmlSource).toContain('id="shortcutOverlayModal"');
|
||||
expect(htmlSource).toContain('id="shortcutOverlayList"');
|
||||
expect(appSource).toContain('showShortcutOverlay()');
|
||||
expect(appSource).toContain('renderShortcutOverlay()');
|
||||
expect(appSource).toContain('closeShortcutOverlay()');
|
||||
});
|
||||
|
||||
it('adds Ctrl/Option question-mark bindings for the overlay', () => {
|
||||
expect(appSource).toContain("id: 'show-shortcuts'");
|
||||
expect(appSource).toContain("modifiers: ['ctrl']");
|
||||
expect(appSource).toContain("modifiers: ['alt']");
|
||||
expect(appSource).toContain("key: '?'");
|
||||
expect(appSource).toContain("code: 'Slash'");
|
||||
expect(appSource).not.toContain("key: '/'");
|
||||
});
|
||||
|
||||
it('exposes shortcut overrides in a dedicated App Settings shortcuts tab', () => {
|
||||
expect(htmlSource).toContain('data-tab="settings-shortcuts"');
|
||||
expect(htmlSource).toContain('id="settings-shortcuts"');
|
||||
expect(htmlSource).toContain('id="appSettingsShortcutsList"');
|
||||
expect(htmlSource).not.toContain('id="appSettingsShortcutOverrides"');
|
||||
expect(htmlSource).not.toContain('Shortcut Overrides</span>');
|
||||
expect(settingsSource).toContain('renderShortcutSettingsList');
|
||||
expect(settingsSource).toContain('readShortcutOverridesFromSettings');
|
||||
expect(settingsSource).toContain('startShortcutCapture');
|
||||
expect(settingsSource).toContain('onShortcutCaptureKeydown');
|
||||
expect(settingsSource).toContain('settings.shortcutOverrides');
|
||||
});
|
||||
|
||||
it('renders shortcut rows with capture, typed input, reset, and disable controls', () => {
|
||||
expect(settingsSource).toContain('shortcut-setting-row');
|
||||
expect(settingsSource).toContain('shortcut-capture-btn');
|
||||
expect(settingsSource).toContain('shortcut-binding-input');
|
||||
expect(settingsSource).toContain('shortcut-reset-btn');
|
||||
expect(settingsSource).toContain('shortcut-enabled-checkbox');
|
||||
});
|
||||
|
||||
it('styles the shortcut settings rows and overlay (no unstyled tab)', () => {
|
||||
const css = readFileSync('src/web/public/styles.css', 'utf8');
|
||||
expect(css).toContain('.shortcut-setting-row {');
|
||||
expect(css).toContain('.shortcut-capture-btn,');
|
||||
expect(css).toContain('.shortcut-overlay-row {');
|
||||
});
|
||||
|
||||
it('saveAppSettings preserves shortcutOverrides (rebuilt-from-DOM saves must not wipe them)', () => {
|
||||
// Same trap as showTokenCount/showCost: saveAppSettings() rebuilds the settings
|
||||
// object fresh from the DOM, so keys edited elsewhere (the Shortcuts tab) must be
|
||||
// explicitly carried over from the previously stored blob.
|
||||
expect(settingsSource).toContain(
|
||||
'if (_prev.shortcutOverrides !== undefined) settings.shortcutOverrides = _prev.shortcutOverrides;'
|
||||
);
|
||||
});
|
||||
|
||||
it('keeps the full help modal reachable now that Ctrl+? opens the registry overlay', () => {
|
||||
// The legacy #helpModal (full shortcut reference) lost its only opener when
|
||||
// Ctrl+? was rerouted to the overlay; the overlay footer must link to it.
|
||||
expect(htmlSource).toContain('shortcut-overlay-footer');
|
||||
expect(htmlSource).toContain('app.closeShortcutOverlay(); app.showHelp()');
|
||||
});
|
||||
});
|
||||
|
||||
// ─── Functional coverage (vm-sandbox harness, mirrors run-mode-ui.test.ts) ────
|
||||
// The grep assertions above pin the wiring; these exercise the actual
|
||||
// persistence round-trip and capture flow that were broken in review.
|
||||
|
||||
function makeLocalStorage() {
|
||||
const store = new Map<string, string>();
|
||||
return {
|
||||
getItem: (k: string) => (store.has(k) ? store.get(k)! : null),
|
||||
setItem: (k: string, v: string) => void store.set(k, String(v)),
|
||||
removeItem: (k: string) => void store.delete(k),
|
||||
key: (i: number) => [...store.keys()][i] ?? null,
|
||||
get length() {
|
||||
return store.size;
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
function loadSettingsHarness() {
|
||||
const CodemanApp = function CodemanApp(this: any) {};
|
||||
const localStorage = makeLocalStorage();
|
||||
const elements: Record<string, any> = {};
|
||||
const holder: { queryResult: any } = { queryResult: null };
|
||||
const context = vm.createContext({
|
||||
CodemanApp,
|
||||
MobileDetection: { getDeviceType: () => 'desktop', isMobile: () => false, isTouchDevice: () => false },
|
||||
localStorage,
|
||||
document: {
|
||||
getElementById: (id: string) => elements[id] ?? null,
|
||||
querySelector: () => holder.queryResult,
|
||||
},
|
||||
console,
|
||||
escapeHtml: (s: string) => String(s),
|
||||
});
|
||||
|
||||
const settingsUi = readFileSync(resolve(import.meta.dirname, '../src/web/public/settings-ui.js'), 'utf8');
|
||||
vm.runInContext(settingsUi, context, { filename: 'settings-ui.js' });
|
||||
|
||||
const app = new (CodemanApp as any)();
|
||||
return { app, localStorage, elements, holder };
|
||||
}
|
||||
|
||||
describe('shortcut settings persistence and capture', () => {
|
||||
it('persists overrides under the app-settings storage key and round-trips through the cache', () => {
|
||||
const { app, localStorage } = loadSettingsHarness();
|
||||
|
||||
app.toggleShortcutEnabled('close-session', false);
|
||||
|
||||
// Written to the SAME key loadAppSettingsFromStorage() reads (NOT the
|
||||
// legacy 'codeman:settings' key), and the in-memory cache stays coherent.
|
||||
const raw = localStorage.getItem('codeman-app-settings');
|
||||
expect(raw).toBeTruthy();
|
||||
expect(JSON.parse(raw!).shortcutOverrides['close-session']).toMatchObject({ disabled: true });
|
||||
expect(localStorage.getItem('codeman:settings')).toBeNull();
|
||||
expect(app.readShortcutOverridesFromSettings()['close-session']).toMatchObject({ disabled: true });
|
||||
|
||||
app.resetShortcutOverride('close-session');
|
||||
const after = JSON.parse(localStorage.getItem('codeman-app-settings')!);
|
||||
expect(after.shortcutOverrides['close-session']).toBeUndefined();
|
||||
expect(app.readShortcutOverridesFromSettings()['close-session']).toBeUndefined();
|
||||
});
|
||||
|
||||
it('captures multi-modifier combos: bare modifier keydowns do not end the capture', () => {
|
||||
const { app, localStorage, holder } = loadSettingsHarness();
|
||||
const listeners: Array<(e: any) => void> = [];
|
||||
const input = {
|
||||
value: '',
|
||||
focus: vi.fn(),
|
||||
addEventListener: vi.fn((_ev: string, fn: (e: any) => void) => listeners.push(fn)),
|
||||
removeEventListener: vi.fn(),
|
||||
};
|
||||
holder.queryResult = input;
|
||||
|
||||
app.startShortcutCapture('clear-terminal');
|
||||
expect(input.value).toBe('Press keys…');
|
||||
const handler = listeners[0];
|
||||
|
||||
// First keydown of Ctrl+Shift+P is 'Control' — must not finalize.
|
||||
handler({ key: 'Control', ctrlKey: true, preventDefault: vi.fn(), stopPropagation: vi.fn() });
|
||||
expect(input.removeEventListener).not.toHaveBeenCalled();
|
||||
|
||||
handler({
|
||||
key: 'P',
|
||||
code: 'KeyP',
|
||||
ctrlKey: true,
|
||||
shiftKey: true,
|
||||
preventDefault: vi.fn(),
|
||||
stopPropagation: vi.fn(),
|
||||
});
|
||||
expect(input.removeEventListener).toHaveBeenCalledTimes(1);
|
||||
const stored = JSON.parse(localStorage.getItem('codeman-app-settings')!);
|
||||
expect(stored.shortcutOverrides['clear-terminal'].bindings[0]).toMatchObject({
|
||||
modifiers: ['ctrl', 'shift'],
|
||||
key: 'P',
|
||||
code: 'KeyP',
|
||||
});
|
||||
});
|
||||
|
||||
it('rejects captures without a Ctrl/Cmd/Alt modifier (a bare key would fire while typing)', () => {
|
||||
const { app, localStorage, holder } = loadSettingsHarness();
|
||||
const listeners: Array<(e: any) => void> = [];
|
||||
holder.queryResult = {
|
||||
value: '',
|
||||
focus: vi.fn(),
|
||||
addEventListener: vi.fn((_ev: string, fn: (e: any) => void) => listeners.push(fn)),
|
||||
removeEventListener: vi.fn(),
|
||||
};
|
||||
app.showToast = vi.fn();
|
||||
|
||||
app.startShortcutCapture('clear-terminal');
|
||||
listeners[0]({ key: 'x', code: 'KeyX', preventDefault: vi.fn(), stopPropagation: vi.fn() });
|
||||
|
||||
expect(localStorage.getItem('codeman-app-settings')).toBeNull();
|
||||
expect(app.showToast).toHaveBeenCalledWith('Shortcut must include Ctrl, Cmd, or Alt', 'error');
|
||||
});
|
||||
|
||||
it('renders the shortcuts list when the Shortcuts settings tab is opened', () => {
|
||||
const { app, elements } = loadSettingsHarness();
|
||||
elements.appSettingsModal = { querySelectorAll: () => [] };
|
||||
app.renderShortcutSettingsList = vi.fn();
|
||||
|
||||
app.switchSettingsTab('settings-shortcuts');
|
||||
expect(app.renderShortcutSettingsList).toHaveBeenCalledTimes(1);
|
||||
|
||||
app.switchSettingsTab('settings-display');
|
||||
expect(app.renderShortcutSettingsList).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
|
||||
it('renders configurable rows with delegated controls (no inline onclick) and fixed rows read-only', () => {
|
||||
const { app, elements } = loadSettingsHarness();
|
||||
const list: any = { innerHTML: '', dataset: {}, addEventListener: vi.fn() };
|
||||
elements.appSettingsShortcutsList = list;
|
||||
app.getShortcutRegistry = () => [
|
||||
{
|
||||
id: 'clear-terminal',
|
||||
group: 'Terminal',
|
||||
label: 'Clear Terminal',
|
||||
bindings: [{ modifiers: ['ctrl'], key: 'l' }],
|
||||
action: 'clearTerminal',
|
||||
},
|
||||
{ id: 'close-panels', group: 'Panels', label: 'Close Panels', displayBindings: ['Escape'] },
|
||||
];
|
||||
|
||||
app.renderShortcutSettingsList();
|
||||
|
||||
expect(list.innerHTML).not.toContain('onclick=');
|
||||
expect((list.innerHTML.match(/shortcut-capture-btn/g) || []).length).toBe(1);
|
||||
expect(list.innerHTML).toContain('shortcut-setting-row--fixed');
|
||||
// Delegated listeners wired exactly once.
|
||||
expect(list.addEventListener).toHaveBeenCalledTimes(2);
|
||||
app.renderShortcutSettingsList();
|
||||
expect(list.addEventListener).toHaveBeenCalledTimes(2);
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user