@bongos/core 1.19.512 → 1.19.514

package/tests/watch_applications_queue.mjs

@@ -0,0 +1,381 @@
+// tests/watch_applications_queue.mjs — the owner's applications review queue,
+// EXECUTED (task 1002332, BV1.R13 of goal 1000046, criterion proj-join-policy).
+//
+// An application to a project IS an `access_requests` row on that project's own
+// instance (ADR 0182 §Scope routes R13 here; the admin-console spec D2 settled
+// the storage). The route side has carried the whole lifecycle since task
+// 1002284 — approve, decline, RESCIND, idempotence — and `tests/application_
+// lifecycle.mjs` executes it. What had no test, and largely no UI, was the half
+// an owner actually touches:
+//
+//   • ADR 0201, Consequences: "the queue gains a two-class row: vouched … and
+//     unvouched … The owner must be able to see which is which — an unvouched
+//     row that *looked* vouched is the whole vulnerability, so the distinction
+//     is UI-load-bearing, not decoration." POST /access-requests is the one
+//     PUBLIC unauthenticated write, so anyone may apply under anyone's name.
+//   • ADR 0208: "There is no UI path to the rescind. watch.js fetches only
+//     ?status=pending, so the invited history is not rendered and nothing offers
+//     the action." An approval given by mistake must be revocable before its
+//     holder ever signs in.
+//
+// Both are assertions about what a human sees and clicks, so this runs the real
+// watch.js inside `vm` against the real watch.html — the parsing DOM stub from
+// tests/task_detail_ui.mjs (task 1003516), now shared out of helpers.mjs. A
+// render that throws, a button wired to nothing, or a pill written on the wrong
+// row fails here; source-text assertions cannot see any of that.
+//
+// The vouch is DESCRIPTIVE and never authority (ADR 0016) — this file asserts
+// only that the queue SAYS which class a row is, never that the class changes
+// what the buttons do.
+//
+// Run:  node tests/watch_applications_queue.mjs
+
+import { strict as assert } from 'node:assert';
+import fs from 'node:fs';
+import path from 'node:path';
+import vm from 'node:vm';
+import { fileURLToPath } from 'node:url';
+import { makeRunner, makeEl, parseInto } from './helpers.mjs';
+
+const ROOT = path.resolve(path.dirname(fileURLToPath(import.meta.url)), '..');
+const HALL = path.join(ROOT, 'modules/hall-ui/public');
+const SRC = fs.readFileSync(path.join(HALL, 'watch.js'), 'utf8');
+const PAGE = fs.readFileSync(path.join(HALL, 'watch.html'), 'utf8');
+
+const { test, summary } = makeRunner();
+
+const escapeHtml = (s) => String(s == null ? '' : s).replace(/[&<>"']/g,
+  (c) => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;' }[c]));
+
+const tick = () => new Promise((r) => setTimeout(r, 0));
+async function settle() { for (let i = 0; i < 40; i++) await tick(); }
+
+// A request body (or an options array) the page built inside the vm carries that
+// realm's prototypes, which deepStrictEqual reads as "same structure, different
+// object". Round-tripping it through JSON compares the values, which is the only
+// part under test.
+const plain = (v) => JSON.parse(JSON.stringify(v));
+
+const ok = (data) => ({ status: 200, ok: true, data });
+const fail = (status, code, message) => ({ status, ok: false, data: { error: { code, message } } });
+
+// Rows as GET /access-requests returns them: `vouched` is derived server-side
+// from applicant_github_id IS NOT NULL (core_230), never stored twice.
+const WAITING = [
+  {
+    id: '7', github_login: 'octocat', display_name: 'Mona Lisa', note: 'I want to build the map. (via platform My Projects)',
+    status: 'pending', created_at: '2026-09-01T10:00:00Z', resolved_at: null,
+    vouched: true, resolved_by_login: null,
+  },
+  {
+    id: '8', github_login: 'stranger', display_name: 'Mona Lisa', note: 'let me in',
+    status: 'pending', created_at: '2026-09-02T10:00:00Z', resolved_at: null,
+    vouched: false, resolved_by_login: null,
+  },
+];
+const ADMITTED = [{
+  id: '3', github_login: 'earlybird', display_name: null, note: null,
+  status: 'invited', created_at: '2026-08-01T10:00:00Z', resolved_at: '2026-08-02T09:00:00Z',
+  vouched: true, resolved_by_login: 'theowner',
+}];
+const DECLINED = [{
+  id: '2', github_login: 'spammer', display_name: null, note: 'buy followers',
+  status: 'dismissed', created_at: '2026-07-01T10:00:00Z', resolved_at: '2026-07-01T11:00:00Z',
+  vouched: false, resolved_by_login: 'theowner',
+}];
+
+// ===========================================================================
+// Boot the real page against a scripted API and hand back handles.
+// ===========================================================================
+
+async function boot(opts = {}) {
+  const {
+    rows = { pending: WAITING, invited: ADMITTED, dismissed: DECLINED },
+    rank = 'archon',
+    queueStatus = null,          // non-200 for the queue read (403 seals it)
+    patchResult = null,          // a scripted answer for PATCH /access-requests/:id
+  } = opts;
+
+  const requests = [];
+  const toasts = [];
+  const filterBars = [];
+
+  const api = {
+    async request(method, p, init) {
+      const body = init && init.body;
+      requests.push({ method, path: p, body });
+      const url = String(p).replace('/api/bongos', '');
+      const [route, query] = url.split('?');
+      if (method === 'GET' && route === '/me') return ok({ builder: { id: 1, rank, github_login: 'theowner' } });
+      if (method === 'GET' && route === '/access-requests') {
+        if (queueStatus) return { status: queueStatus, ok: false, data: null };
+        const status = new URLSearchParams(query || '').get('status') || 'pending';
+        return ok({ requests: rows[status] || [] });
+      }
+      if (method === 'PATCH' && route.startsWith('/access-requests/')) {
+        return patchResult || ok({ ok: true, request: { id: route.split('/').pop() } });
+      }
+      if (method === 'POST' && route === '/access-requests/invite') return ok({ ok: true });
+      // Every other panel on this page loads independently and degrades on its
+      // own; an unscripted shape is exactly the failure `section` swallows.
+      return ok({});
+    },
+  };
+
+  const documentObj = {
+    readyState: 'complete',
+    body: makeEl('body'),
+    documentElement: makeEl('html'),
+    createElement: (tag) => makeEl(tag),
+    getElementById(id) { return this.body.querySelector(`#${id}`); },
+    querySelector(sel) { return this.body.querySelector(sel); },
+    querySelectorAll(sel) { return this.body.querySelectorAll(sel); },
+    addEventListener() {},
+  };
+  // The REAL page markup, so #gate-body, #att-access and the section ids are
+  // the ones shipped rather than ones this test invented.
+  parseInto(documentObj.body, PAGE);
+
+  const locationObj = { hostname: 'builders.example.test', pathname: '/builders/watch', search: '', hash: '', assign() {} };
+
+  const kit = {
+    makeTabs: () => ({}),
+    makeLedger: () => ({ render() {} }),
+    makePager: () => ({ page: 1, perPage: 25 }),
+    emptyStateHtml: (msg) => `<div class="empty-state"><p>${escapeHtml(msg)}</p></div>`,
+    // Recorded rather than reimplemented: the contract watch.js depends on is
+    // "paint a control, call onChange with the chosen value", and a test that
+    // drives onChange drives exactly that.
+    makeFilterBar(o) {
+      filterBars.push(o);
+      const c = o.primary[0];
+      o.mount.innerHTML = `<div class="filters"><label class="filter">${escapeHtml(c.label)}<select id="${escapeHtml(c.id)}">`
+        + c.options.map((x) => `<option value="${escapeHtml(x.value)}"${String(x.value) === String(c.value) ? ' selected' : ''}>${escapeHtml(x.label)}</option>`).join('')
+        + '</select></label></div>';
+      return { el: o.mount, values: () => ({ [c.id]: c.value }) };
+    },
+  };
+
+  const windowObj = {
+    __BRANDING__: { project: { joinability: 'apply' } },
+    OTB: {
+      escapeHtml,
+      $: (sel) => documentObj.querySelector(sel),
+      num: (v) => Number(v),
+      fmtInt: (n) => String(n),
+      fmtCompact: (n) => String(n),
+      fmtDate: (iso) => String(iso).slice(0, 10),
+      rankLabel: (r) => String(r),
+      toast: (m) => toasts.push(m),
+    },
+    OTBKit: kit,
+    OTBBranding: { currencyLabel: () => 'Credits' },
+    BongosClient: { createClient: () => api },
+    location: locationObj,
+    addEventListener() {},
+  };
+
+  const sandbox = {
+    window: windowObj, document: documentObj, location: locationObj,
+    console: { log() {}, warn() {}, error() {} },
+    setTimeout, clearTimeout, Promise, Date, Math, JSON, Error, isNaN,
+    Number, String, Object, Array, Boolean, Set, Map, RegExp,
+    encodeURIComponent, decodeURIComponent, parseInt, parseFloat,
+  };
+  sandbox.globalThis = sandbox;
+  vm.createContext(sandbox);
+  vm.runInContext(SRC, sandbox, { filename: 'watch.js' });
+  await settle();
+
+  const gate = () => documentObj.getElementById('gate-body');
+  const rowsOut = () => gate().querySelectorAll('li.ov-row');
+  const rowFor = (id) => rowsOut().find((r) => r.getAttribute('data-req-id') === id);
+  const queueReads = () => requests.filter((r) => r.method === 'GET' && r.path.includes('/access-requests?'));
+  const patches = () => requests.filter((r) => r.method === 'PATCH');
+
+  async function click(rowId, action) {
+    const row = rowFor(rowId);
+    assert.ok(row, `no row rendered for request ${rowId}`);
+    const btn = row.querySelector(`[data-gate-action="${action}"]`);
+    assert.ok(btn, `row ${rowId} offers no "${action}" control — got: ${row.innerHTML}`);
+    btn.fire('click', {});
+    await settle();
+    return btn;
+  }
+
+  async function switchView(value) {
+    const bar = filterBars.at(-1);
+    assert.ok(bar, 'the queue offers no view switch');
+    await bar.onChange({ 'gate-status': value });
+    await settle();
+  }
+
+  return {
+    requests, toasts, filterBars, documentObj,
+    gate, rows: rowsOut, rowFor, queueReads, patches, click, switchView, settle,
+    attention: () => documentObj.getElementById('att-access').textContent,
+    lede: () => documentObj.getElementById('gate-scroll').querySelector('.scroll__lede').textContent,
+  };
+}
+
+// ===========================================================================
+// The two-class row (ADR 0201) — the reason this queue is safe to read at all
+// ===========================================================================
+
+await test('every waiting request says whether the platform vouched for the name on it', async () => {
+  const h = await boot();
+  assert.equal(h.rows().length, 2, 'both waiting requests render');
+  for (const row of h.rows()) {
+    assert.ok(row.querySelector('.fact-pill'), `request ${row.getAttribute('data-req-id')} carries no vouch pill`);
+  }
+});
+
+await test('a vouched request reads as vouched and an unvouched one does not', async () => {
+  const h = await boot();
+  const vouched = h.rowFor('7').querySelector('.fact-pill').textContent;
+  const unvouched = h.rowFor('8').querySelector('.fact-pill').textContent;
+  assert.match(vouched, /vouched/i);
+  assert.doesNotMatch(vouched, /unvouched/i, 'the vouched row must not read as unvouched');
+  assert.match(unvouched, /unvouched/i);
+});
+
+await test('an unvouched request wearing a well-known display name is still marked unvouched', async () => {
+  // Both fixtures claim "Mona Lisa" — the impersonation shape the vouch closes.
+  const h = await boot();
+  const impostor = h.rowFor('8');
+  assert.match(impostor.textContent, /Mona Lisa/, 'the claimed name is still shown');
+  assert.match(impostor.querySelector('.fact-pill').textContent, /unvouched/i,
+    'a name anyone could have typed must never render as confirmed');
+});
+
+await test('the vouch changes what the row SAYS, never what it offers (ADR 0016)', async () => {
+  const h = await boot();
+  const verbs = (id) => h.rowFor(id).querySelectorAll('[data-gate-action]').map((b) => b.getAttribute('data-gate-action'));
+  assert.deepEqual(verbs('7'), verbs('8'), 'a vouch is descriptive; it is not authority');
+});
+
+// ===========================================================================
+// Deciding
+// ===========================================================================
+
+await test('a waiting request offers both decisions', async () => {
+  const h = await boot();
+  const verbs = h.rowFor('7').querySelectorAll('[data-gate-action]').map((b) => b.getAttribute('data-gate-action'));
+  assert.deepEqual(verbs, ['invited', 'dismissed']);
+});
+
+await test('Invite PATCHes the request to invited — the one write that admits anyone', async () => {
+  const h = await boot();
+  await h.click('7', 'invited');
+  const p = h.patches();
+  assert.equal(p.length, 1);
+  assert.equal(p[0].path, '/api/bongos/access-requests/7');
+  assert.deepEqual(plain(p[0].body), { status: 'invited' });
+});
+
+await test('Dismiss PATCHes the request to dismissed', async () => {
+  const h = await boot();
+  await h.click('8', 'dismissed');
+  assert.deepEqual(plain(h.patches()[0].body), { status: 'dismissed' });
+});
+
+await test('a decision re-reads the queue, so the row it settled leaves the list', async () => {
+  const h = await boot();
+  const before = h.queueReads().length;
+  await h.click('7', 'invited');
+  assert.ok(h.queueReads().length > before, 'the queue is re-read after a decision');
+});
+
+// ===========================================================================
+// The history, and the rescind ADR 0208 said nothing offered
+// ===========================================================================
+
+await test('the queue offers all three lifecycle states as views', async () => {
+  const h = await boot();
+  const values = plain(h.filterBars.at(-1).primary[0].options).map((o) => o.value);
+  assert.deepEqual(values, ['pending', 'invited', 'dismissed']);
+});
+
+await test('switching to the admitted view re-reads the queue at that status', async () => {
+  const h = await boot();
+  await h.switchView('invited');
+  assert.match(h.queueReads().at(-1).path, /status=invited/);
+});
+
+await test('an admitted request offers Rescind, and it PATCHes back to dismissed', async () => {
+  const h = await boot();
+  await h.switchView('invited');
+  const btn = h.rowFor('3').querySelector('[data-gate-action]');
+  assert.match(btn.textContent, /Rescind/);
+  await h.click('3', 'dismissed');
+  assert.deepEqual(plain(h.patches().at(-1).body), { status: 'dismissed' });
+  assert.equal(h.patches().at(-1).path, '/api/bongos/access-requests/3');
+});
+
+await test('a declined request offers no decision — reviving one is the invite form, not a button', async () => {
+  const h = await boot();
+  await h.switchView('dismissed');
+  assert.equal(h.rowFor('2').querySelectorAll('[data-gate-action]').length, 0);
+  assert.ok(h.gate().querySelector('#gate-invite'), 'the invite form the server names is still on the page');
+});
+
+await test('a decided request names who decided it and when', async () => {
+  const h = await boot();
+  await h.switchView('invited');
+  const text = h.rowFor('3').textContent;
+  assert.match(text, /Admitted/);
+  assert.match(text, /@theowner/);
+  assert.match(text, /2026-08-02/);
+});
+
+await test('a refused rescind shows the server sentence, not [object Object]', async () => {
+  const h = await boot({
+    patchResult: fail(409, 'already_member',
+      'They have already signed in, so this request is history — dismissing it would remove nothing.'),
+  });
+  await h.switchView('invited');
+  await h.click('3', 'dismissed');
+  const said = h.toasts.join(' | ');
+  assert.match(said, /already signed in/);
+  assert.doesNotMatch(said, /\[object Object\]/);
+});
+
+// ===========================================================================
+// The board, the empty states, the seal
+// ===========================================================================
+
+await test('the attention tile counts waiting requests only, never the history on screen', async () => {
+  const h = await boot();
+  assert.equal(h.attention(), '2', 'the tile starts on the waiting count');
+  await h.switchView('dismissed');
+  assert.equal(h.attention(), '2',
+    'reading the decided history must not repaint a tile whose own sub line says "pending"');
+});
+
+await test('each view has an empty state in its own words', async () => {
+  const h = await boot({ rows: { pending: [], invited: [], dismissed: [] } });
+  assert.match(h.gate().querySelector('.empty-state').textContent, /No pending access requests/);
+  await h.switchView('invited');
+  assert.match(h.gate().querySelector('.empty-state').textContent, /admitted/i);
+  await h.switchView('dismissed');
+  assert.match(h.gate().querySelector('.empty-state').textContent, /declined/i);
+});
+
+await test('an empty view still offers the invite form and the switch out of it', async () => {
+  const h = await boot({ rows: { pending: [], invited: [], dismissed: [] } });
+  assert.ok(h.gate().querySelector('#gate-invite'));
+  assert.ok(h.gate().querySelector('#gate-view').querySelector('select'));
+});
+
+await test('a 403 seals the section rather than blanking the page', async () => {
+  const h = await boot({ queueStatus: 403 });
+  assert.match(h.gate().textContent, /Archons only/);
+  assert.equal(h.rows().length, 0);
+});
+
+await test('the section lede tells the owner the queue is more than one decision', async () => {
+  const h = await boot();
+  assert.match(h.lede(), /decided/i);
+});
+
+summary();