@bongos/core 1.19.963 → 1.19.964

package/tests/goal_forest_page.mjs

@@ -0,0 +1,196 @@
+// tests/goal_forest_page.mjs — the per-goal dependency forest's WIRING on the
+// Goals page, EXECUTED (task 1003480, goal 1000089, ADR 0227 §6 item 4).
+//
+// goal_forest_lib.mjs proves the layout; goal_forest.mjs proves the server
+// route. What neither can see is whether goals-render.js actually calls the
+// real endpoint, actually draws with the real lib, and actually renders the
+// honest states ADR 0227 requires (no edges → said plainly; a failed read →
+// said plainly; never a stack, never a blank canvas). This runs the REAL
+// goal-forest-lib.js + the REAL createGoalsRender(ctx) factory from
+// goals-render.js in a vm — calling `loadDependencyForest`/
+// `renderDependencyForest` directly (they are exported for exactly this)
+// rather than booting the whole page, which needs a much larger fixture for
+// members/completion/invites this task never touches.
+//
+// Run:  node tests/goal_forest_page.mjs
+import assert from 'node:assert/strict';
+import fs from 'node:fs';
+import path from 'node:path';
+import vm from 'node:vm';
+import { fileURLToPath } from 'node:url';
+import { makeRunner, makeEl, walk } from './helpers.mjs';
+
+const ROOT = path.resolve(path.dirname(fileURLToPath(import.meta.url)), '..');
+const HALL = path.join(ROOT, 'modules/hall-ui/public');
+const read = (f) => fs.readFileSync(path.join(HALL, f), 'utf8');
+const LIB_JS = read('goal-forest-lib.js');
+const FOREST_RENDER_JS = read('goal-forest-render.js');
+const RENDER_JS = read('goals-render.js');
+
+const { test, summary } = makeRunner();
+const tick = () => new Promise((r) => setTimeout(r, 0));
+const settle = async () => { for (let i = 0; i < 20; i++) await tick(); };
+
+const t = (id, extra = {}) => ({ task_id: String(id), title: `Task ${id}`, status: 'ready', priority: 3, ...extra });
+const e = (from, to) => ({ from: String(from), to: String(to) });
+
+async function boot({ status = 200, fail = false, payload = { nodes: [], edges: [] } } = {}) {
+  const root = makeEl('div');
+  const reg = (id) => { const el = makeEl('div', { id }); root.appendChild(el); return el; };
+  ['goal-deps-h', 'goal-deps-count', 'goal-deps-lede', 'goal-deps-body'].forEach(reg);
+
+  const documentObj = {
+    getElementById: (id) => walk(root, (el) => (el.id === id ? el : null)),
+    createElementNS(_ns, tag) {
+      const el = makeEl(tag);
+      const orig = el.setAttribute.bind(el);
+      el.setAttribute = (k, v) => { orig(k, v); if (k === 'class') el.className = String(v); if (k === 'id') el.id = String(v); };
+      return el;
+    },
+  };
+  const windowObj = {
+    OTB: {
+      escapeHtml: (s) => String(s == null ? '' : s).replace(/[&<>"']/g, (c) => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;' }[c])),
+      $: (sel) => documentObj.getElementById(String(sel).replace(/^#/, '')),
+      fmtNum: (n) => String(n), fmtDate: (iso) => String(iso ?? ''), toast() {}, rankLabel: (r) => String(r ?? ''), categoryChip: () => '',
+    },
+    OTBTaskLib: {},
+    OTBKit: {
+      makePager: () => ({ page: 1, perPage: 25 }), paginate: () => [], wirePager() {}, pagerBarHtml: () => '',
+      makeTabs: () => ({}), makeFilterBar: () => ({}), emptyStateHtml: (m) => m, skeletonRows: () => '',
+    },
+    OTBGoalsLib: {},
+  };
+  const requests = [];
+  const sandbox = {
+    window: windowObj, self: windowObj, document: documentObj,
+    console: { error() {}, warn() {}, log() {} },
+    setTimeout, clearTimeout,
+    fetch: async () => { throw new Error('goals-render.js must use ctx.getJSON, not fetch directly'); },
+  };
+  sandbox.globalThis = sandbox;
+  vm.createContext(sandbox);
+  vm.runInContext(LIB_JS, sandbox, { filename: 'goal-forest-lib.js' });
+  vm.runInContext(FOREST_RENDER_JS, sandbox, { filename: 'goal-forest-render.js' });
+  vm.runInContext(RENDER_JS, sandbox, { filename: 'goals-render.js' });
+
+  const state = { current: 7, forest: null, forestError: false };
+  const ctx = {
+    API: '/api/bongos',
+    state,
+    sameId: (a, b) => String(a) === String(b),
+    getJSON: async (p) => {
+      requests.push(p);
+      if (fail) throw new Error('offline');
+      if (status === 401) throw Object.assign(new Error('redirecting to auth'), {});
+      return payload;
+    },
+  };
+  const renderers = windowObj.OTBGoalsRender(ctx);
+  return { $: documentObj.getElementById, requests, state, renderers };
+}
+
+// ---- the honest states (ADR 0227) ---------------------------------------------
+
+await test('loadDependencyForest calls the real per-goal endpoint — never a global one', async () => {
+  const h = await boot({ payload: { nodes: [], edges: [] } });
+  await h.renderers.loadDependencyForest(7);
+  assert.deepEqual(h.requests, ['/api/bongos/goals/7/dependency-forest']);
+});
+
+await test('no dependency at all says so plainly — no canvas, no stack, no leftover count', async () => {
+  const h = await boot({ payload: { nodes: [], edges: [] } });
+  await h.renderers.loadDependencyForest(7);
+  assert.match(h.$('goal-deps-lede').textContent, /No task in this goal depends on another task in this goal/);
+  assert.equal(h.$('goal-deps-body').innerHTML, '');
+  assert.equal(h.$('goal-deps-count').hidden, true);
+});
+
+await test('a failed read says so plainly, distinct from "still loading" and from "nothing to show"', async () => {
+  const h = await boot({ fail: true });
+  await h.renderers.loadDependencyForest(7);
+  assert.match(h.$('goal-deps-lede').textContent, /Couldn.t load this goal.s task dependencies/);
+  assert.equal(h.$('goal-deps-count').hidden, true, 'a failed read pills the same as an empty one — never a literal 0');
+});
+
+await test('while loading, the lede says so and the body stays empty (no stale content from a prior goal)', async () => {
+  const h = await boot({ payload: { nodes: [t(1), t(2)], edges: [e(1, 2)] } });
+  const p = h.renderers.loadDependencyForest(7); // deliberately not awaited yet
+  assert.equal(h.$('goal-deps-lede').textContent, 'Reading…');
+  assert.equal(h.$('goal-deps-body').innerHTML, '');
+  await p;
+});
+
+await test('a stale response for a goal the reader navigated away from is dropped', async () => {
+  const h = await boot({ payload: { nodes: [t(1), t(2)], edges: [e(1, 2)] } });
+  const p = h.renderers.loadDependencyForest(7);
+  h.state.current = 999; // navigated to a different goal mid-request
+  await p;
+  assert.equal(h.$('goal-deps-lede').textContent, 'Reading…', 'the stale answer never overwrote the new goal\'s loading state');
+});
+
+// ---- a populated forest ------------------------------------------------------
+
+await test('a populated forest draws a role=img figure with no focus stops, and every fact is also a table row', async () => {
+  const h = await boot({ payload: { nodes: [t(1, { title: 'Base' }), t(2, { title: 'Top' })], edges: [e(2, 1)] } });
+  await h.renderers.loadDependencyForest(7);
+  const body = h.$('goal-deps-body');
+  const svg = body.querySelector('svg');
+  assert.ok(svg, 'the forest is drawn');
+  assert.equal(svg.getAttribute('role'), 'img');
+  assert.equal(svg.querySelectorAll('a').length, 0);
+  assert.equal(svg.querySelectorAll('[tabindex]').length, 0);
+  const table = body.querySelector('table');
+  assert.ok(table, 'the table is on the page by default (ADR 0227 §5)');
+  const rows = table.querySelector('tbody').querySelectorAll('tr');
+  assert.equal(rows.length, 2, 'one row per task');
+  assert.ok(table.textContent.includes('Base') && table.textContent.includes('Top'));
+  assert.equal(h.$('goal-deps-count').hidden, false);
+  assert.equal(h.$('goal-deps-count').textContent, '2');
+});
+
+await test('the picture scrolls inside its own region and names both overflow axes', async () => {
+  const h = await boot({ payload: { nodes: [t(1), t(2)], edges: [e(2, 1)] } });
+  await h.renderers.loadDependencyForest(7);
+  const region = h.$('goal-deps-body').querySelector('.gf-scroll');
+  assert.ok(region);
+  assert.equal(region.getAttribute('tabindex'), '0');
+  const css = fs.readFileSync(path.join(HALL, 'goals.css'), 'utf8');
+  const rule = css.match(/\.gf-scroll\s*\{[^}]*\}/)[0];
+  assert.match(rule, /overflow-x:\s*auto/);
+  assert.match(rule, /overflow-y:\s*hidden/, 'one axis named alone makes the other auto (task 1004130)');
+});
+
+await test('a task title is builder-authored text and never becomes markup', async () => {
+  const evil = '<img src=x onerror=alert(1)>';
+  const h = await boot({ payload: { nodes: [t(1, { title: evil }), t(2)], edges: [e(2, 1)] } });
+  await h.renderers.loadDependencyForest(7);
+  const body = h.$('goal-deps-body');
+  assert.equal(body.querySelector('img'), null);
+  assert.ok(body.textContent.includes(evil), 'renders as the literal characters, not as HTML');
+});
+
+await test('a redirecting-to-auth failure is swallowed silently, the loadGoalTasks precedent — the page is about to navigate away', async () => {
+  const h = await boot({ status: 401 });
+  await h.renderers.loadDependencyForest(7);
+  assert.equal(h.$('goal-deps-lede').textContent, 'Reading…', 'no error flash on a redirect the browser is already leaving for');
+  assert.equal(h.state.forestError, false);
+});
+
+// ---- wiring into the detail render -------------------------------------------
+
+await test('renderDetail calls loadDependencyForest, beside loadGoalTasks, for the OPEN goal', () => {
+  assert.match(RENDER_JS, /loadGoalTasks\(g\.id\);\s*\n\s*loadDependencyForest\(g\.id\);/);
+});
+
+await test('the section is its OWN full-width block, not squeezed into the three-column band', () => {
+  const html = fs.readFileSync(path.join(HALL, 'goals.html'), 'utf8');
+  const bandAt = html.indexOf('class="scroll goal-band"');
+  const depsAt = html.indexOf('id="goal-deps-scroll"');
+  const tasksAt = html.indexOf('<h2 class="scroll__h">Tasks</h2>');
+  assert.ok(bandAt > -1 && depsAt > -1 && tasksAt > -1);
+  assert.ok(bandAt < depsAt && depsAt < tasksAt, 'band, then dependencies, then tasks');
+  assert.equal(/id="goal-deps-scroll"[\s\S]{0,400}goal-band__col/.test(html), false, 'not inside a band column');
+});
+
+summary();

package/tests/goal_invite_consent.mjs

@@ -169,7 +169,7 @@ function harness({ pendingRequests = [] } = {}) {
   };
   sandbox.globalThis = sandbox;
   vm.createContext(sandbox);
-  for (const f of ['hall-kit.js', 'task-lib.js', 'goals-lib.js', 'goals-render.js']) {
+  for (const f of ['hall-kit.js', 'task-lib.js', 'goals-lib.js', 'goal-forest-render.js', 'goals-render.js']) {
     vm.runInContext(read(P + f), sandbox, { filename: f });
   }
 

package/tests/helpers.mjs

@@ -199,10 +199,14 @@ export function hallSource(pubDir = path.join(ROOT, 'modules', 'hall-ui', 'publi
   return familySource(pubDir, (f) => f === 'builders.js' || f === 'hall-render.js');
 }
 
-// The GOALS page script: goals-page.js plus its two carved siblings — goals-lib.js
-// (pure helpers, task 1003135) and goals-render.js (view painters, task 1003206).
+// The GOALS page script: goals-page.js plus its carved siblings — goals-lib.js
+// (pure helpers, task 1003135), goals-render.js (view painters, task 1003206),
+// and goal-forest-render.js (the dependency-forest drawing code goals-render.js
+// calls into via window.OTBGoalForestRender(ctx), task 1003480 — without this
+// file in the boot order, createGoalsRender throws immediately, since it calls
+// that factory eagerly at the top).
 export function goalsPageSource(pubDir = path.join(ROOT, 'modules', 'hall-ui', 'public')) {
-  return familySource(pubDir, (f) => ['goals-page.js', 'goals-lib.js', 'goals-render.js'].includes(f));
+  return familySource(pubDir, (f) => ['goals-page.js', 'goals-lib.js', 'goal-forest-render.js', 'goals-render.js'].includes(f));
 }
 
 // The KERNEL IDENTITY surface: auth.js (session resolution, the middleware and the