@webship.co/workspace 1.0.0-alpha1 → 1.0.0-beta2

package/core/workspace-app/tests/unit/rows-add-modal.test.js

@@ -0,0 +1,68 @@
+/**
+ * Add a row and add a button, in the dashboard's one modal.
+ *
+ * Both were controls at the bottom of a very long form — the add-a-button one carried eight fields there. In the modal
+ * they have to keep two properties the inline versions got for free by sitting inside the rows form: the unsaved
+ * arrangement travels with the write (a drag not yet saved is part of what the layout should become), and the editor
+ * behind the modal is what answers.
+ */
+
+const assert = require('node:assert');
+const { test } = require('node:test');
+const fs = require('fs');
+const os = require('os');
+const path = require('path');
+
+const tmp = fs.mkdtempSync(path.join(os.tmpdir(), 'rowsmodal-'));
+process.env.ROW_ACTIONS_FILE = path.join(tmp, 'row-actions.yml');
+process.env.ROW_ACTIONS_SEEN_FILE = path.join(tmp, 'row-actions.seen.json');
+process.env.ROW_ACTIONS_HISTORY_FILE = path.join(tmp, 'row-actions.history.jsonl');
+process.on('exit', () => fs.rmSync(tmp, { recursive: true, force: true }));
+
+const rl = require('../../row-layout');
+const APP = path.join(__dirname, '..', '..');
+
+test('the editor opens both in the modal, and nothing is left inline', () => {
+  const html = rl.rowActionsEditorHtml();
+  assert.match(html, /hx-get="\/fragments\/row\/add-row"[\s\S]{0,120}hx-target="#editor-modal-body"/);
+  assert.match(html, /hx-get="\/fragments\/row\/add-button"[\s\S]{0,120}hx-target="#editor-modal-body"/);
+  assert.doesNotMatch(html, /for_button":"__new__/, 'the add-a-button form is no longer in the page');
+});
+
+test('both forms carry the rows form, so an unsaved arrangement is not lost', () => {
+  const row = rl.addRowFormHtml();
+  assert.match(row, /hx-post="\/actions\/row-rows"/);
+  assert.match(row, /hx-include="#row-arrange-form"/);
+  assert.match(row, /hx-vals='\{"op":"add","pane":"0","mtime":"[0-9.]+"\}'/, 'and the mtime it was drawn with');
+  assert.match(row, /hx-target="#row-actions-editor" hx-swap="outerHTML"/);
+
+  const button = rl.addButtonFormHtml();
+  assert.match(button, /hx-post="\/actions\/row-custom-add"/);
+  assert.match(button, /hx-include="#row-arrange-form, closest \.row-add-action"/);
+  assert.match(button, /name="add_button_new"/, 'it still names the button');
+  assert.match(button, /name="add_label_new"/);
+  assert.match(button, /hx-target="#row-actions-editor" hx-swap="outerHTML"/);
+});
+
+test('a full set of rows says so instead of offering a button that would be refused', () => {
+  const rows = Array.from({ length: rl.MAX_ROWS }, () => []);
+  rl.saveRowLayout(rl.normalizeLayout({ rows }), '');
+  const html = rl.addRowFormHtml();
+  assert.match(html, new RegExp(`All ${rl.MAX_ROWS} rows are in use`));
+  assert.doesNotMatch(html, /hx-post="\/actions\/row-rows"/);
+  rl.resetRowLayout('');
+});
+
+test('the fragments are served, and the modal closes on the event that names what was swapped', () => {
+  const src = fs.readFileSync(path.join(APP, 'server.js'), 'utf8');
+  assert.match(src, /pathname === '\/fragments\/row\/add-row' \|\| pathname === '\/fragments\/row\/add-button'/);
+  assert.match(src, /rowLayout\.addRowFormHtml\(\) : rowLayout\.addButtonFormHtml\(\)/);
+
+  const ui = fs.readFileSync(path.join(APP, 'public', 'ui.js'), 'utf8');
+  const at = ui.indexOf("e.target.id !== 'row-actions-editor'");
+  assert.ok(at > 0, 'nothing closes the modal when the editor comes back');
+  const handler = ui.slice(ui.lastIndexOf('document.body.addEventListener', at), ui.indexOf('});', at));
+  assert.match(handler, /htmx:after:settle/, "after:swap names the element that MADE the request in htmx 4, not the swapped one");
+  assert.match(handler, /UIkit\.modal\('#editor-modal'\)\.hide\(\)/);
+  assert.doesNotMatch(rl.addRowFormHtml(), /event\.detail\.successful/, 'that flag does not exist in htmx 4');
+});

package/core/workspace-app/tests/unit/screen-runner-queue.test.js

@@ -0,0 +1,41 @@
+/**
+ * The host screen runner's request queue (scripts/screen-runner.js). The queue is drained on a poll and on
+ * every folder-watch event, and one new file fires the watch more than once, so two drains could read the
+ * same request before its unlink landed: a burst of 12 start requests made 14 sessions. What must never
+ * drift: a request is claimed by an atomic rename before it is read, and a session already being started
+ * is not started again. The runner starts servers and timers when loaded, so this reads its source.
+ */
+
+const assert = require('node:assert');
+const { test } = require('node:test');
+const fs = require('fs');
+const path = require('path');
+
+const src = fs.readFileSync(path.join(__dirname, '..', '..', 'scripts', 'screen-runner.js'), 'utf8');
+const fn = src.slice(src.indexOf('function handleRequest(file) {'), src.indexOf('function drainQueue() {'));
+
+test('a queued request is claimed with a rename before it is read, and a lost claim does nothing', () => {
+  assert.ok(fn.length > 0, 'handleRequest was not found');
+  const claim = fn.indexOf('fs.renameSync(file, claimed)');
+  const read = fn.indexOf('fs.readFileSync(');
+  assert.ok(claim > 0 && read > claim, 'the request must be renamed before it is read');
+  assert.match(fn, /try \{ fs\.renameSync\(file, claimed\); \} catch \(_\) \{ return; \}/, 'a drain that loses the rename returns');
+  assert.ok(!/fs\.readFileSync\(file,/.test(fn), 'the unclaimed file is never read');
+  // A claimed file no longer ends in .json, so the next drain does not pick it up.
+  assert.match(src, /filter\(\(f\) => f\.endsWith\('\.json'\)\)/);
+});
+
+test('a session already being started is answered "already", and the mark is cleared on every way out', () => {
+  assert.match(src, /const starting = new Set\(\);/);
+  assert.match(fn, /if \(starting\.has\(session\)\) return answer\(id, \{ ok: false, already: true \}\);\s*starting\.add\(session\);/);
+  const ways = (fn.match(/starting\.delete\(session\)/g) || []).length;
+  assert.ok(ways >= 3, `cleared when it already exists, when screen fails, and once it has started (found ${ways})`);
+});
+
+test('a session is started with no shell between the runner and screen, so its line is parsed once, in the session', () => {
+  const runner = require('fs').readFileSync(require('path').join(__dirname, '..', '..', 'scripts', 'screen-runner.js'), 'utf8');
+  assert.ok(!/execFile\('bash', \['-lc'/.test(runner), 'a bash -lc "…" wrapper expands $ and backticks on the host first');
+  // -c first: every session this runner starts takes the dashboard's own screenrc (10k lines of
+  // scrollback, alt-screen on, Ctrl-S as a keystroke), and never the machine's ~/.screenrc.
+  assert.match(runner, /execFile\('screen', \['-c', SCREENRC, '-T', 'xterm-256color', '-dmS', session, 'bash', '-lc', inner\]/);
+});

package/core/workspace-app/tests/unit/screen-window.test.js

@@ -0,0 +1,116 @@
+/**
+ * Opening a screen window, and the state a session leaves in a terminal.
+ *
+ * Three faults, all reported as "the terminal is weird":
+ *
+ *   1. A window sometimes opened blank and stayed blank. The repaint that makes an idle session show
+ *      itself was one shot at 400ms — a guess about how long `script` + `stty` + the screen client
+ *      take on a loaded machine.
+ *   2. Ctrl-C and Detach in that window did nothing but print a command to go and type, for sessions
+ *      this process could drive all along: the guard refused every verb for a session marked `host`,
+ *      which is every session, since that is what `listScreens` labels them.
+ *   3. Attaching from a real terminal and scrolling wrote mouse coordinates into the shell. screen
+ *      replays the window's output state to each display that attaches, so a program that turned
+ *      mouse reporting on and died without turning it off leaves every later terminal reporting the
+ *      mouse at a shell that is not listening. Reproduced with `script -qfc "screen -x …"`: the
+ *      attaching terminal receives `ESC[?1000h ESC[?1006h`.
+ */
+
+const { test } = require('node:test');
+const assert = require('node:assert');
+const fs = require('fs');
+const path = require('path');
+
+const APP = path.join(__dirname, '../..');
+const server = fs.readFileSync(path.join(APP, 'server.js'), 'utf8');
+const jobs = fs.readFileSync(path.join(APP, 'jobs.js'), 'utf8');
+const runner = fs.readFileSync(path.join(APP, 'scripts/screen-runner.js'), 'utf8');
+const actions = fs.readFileSync(path.join(APP, 'actions/screens.js'), 'utf8');
+const screens = fs.readFileSync(path.join(APP, 'screens.js'), 'utf8');
+const terminal = fs.readFileSync(path.join(APP, 'public/terminal.js'), 'utf8');
+const screenrc = fs.readFileSync(path.join(APP, 'screenrc'), 'utf8');
+
+test('a blank window is repainted until it paints, not once and hopefully', () => {
+  const attach = server.slice(server.indexOf('termWss.handleUpgrade'));
+  assert.match(attach, /let painted = false;/);
+  assert.match(attach, /child\.stdout\.on\('data', \(d\) => \{ painted = true;/);
+  assert.match(attach, /\[250, 900, 2500, 5000\]\.map\(\(ms\) => setTimeout/);
+  assert.match(attach, /if \(painted\) return;/, 'and it stops as soon as there is something on screen');
+  // The timers are cleared when the attach ends, or a closed window keeps asking a session to repaint.
+  assert.match(attach, /const stopRepaints = \(\) => repaints\.forEach\(clearTimeout\);/);
+  assert.match(attach, /child\.on\('exit', \(\) => \{ stopRepaints\(\);/);
+});
+
+test('an attached window that never paints says so', () => {
+  // Connected is not painted: `screen -x` attaches to a window whose program may be sitting idle, and
+  // a window that came up with nothing in it looks exactly like one that stalled.
+  assert.match(terminal, /pane\.__silence = setTimeout\(/);
+  assert.match(terminal, /attached — nothing painted yet, press a key or use ↻/);
+  assert.match(terminal, /pane\.dataset\.painted = '1';/, 'and the first byte takes the message away');
+  assert.match(terminal, /clearTimeout\(pane\.__silence\);/);
+});
+
+test('the window verbs actually run, here, instead of printing a command to type', () => {
+  const fn = actions.slice(actions.indexOf('async function onHostScreen'), actions.indexOf('function runnerDownHtml'));
+  // Stopping still goes through the runner that owns the process group.
+  assert.match(fn, /row\.where === 'host' && args\.includes\('quit'\)/);
+  // Everything else is tried locally: /run/screen is shared with this container, which is the same
+  // reason `screen -x` attaches at all.
+  assert.match(fn, /const out = await run\('screen', args, process\.env\.HOME/);
+  assert.match(fn, /if \(out\.ok\) return out;/);
+  // And the fallback message is only for a real failure, with the command that was actually attempted.
+  assert.match(fn, /If this keeps failing, run it in your terminal: screen -S \$\{session\} -X \$\{verb\}/);
+});
+
+test('the mouse modes can be cleared, and it says what it does first', () => {
+  assert.match(actions, /'\/actions\/screen-reset-modes': screen_verb,/);
+  const branch = actions.slice(actions.indexOf("if (pathname === '/actions/screen-reset-modes')"));
+  assert.match(branch, /form\.confirm !== 'yes'/, 'it types a line into the session, so it asks');
+  assert.match(branch, /typed <code>printf<\/code> at the session's prompt/,
+    'and says plainly that a full-screen program would have received it instead');
+  // The modes a TUI turns on: mouse (three trackings, two encodings) and bracketed paste.
+  for (const m of ['?1000l', '?1002l', '?1003l', '?1006l', '?1015l', '?2004l']) {
+    assert.ok(actions.includes(m), `clears ${m}`);
+  }
+});
+
+test("the escape is doubled, because screen's stuff eats one", () => {
+  // A single `\033` reaches the shell as a raw ESC byte, which readline takes as the start of a key
+  // sequence — leaving `printf '1000l'` on the prompt and the mode still set. Read back from the
+  // window with `screen -X hardcopy`, both ways round.
+  const line = actions.match(/const MODE_RESETS = [\s\S]*?join\(''\);/)[0];
+  // eslint-disable-next-line no-eval
+  const sent = eval(line.replace('const MODE_RESETS =', '')).toString();
+  assert.ok(sent.startsWith('\\\\033['), 'a literal backslash reaches the shell, not an ESC byte');
+  assert.ok(!sent.includes('\u001b'), 'no raw escape byte is stuffed');
+});
+
+test('the button is in the window, armed, and named after the symptom', () => {
+  assert.match(screens, /term-reset-modes arm-step/);
+  assert.match(screens, /hx-post="\/actions\/screen-reset-modes"/);
+  assert.match(screens, /hx-trigger="confirmed-remove"/, 'it goes through the confirm dialog');
+  assert.match(screens, /the wheel writes characters instead of scrolling/,
+    'named for what you would search for, not for what it sends');
+  // The icon has to exist in the vendored set or it draws an empty box.
+  const icons = fs.readFileSync(path.join(APP, 'public/vendor/uikit-icons.min.js'), 'utf8');
+  assert.ok(icons.includes("crosshairs:'<svg"), 'crosshairs is a real UIkit icon');
+});
+
+test('every session the dashboard starts runs under its own screenrc', () => {
+  // There was none, so each session took screen's defaults: 100 lines of scrollback (one screen of a
+  // build log), no alt-screen, and Ctrl-S as flow control.
+  assert.match(jobs, /const SCREENRC = require\('path'\)\.join\(__dirname, 'screenrc'\);/);
+  assert.match(jobs, /const screenCmd = \(\) => `screen -c \$\{JSON\.stringify\(SCREENRC\)\}`;/);
+  assert.ok(!/(^|[^-])screen -dmS/.test(jobs), 'no launcher starts a bare screen');
+  assert.match(runner, /const SCREENRC = path\.join\(__dirname, '\.\.', 'screenrc'\);/);
+  assert.match(runner, /execFile\('screen', \['-c', SCREENRC,/);
+
+  // And each line in it is there for a symptom.
+  assert.match(screenrc, /^altscreen on$/m);
+  assert.match(screenrc, /^defscrollback 10000$/m);
+  assert.match(screenrc, /^defflow off$/m);
+  assert.match(screenrc, /^mousetrack off$/m);
+  assert.match(screenrc, /^defutf8 on$/m);
+  // It is the dashboard's, not the machine's: a person's own ~/.screenrc must not change.
+  assert.ok(!screenrc.includes('~/.screenrc'));
+});

package/core/workspace-app/tests/unit/screens-beside-running.test.js

@@ -0,0 +1,19 @@
+const test = require('node:test');
+const assert = require('node:assert/strict');
+const fs = require('fs');
+const path = require('path');
+
+const root = path.join(__dirname, '..', '..');
+const server = fs.readFileSync(path.join(root, 'server.js'), 'utf8');
+const css = fs.readFileSync(path.join(root, 'public', 'css', 'components', 'project-cards.css'), 'utf8');
+
+test('SCREENS is drawn beside the running state in the card head, not in the tool strip', () => {
+  assert.match(server, /<span class="pcard-state-line">\$\{statusBadge \?[^\n]*<span class="pcard-screens">\$\{screensMenu\}<\/span><\/span>/);
+  assert.match(server, /screens: screensOnTools,/);
+  assert.match(server, /const screensOnTools = '';/);
+});
+
+test('in the head it is the icon and its count, and the word stays its accessible name', () => {
+  assert.match(server, /aria-label="SCREENS\$\{n \? `, \$\{n\} running` : ''\}"/);
+  assert.match(css, /\.pcard-screens \.uk-button \{ font-size: 0;/);
+});

package/core/workspace-app/tests/unit/screens-columns.test.js

@@ -0,0 +1,79 @@
+/**
+ * The Screens page: one session under another by default, two or three across on request.
+ *
+ * One is the default deliberately. A session row carries its name, its state, its log path and five
+ * verbs, and two of those side by side on a 1400px screen leaves each narrower than the buttons it
+ * holds. Two and three are for a machine with a dozen sessions, where the question is "which of these
+ * is waiting" rather than "what does this one say".
+ */
+
+const { test } = require('node:test');
+const assert = require('node:assert');
+const fs = require('fs');
+const path = require('path');
+
+const read = (f) => fs.readFileSync(path.join(__dirname, '../..', f), 'utf8');
+const screens = read('screens.js');
+const ui = read('public/ui.js');
+const css = read('public/css/components/grid-and-list.css');
+
+test('both children span the container, which is itself a grid', () => {
+  // #webship-workspace-projects is the same grid the project rows are laid out in, so a wrapper dropped
+  // into it becomes ONE CELL: the toolbar took the first column, the whole list the second, and half
+  // the page was empty. Found by looking at the page, not by reading the CSS.
+  assert.match(css, /\.screens-toolbar \{ grid-column: 1 \/ -1; \}/);
+  assert.match(css, /\.screens-list \{ grid-column: 1 \/ -1;/);
+  assert.match(screens, /uk-margin-small screens-toolbar/, 'the toolbar carries the class that spans');
+});
+
+test('the list ships at one across', () => {
+  assert.match(screens, /<div class="screens-list" data-cols="1">/,
+    'the server renders the default, so the page is right before any script runs');
+  assert.match(css, /\.screens-list \{[^}]*grid-template-columns: minmax\(0, 1fr\);/,
+    'one column unless asked otherwise');
+});
+
+test('two and three across are offered, and only those', () => {
+  // The buttons are one loop over the counts, so the counts are what to assert — the attribute itself
+  // is a template, and matching its rendered form would be matching my own interpolation.
+  assert.match(screens, /data-screens-cols="\$\{n\}"/);
+  const counts = screens.slice(screens.indexOf("[['1', 'list'"));
+  assert.match(counts.slice(0, 200), /\['1', 'list'[^\]]*\], \['2', 'grid'[^\]]*\], \['3', 'grid'[^\]]*\]/);
+  assert.doesNotMatch(counts.slice(0, 200), /\['[456]'/, 'a session row cannot take a quarter of the page');
+  assert.match(css, /\.screens-list\[data-cols="2"\]/);
+  assert.match(css, /\.screens-list\[data-cols="3"\]/);
+});
+
+test('a column is sized by its share, never by the longest session name', () => {
+  // `dev--amd-website_starter-1-0-x-site-template--build` is one unbroken token, and a track sized to its
+  // content is how a list of them ends up scrolling sideways.
+  assert.match(css, /repeat\(2, minmax\(0, 1fr\)\)/);
+  assert.match(css, /repeat\(3, minmax\(0, 1fr\)\)/);
+});
+
+test('the choice survives the refresh that replaces the list every 20 seconds', () => {
+  // A class set once would last exactly one poll.
+  const block = ui.slice(ui.indexOf('(function screensColumns()'));
+  assert.match(block, /htmx:after:swap/);
+  assert.match(block, /ws-screens-cols/, 'kept per browser, like the theme and the page width');
+  assert.match(block, /\['1', '2', '3'\]\.includes/, 'anything else falls back to one across');
+});
+
+test('the modal is as wide as what it is showing', () => {
+  // It was a flat 1100px whatever was in it, so three columns of session cards came out at 338px each
+  // — narrower than the row of buttons inside them — while 463px of a 1563px window went unused.
+  assert.match(css, /#editor-modal\[data-screens-cols\] \.uk-modal-dialog \{ width: min\(94vw, 1200px\); \}/);
+  assert.match(css, /#editor-modal\[data-screens-cols="2"\][^{]*\{ width: min\(94vw, 1500px\); \}/);
+  assert.match(css, /#editor-modal\[data-screens-cols="3"\][^{]*\{ width: min\(94vw, 1900px\); \}/);
+  // min(…, 94vw) is what keeps it inside the window: a fixed 1900px dialog on a 1440px laptop is a
+  // modal with its right-hand column off the screen.
+  assert.match(css, /94vw/);
+});
+
+test('the width belongs to the list, not to the modal', () => {
+  // #editor-modal is the ONE modal in this dashboard. An editor opened after the screens must not
+  // inherit a width chosen for three columns of session cards.
+  const block = ui.slice(ui.indexOf('(function screensColumns()'));
+  assert.match(block, /if \(modal\.contains\(list\)\) modal\.dataset\.screensCols = read\(\);/);
+  assert.match(block, /else delete modal\.dataset\.screensCols;/);
+});

package/core/workspace-app/tests/unit/screens-menu.test.js

@@ -0,0 +1,84 @@
+/**
+ * The SCREENS menu: a pick closes it, and what it says is current.
+ *
+ * Choosing "Open the screen" started the terminal and left the menu open on top of it — a control that
+ * looks like it did not take, over the thing it just did. The close rule was scoped to items carrying
+ * `uk-toggle` (the modal openers), and a screens item carries `data-open-terminal` instead, so it was
+ * never covered.
+ *
+ * The timing had the opposite problem: every project row polled its own screens list every 15 seconds
+ * whether or not anybody looked at it — a request per row, forever — while the things that actually
+ * change the list (starting a session, stopping one) waited out that poll before the page admitted it.
+ * So: slower in the background, immediate when something changes and immediate when the menu opens.
+ */
+
+const { test } = require('node:test');
+const assert = require('node:assert');
+const fs = require('fs');
+const path = require('path');
+
+const APP = path.join(__dirname, '../..');
+const ui = fs.readFileSync(path.join(APP, 'public/ui.js'), 'utf8');
+const server = fs.readFileSync(path.join(APP, 'server.js'), 'utf8');
+const actions = fs.readFileSync(path.join(APP, 'actions/screens.js'), 'utf8');
+
+test('a pick closes the menu it was made in, whatever the item does', () => {
+  // The general rule, not a list of the item kinds somebody remembered: opening a modal, opening a
+  // terminal and posting an action are all picks, and none of them is the outside click UIkit closes on.
+  const block = ui.slice(ui.indexOf('// A pick closes the menu it was made in.'));
+  assert.match(block, /e\.target\.closest\('\.uk-dropdown a, \.uk-dropdown button'\)/);
+  assert.match(block, /UIkit\.dropdown\(drop\)\.hide\(0\)/);
+  // The old rule was narrower, and that is exactly why the screens menu was missed.
+  assert.ok(!/closest\('\.act-menu \[uk-toggle\]'\)/.test(ui), 'the uk-toggle-only rule is gone');
+});
+
+test('a dropdown that is being typed in or paged stays open', () => {
+  const block = ui.slice(ui.indexOf('// A pick closes the menu it was made in.'));
+  // Only links and buttons close it, so a filter box inside a picker keeps its menu.
+  assert.ok(!/'\.uk-dropdown input/.test(block), 'inputs are not picks');
+  assert.match(block, /if \(item\.closest\('\[data-keep-open\]'\)\) return;/);
+  // And the one place that needs it today: switching npm/yarn changes which pane shows INSIDE the
+  // menu, so closing on it would make the other manager unreachable.
+  assert.match(server, /class="uk-tab node-tabs" data-keep-open/);
+});
+
+test('the row polls slowly, and catches up the moment anything happens', () => {
+  const menu = server.match(/hx-get="\/fragments\/projects\/screens\/[^"]+" hx-trigger="([^"]+)"/)[1];
+  assert.match(menu, /every 30s/, 'the background poll is the cheap one');
+  assert.ok(!/every 15s/.test(menu), 'not twice a minute per row, forever');
+  assert.match(menu, /screens-changed from:body/, 'a session starting or stopping reaches it');
+  assert.match(menu, /menu-opened/, 'and opening it asks for what is there now');
+});
+
+test('opening a menu asks for its contents', () => {
+  // A list of sessions is the one thing the menu is opened to read, and a stale one is how you click a
+  // session that has already finished.
+  const block = ui.slice(ui.indexOf('// Opening a menu asks for what is in it NOW.'));
+  assert.match(block, /addEventListener\('beforeshow'/, "UIkit's own event, before it is on screen");
+  assert.match(block, /querySelector\('\[hx-trigger\*="menu-opened"\]'\)/);
+  assert.match(block, /dispatchEvent\(new CustomEvent\('menu-opened'\)\)/);
+});
+
+test('starting and stopping a session both say so', () => {
+  // Otherwise the count in the topbar, the row's menu and the screens page each wait out their own
+  // poll before admitting to something you did a moment ago.
+  const started = actions.slice(actions.indexOf('async function screen_new'));
+  assert.match(started, /'screens-changed': \{ session: fullSession \}/);
+  assert.match(actions, /'screen-killed': \{ session \}, 'screens-changed': \{ session \}/);
+  // And the three places that listen.
+  assert.match(server, /screens-count" hx-get="\/fragments\/screens-count" hx-trigger="load, every 30s, screens-changed from:body/);
+  assert.match(server, /screens-grid" hx-trigger="refresh-projects from:body, screens-changed from:body/);
+});
+
+test('a session in the menu says what it is doing', () => {
+  // The row already tells you something is running; the menu is where you choose WHICH, so each line
+  // carries its state rather than only its name.
+  const items = server.slice(server.indexOf('const items = sessions.map((s) => {'), server.indexOf("}).join('');", server.indexOf('const items = sessions.map((s) => {')));
+  assert.match(items, /uk-label-warning" title="\$\{esc\(why\)\}">✋ waiting/);
+  assert.match(items, /uk-label-success">running/);
+  assert.match(items, /dead \? '<span class="uk-label">dead<\/span>'/, 'a session whose process is gone opens onto nothing');
+  assert.match(items, /isAgent \? iconHtml\('tabler:robot-face'/);
+  // The name is `<workspace>--<project>--<what>`, and the first two are the row it is already on.
+  assert.match(items, /s\.session\.startsWith\(`\$\{sm\[1\]\}--\$\{sm\[2\]\}--`\)/);
+  assert.match(items, /title="\$\{esc\(s\.session\)\}/, 'the whole name is still one hover away');
+});

package/core/workspace-app/tests/unit/screens-modal-overlay.test.js

@@ -0,0 +1,14 @@
+const test = require('node:test');
+const assert = require('node:assert/strict');
+const fs = require('fs');
+const path = require('path');
+
+const ui = fs.readFileSync(path.join(__dirname, '..', '..', 'public', 'ui.js'), 'utf8');
+
+test('the modal wears its column count for width, and is never one of the count buttons', () => {
+  // The modal element carries data-screens-cols; a bare attribute selector matched it and gave the
+  // overlay the primary button's class and aria-pressed, which painted the whole backdrop brand blue.
+  assert.match(ui, /document\.querySelectorAll\('button\[data-screens-cols\]'\)/);
+  assert.doesNotMatch(ui, /document\.querySelectorAll\('\[data-screens-cols\]'\)/);
+  assert.match(ui, /modal\.dataset\.screensCols = read\(\)/);
+});

package/core/workspace-app/tests/unit/screens-waiting.test.js

@@ -0,0 +1,129 @@
+/**
+ * A screen that has stopped to ask you something raises its hand, and an agent at work says so.
+ *
+ * The point of a detached session is that nobody is watching it, so a question nobody sees is a run
+ * that is not happening. Two things had to be true for the hand to be worth having, and each cost a
+ * round of debugging:
+ *
+ *   - it has to go DOWN again. An answered `(y/n)` went on matching, because the rule allows a few
+ *     characters after the bracket for a cursor and a typed `y` is one of them — so the hand stayed up
+ *     for the rest of the session's life, which trains you to ignore it;
+ *   - the agent answer has to be per PROJECT. The first version cached the computed set rather than
+ *     the process snapshot it came from, so on a workspace of eleven projects, ten of them claimed the
+ *     first one's agent.
+ */
+
+const { test } = require('node:test');
+const assert = require('node:assert');
+const fs = require('fs');
+const path = require('path');
+
+const { waitingState } = require('../../waiting');
+const { sessionWaitingWhy, agentSessions } = require('../../screens');
+const server = fs.readFileSync(path.join(__dirname, '../../server.js'), 'utf8');
+const screensSrc = fs.readFileSync(path.join(__dirname, '../../screens.js'), 'utf8');
+
+test('an ANSWERED question is not a question', () => {
+  const asked = 'rajab@host:~$ read -p x\nDo you want to continue? (y/n) ';
+  const answered = 'Do you want to continue? (y/n) y\nrajab@host:~/workspace/test/ruverify1$';
+  assert.equal(waitingState(asked).waiting, true);
+  assert.equal(waitingState(answered).waiting, false,
+    'the shell has moved on; the hand has to go down or it is noise');
+});
+
+test('a cursor after the bracket is still a question', () => {
+  // Which is what the allowance was for — the fix must not take it away.
+  assert.equal(waitingState('Overwrite the file? (y/N) _').waiting, true);
+  assert.equal(waitingState('Overwrite the file? (y/N) ').waiting, true);
+});
+
+test('the rules that are drawn with a footer keep their three-line window', () => {
+  // A numbered choice and a "press Enter" have a footer under them, so they are not the last line.
+  assert.equal(waitingState('❯ 1. Yes\n  2. No\n  ? for shortcuts').waiting, true);
+  assert.equal(waitingState('Press Enter to continue\n⏵⏵ bypass permissions on').waiting, true);
+});
+
+test('busy is not waiting, whatever else is on the screen', () => {
+  const busy = '6 Thinking… (6m 16s · 23.9k tokens)\n⏵⏵ bypass permissions on · esc to interrupt';
+  assert.equal(waitingState(busy).waiting, false, 'the interrupt hint means it is working');
+});
+
+test('the runner\'s reading of the visible screen wins over the log', () => {
+  // A Claude Code session writes no log at all — `exec claude` with no tee — so the log check can never
+  // fire for exactly the sessions where a question matters most.
+  assert.equal(sessionWaitingWhy({ session: 'nope', waiting: true, waitingWhy: 'waiting on a choice' }),
+    'waiting on a choice');
+  assert.equal(sessionWaitingWhy({ session: 'nope', waiting: true }), 'waiting for you',
+    'a runner that says waiting without a reason still raises the hand');
+  assert.equal(sessionWaitingWhy(null), '');
+});
+
+test('agentSessions answers per session, never from a cached answer', () => {
+  // The bug this pins: caching the computed set meant the second project asked within five seconds got
+  // the first project's agents back. Ten rows of eleven claimed an agent that was not theirs.
+  assert.deepEqual([...agentSessions([])], [], 'no sessions, no agents');
+  assert.deepEqual([...agentSessions([{ session: 'x', pid: '0' }])], [],
+    'pid 0 is every top-level process: walking from it would claim every agent on the machine');
+  assert.deepEqual([...agentSessions([{ session: 'x' }])], [], 'a row with no pid claims nothing');
+  // The snapshot is what is memoised.
+  assert.match(screensSrc, /function processTable\(\)/);
+  assert.match(screensSrc, /psMemo = \{ at: now, kids, args \}/);
+  assert.doesNotMatch(screensSrc, /agentMemo/, 'the ANSWER is never cached');
+});
+
+test('the row states both at the right-hand end of its name line', () => {
+  // One glance answers "is anything happening here, and is the site up". Split to opposite ends, the
+  // eye had to cross the name to collect one of the two.
+  const line = server.slice(server.indexOf('<div class="pcard-head">'));
+  const block = line.slice(0, line.indexOf('</div>', line.indexOf('project-title-status')));
+  assert.match(block, /class="project-title-status pcard-status"/);
+  // The agent first, then what DDEV says — so the running state keeps the far right, where it was.
+  assert.ok(block.indexOf('project-title-agent') < block.indexOf('project-title-state'),
+    'the agent sits next to the running state, not past it');
+  assert.match(server, /hx-swap-oob="true"/, 'the agent badge is filled by the poll the row already makes');
+});
+
+test('the hand and the agent badge are sent even when empty', () => {
+  // An out-of-band swap that is only sent sometimes leaves the last answer standing after the question
+  // has been answered or the agent has finished.
+  const frag = server.slice(server.indexOf('const hand = `<span class="screens-hand'));
+  assert.match(frag, /waiting\.length \? `✋/, 'the hand is conditional INSIDE the span, not around it');
+  assert.match(frag, /agents\.size\s*\n?\s*\? `<span class="uk-label/, 'and so is the badge');
+});
+
+test('both badges are the same pill, in different colours', () => {
+  const css = fs.readFileSync(path.join(__dirname, '../../public/css/components/mic-on-any-field-that-wants-typing.css'), 'utf8');
+  const rows = fs.readFileSync(path.join(__dirname, '../../public/css/components/project-rows.css'), 'utf8');
+  // The pill rule names the WRAPPER, so a badge that joins the line later is the same shape by
+  // construction. Scoped to .project-title-state alone, the agent badge fell back to bare UIkit — a
+  // 2px corner, 21px tall, UPPERCASE — next to a 26px pill, which reads as one of the two being broken.
+  assert.match(css, /\.project-title-status \.uk-label,\s*\n\s*\.project-title-state \.uk-label/);
+  // Different colours, because they answer different questions: green is "the site is up", brand blue
+  // is "something is working on it". Two green pills say one thing twice.
+  assert.match(rows, /\.project-title-status \.agent-live \{[^}]*background: var\(--brand-primary\)/s);
+  // And amber still wins when it has stopped to ask you something — the one state worth shouting.
+  assert.match(rows, /\.project-title-status \.agent-live\.uk-label-warning \{[^}]*var\(--warning\)/s);
+});
+
+test('a CLI session is offered as an id to resume, never as a link', () => {
+  // A Claude Code CLI session is a transcript in ~/.claude/projects on this machine. It has no page on
+  // claude.ai — the claude.ai/code ids that turn up inside transcripts belong to cloud sessions — so a
+  // link would either go nowhere or suggest the conversation is on the web when it is not. These are
+  // client projects: the id is something to resume with, never to publish.
+  assert.match(screensSrc, /claude --resume \$\{esc\(latest\.id\)\}/);
+  assert.doesNotMatch(screensSrc, /claude\.ai\/code\/session/, 'no link to a page that does not exist');
+  assert.match(screensSrc, /it has no page on claude\.ai/, 'and it says so where somebody would look for one');
+  // The NEWEST session for the folder, said as that: a screen started with `exec claude` does not
+  // record which conversation it ended up in.
+  assert.match(screensSrc, /the newest\s*\n?\s*Claude Code session in this folder/);
+});
+
+test('the robot is an icon from the sprite, not an emoji', () => {
+  // An emoji is drawn by the platform's own font: a grey outline on one machine, a yellow cartoon on
+  // another, at a size and weight nothing here controls. robot-face over robot because at the 14px a
+  // label gives it, a whole robot is a smudge — compared side by side at badge size.
+  assert.match(server, /iconHtml\('tabler:robot-face', 0\.8\)/);
+  // Scoped to the badges, not to the file: the three runJob labels that say an AI wrote the job are a
+  // different thing, and a blanket search would have this test fail on one of those instead.
+  assert.doesNotMatch(server, /🤖 agent running/, 'the badge is an icon now, here and on the Jira page');
+});

package/core/workspace-app/tests/unit/screens.test.js

@@ -0,0 +1,74 @@
+/**
+ * The screens manager's own logic: which places a session may be started in,
+ * how a target token resolves to a directory, and what the session-name rules
+ * actually admit. These are the guards that keep a browser-supplied name out
+ * of `screen`, so they are pinned here rather than left to the browser tests.
+ */
+
+const { test } = require('node:test');
+const assert = require('node:assert');
+const path = require('path');
+
+const { screenTargets, screenTargetDir } = require('../../screens');
+const { ROOT } = require('../../workspaces');
+
+test('the workspace root is always a place to start a session', () => {
+  const root = screenTargets().find((t) => t.value === 'root');
+  assert.ok(root);
+  assert.strictEqual(root.dir, ROOT);
+});
+
+test('every target resolves to a real directory inside the workspace', () => {
+  for (const t of screenTargets().slice(0, 40)) {
+    const dir = screenTargetDir(t.value);
+    assert.ok(dir, `${t.value} resolves`);
+    assert.ok(dir.startsWith(ROOT), `${dir} is inside the workspace`);
+  }
+});
+
+test('a target token the server did not offer resolves to nothing', () => {
+  for (const bad of ['', 'root/../..', 'p:dev:../../etc', '/etc', 'ws:no-such', 'p:no:no']) {
+    assert.strictEqual(screenTargetDir(bad), null, `${bad} is refused`);
+  }
+});
+
+test('workspace folders and projects are offered separately', () => {
+  const targets = screenTargets();
+  assert.ok(targets.some((t) => t.group === 'Workspace folders'));
+  assert.ok(targets.some((t) => t.group === 'Projects'), 'at least one project is offered');
+  const dev = targets.find((t) => t.value === 'ws:dev');
+  assert.ok(dev && dev.dir === path.join(ROOT, 'dev'));
+});
+
+// The name rule is shared by the form, the actions and both /fragments routes:
+// it must never admit a leading '-', which `screen` would read as an option.
+const NAME_RE = /^[a-z0-9][a-zA-Z0-9_.-]*$/;
+
+test('a session name may not start with a dash, and holds no shell characters', () => {
+  for (const ok of ['build1', 'jira-webship-2307', 'a.b_c-d', 'x']) assert.ok(NAME_RE.test(ok), ok);
+  for (const bad of ['-d', '-S', '; rm -rf /', 'a b', '../x', 'a$b', 'A-first', '']) {
+    assert.ok(!NAME_RE.test(bad), `${bad} is refused`);
+  }
+});
+
+// The machine's sessions reach the dashboard through the folder both sides
+// share: the runner republishes its list every two seconds, so a stale file
+// means the runner is gone and nothing new may be started.
+test('a published session list is trusted only while it is fresh', () => {
+  const fs = require('fs');
+  const path = require('path');
+  const os = require('os');
+  const { ROOT } = require('../../workspaces');
+  const file = path.join(ROOT, '.screens', 'host-sessions.json');
+  const had = fs.existsSync(file) ? fs.readFileSync(file) : null;
+  const { hostSessionsFile } = require('../../jobs');
+  try {
+    fs.mkdirSync(path.dirname(file), { recursive: true });
+    fs.writeFileSync(file, JSON.stringify({ at: Date.now(), host: os.hostname(), sessions: [{ session: 'a--b--c' }] }));
+    assert.equal(hostSessionsFile().sessions.length, 1, 'a list written now is the truth');
+    fs.writeFileSync(file, JSON.stringify({ at: Date.now() - 60000, sessions: [{ session: 'a--b--c' }] }));
+    assert.equal(hostSessionsFile(), null, 'a minute-old list means the runner stopped');
+  } finally {
+    if (had) fs.writeFileSync(file, had); else fs.rmSync(file, { force: true });
+  }
+});