@bongos/core 1.19.505 → 1.19.507

package/tests/sessions_kit_pager.mjs

@@ -0,0 +1,312 @@
+// tests/sessions_kit_pager.mjs — the session log pages on the KIT's contract, not
+// its own (goal 1000072, the migration task 1003281 left behind).
+//
+// WHY THIS FILE EXISTS. `sessions.js` was the hall's one sanctioned hand-rolled
+// pager — audited as an exception at task 2179 because the kit could only slice an
+// array the browser already held, and the session corpus cannot be held. Task 1003281
+// added the server-offset mode to the kit and explicitly deferred the migration:
+// "sessions.js stays as it is; migrating it is its own task." This is that task, and
+// an exception removed without a test is an exception waiting to be re-added.
+//
+// It runs the REAL hall-kit.js and the REAL sessions.js in one vm against a stub DOM
+// and a fake API (the profile_activity.mjs idiom), so what is asserted is the request
+// the page actually issues and the bar a reader actually sees — not a stub of the kit
+// agreeing with a stub of the page.
+//
+// The five behaviours the migration had to keep or gain:
+//   1. it asks the SERVER for one page (the corpus is never pulled into the browser)
+//   2. a page click moves the offset by the reader's per-page, not a fixed 50
+//   3. per-page is a real control now, and it resets to page 1 and persists
+//   4. a failed fetch ROLLS BACK the pager — the bar may never claim a page whose
+//      rows never arrived (the one piece of the hand-roll worth keeping)
+//   5. nothing is pressable while a fetch is in flight
+//
+// Run:  node tests/sessions_kit_pager.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 } from './helpers.mjs';
+
+const ROOT = path.resolve(path.dirname(fileURLToPath(import.meta.url)), '..');
+const read = (rel) => fs.readFileSync(path.join(ROOT, rel), 'utf8');
+const KIT_JS = read('modules/hall-ui/public/hall-kit.js');
+const SESSIONS_JS = read('modules/hall-ui/public/sessions.js');
+const SESSIONS_HTML = read('modules/hall-ui/public/sessions.html');
+
+const { test, summary } = makeRunner();
+const tick = () => new Promise((r) => setTimeout(r, 0));
+
+// ---------------------------------------------------------------------------
+// the harness: a stub DOM just rich enough for the kit's ids + the page's cells
+// ---------------------------------------------------------------------------
+
+function makeEl(id) {
+  const listeners = new Map();
+  return {
+    id,
+    innerHTML: '', textContent: '', value: '',
+    hidden: false, disabled: false,
+    options: [], style: {}, dataset: {},
+    classList: { add() {}, remove() {}, toggle() {} },
+    addEventListener(ev, fn) {
+      if (!listeners.has(ev)) listeners.set(ev, []);
+      listeners.get(ev).push(fn);
+    },
+    fire(ev, arg) { for (const fn of listeners.get(ev) || []) fn(arg); },
+    listenerCount(ev) { return (listeners.get(ev) || []).length; },
+  };
+}
+
+// `rank: 'metic'` is the gate sessions.js applies before it fetches anything.
+function harness({ total = 320, failAfter = null, viewerRank = 'metic', perPagePref = null, dropKit = false } = {}) {
+  const els = new Map();
+  const getEl = (id) => {
+    if (!els.has(id)) els.set(id, makeEl(id));
+    return els.get(id);
+  };
+  const documentObj = {
+    documentElement: { dataset: {}, style: {}, classList: { add() {}, remove() {} } },
+    getElementById: getEl,
+    querySelector(sel) { return getEl(String(sel).replace(/^#/, '')); },
+    querySelectorAll() { return []; },
+    createElement() { return makeEl(); },
+    addEventListener() {},
+  };
+
+  const requests = [];
+  let calls = 0;
+  const rowsFor = (limit, offset) => Array.from(
+    { length: Math.max(0, Math.min(limit, total - offset)) },
+    (_, i) => ({ session_id: `sid-${offset + i}`, builder_id: 1, github_login: 'jaxri', rank: 'metic', task_ids: [], assistant_turns: 3, total_tokens: 100, tool_errors: 0, duration_seconds: 60, uploaded_at: '2026-08-01T00:00:00Z' })
+  );
+
+  const client = {
+    request: async (method, url) => {
+      requests.push(url);
+      if (url.endsWith('/me')) {
+        return { status: 200, ok: true, data: { builder: { id: 1, rank: viewerRank } } };
+      }
+      if (url.includes('/sessions/search')) {
+        calls += 1;
+        if (failAfter != null && calls > failAfter) return { status: 500, ok: false, data: null };
+        const q = new URLSearchParams(url.split('?')[1] || '');
+        const limit = Number(q.get('limit'));
+        const offset = Number(q.get('offset'));
+        return {
+          status: 200,
+          ok: true,
+          data: { sessions: rowsFor(limit, offset), totals: { total, builders: 3 } },
+        };
+      }
+      return { status: 404, ok: false, data: null };
+    },
+  };
+
+  const store = new Map();
+  // Seeded BEFORE the scripts run — makePager reads the preference at boot, so this is
+  // the only way to model a returning reader.
+  if (perPagePref != null) store.set('otb.sessions.perPage', String(perPagePref));
+  const windowObj = {
+    BongosClient: { createClient: () => client },
+    location: { assign() {} },
+    localStorage: {
+      getItem: (k) => (store.has(k) ? store.get(k) : null),
+      setItem: (k, v) => store.set(k, String(v)),
+    },
+    scrollTo() {},
+    addEventListener() {},
+    OTB: {
+      escapeHtml: (s) => String(s == null ? '' : s),
+      $: (sel) => documentObj.querySelector(sel),
+      num: (n) => Number(n) || 0,
+      fmtInt: (n) => String(Number(n) || 0),
+      fmtCompact: (n) => String(Number(n) || 0),
+      fmtDate: (iso) => String(iso ?? '').slice(0, 10),
+      rankLabel: (r) => String(r ?? ''),
+      toast() {},
+    },
+  };
+
+  const sandbox = {
+    window: windowObj, document: documentObj, location: windowObj.location,
+    console: { error() {}, warn() {}, log() {} },
+    setTimeout, clearTimeout, URLSearchParams,
+  };
+  sandbox.globalThis = sandbox;
+  vm.createContext(sandbox);
+  // The real kit first — that is the point: the page is held to the shipped contract.
+  vm.runInContext(KIT_JS, sandbox, { filename: 'hall-kit.js' });
+  if (dropKit) delete sandbox.window.OTBKit;
+  vm.runInContext(SESSIONS_JS, sandbox, { filename: 'sessions.js' });
+
+  const searches = () => requests.filter((u) => u.includes('/sessions/search'));
+  const q = (n) => {
+    const list = searches();
+    const url = list[n < 0 ? list.length + n : n];
+    return Object.fromEntries(new URLSearchParams(url.split('?')[1]));
+  };
+  return { els, getEl, searches, q, store, kit: sandbox.window.OTBKit };
+}
+
+// ---------------------------------------------------------------------------
+// 1. the page markup no longer carries a pager of its own
+// ---------------------------------------------------------------------------
+
+await test('sessions.html carries a mount, not a hand-rolled pager', () => {
+  assert.ok(!/id="ledger-pager"/.test(SESSIONS_HTML), 'the bespoke <nav class="pager"> is gone');
+  assert.ok(!/id="pager-(prev|next|pos)"/.test(SESSIONS_HTML), 'its bespoke button ids are gone');
+  assert.match(SESSIONS_HTML, /id="sessions-pager-mount"/);
+  assert.match(SESSIONS_HTML, /hall-kit\.js/, 'the kit must load on this page now');
+  // The kit must be loaded BEFORE the page script that reads window.OTBKit at boot.
+  assert.ok(SESSIONS_HTML.indexOf('hall-kit.js') < SESSIONS_HTML.indexOf('sessions.js?'),
+    'hall-kit.js must come before sessions.js');
+  // The pager mount stays OUTSIDE the horizontal scrollport, or it slides away with
+  // the columns on a narrow screen.
+  const wrapEnd = SESSIONS_HTML.indexOf('</div>', SESSIONS_HTML.indexOf('ledger-table-wrap'));
+  assert.ok(SESSIONS_HTML.indexOf('sessions-pager-mount') > wrapEnd,
+    'the pager mount must not be inside .ledger-table-wrap');
+});
+
+await test('sessions.js hand-rolls no pager state any more', () => {
+  assert.ok(!/const PAGE_SIZE\b/.test(SESSIONS_JS), 'the fixed page size is gone');
+  assert.ok(!/state\.offset/.test(SESSIONS_JS.replace(/^\s*\/\/.*$/gm, '')),
+    'the hand-rolled offset cursor is gone (comments may still explain it)');
+  for (const fn of ['makePager', 'pagerBarHtml', 'wirePager', 'pageOffset', 'renderServerPage']) {
+    assert.ok(SESSIONS_JS.includes(`kit.${fn}`), `sessions.js must use the kit's ${fn}`);
+  }
+});
+
+// ---------------------------------------------------------------------------
+// 2. what the page actually does, executed
+// ---------------------------------------------------------------------------
+
+await test('the first load asks the SERVER for one page — the corpus is never held', async () => {
+  const h = harness({ total: 320 });
+  await tick(); await tick();
+  assert.equal(h.searches().length, 1);
+  const p = h.q(0);
+  assert.equal(p.offset, '0');
+  assert.equal(p.limit, '50', 'the page keeps its historical 50 as the default per-page');
+  assert.equal(p.order, 'recent');
+});
+
+await test('Next moves the offset by the reader\'s per-page, and the bar says where they are', async () => {
+  const h = harness({ total: 320 });
+  await tick(); await tick();
+  h.getEl('sessions-next').fire('click');
+  await tick(); await tick();
+  assert.equal(h.searches().length, 2);
+  assert.equal(h.q(-1).offset, '50');
+  assert.equal(h.getEl('sessions-page').textContent, 'Page 2 of 7');
+  assert.equal(h.getEl('sessions-range').textContent, 'Showing 51–100 of 320');
+  assert.equal(h.getEl('sessions-pager').hidden, false);
+});
+
+await test('per-page is a real control now: it re-asks, resets to page 1, and persists', async () => {
+  const h = harness({ total: 320 });
+  await tick(); await tick();
+  h.getEl('sessions-next').fire('click');
+  await tick(); await tick();
+  assert.equal(h.q(-1).offset, '50', 'sanity: on page 2');
+
+  const sel = h.getEl('sessions-per-page');
+  sel.fire('change', { target: { value: '100' } });
+  await tick(); await tick();
+  const p = h.q(-1);
+  assert.equal(p.limit, '100', 'the new page size reaches the server');
+  assert.equal(p.offset, '0', 'a per-page change returns to page 1');
+  assert.equal(h.store.get('otb.sessions.perPage'), '100', 'the choice is remembered');
+  assert.equal(h.getEl('sessions-page').textContent, 'Page 1 of 4');
+});
+
+await test('a remembered per-page is used on the very first request of the next visit', async () => {
+  // The point of persisting it: a returning reader does not have to set it again, and
+  // does not first get a page at the default size and then a second one at theirs.
+  const h = harness({ total: 320, perPagePref: 25 });
+  await tick(); await tick();
+  assert.equal(h.searches().length, 1, 'one request, not a default page then a corrected one');
+  assert.equal(h.q(0).limit, '25');
+  assert.equal(h.getEl('sessions-page').textContent, 'Page 1 of 13');
+});
+
+await test('a junk stored preference falls back to the default rather than to nothing', async () => {
+  // localStorage is reader-writable and survives across releases; a value the option
+  // list no longer offers must not become the page size.
+  const h = harness({ total: 320, perPagePref: 'lots' });
+  await tick(); await tick();
+  assert.equal(h.q(0).limit, '50');
+});
+
+await test('a failed page ROLLS BACK — the bar never claims a page whose rows never came', async () => {
+  // failAfter: 1 → the first load succeeds, every page click after it 500s.
+  const h = harness({ total: 320, failAfter: 1 });
+  await tick(); await tick();
+  assert.equal(h.getEl('sessions-page').textContent, 'Page 1 of 7');
+
+  h.getEl('sessions-next').fire('click');
+  await tick(); await tick();
+  assert.equal(h.searches().length, 2, 'it did try');
+  assert.equal(h.getEl('sessions-page').textContent, 'Page 1 of 7',
+    'the failed page 2 must not be left showing in the bar');
+  assert.equal(h.getEl('sessions-range').textContent, 'Showing 1–50 of 320',
+    'and the range must still describe the rows that are actually in the table');
+});
+
+await test('a failed per-page change rolls the SIZE back too', async () => {
+  const h = harness({ total: 320, failAfter: 1 });
+  await tick(); await tick();
+  h.getEl('sessions-per-page').fire('change', { target: { value: '10' } });
+  await tick(); await tick();
+  h.getEl('sessions-next').fire('click');
+  await tick(); await tick();
+  // Back on the 50-row page 1, the only page whose rows ever arrived, so Next asks
+  // for offset 50 and not offset 10.
+  assert.equal(h.q(-1).limit, '50', 'the rolled-back size is what the next request uses');
+});
+
+await test('nothing is pressable while a fetch is in flight', async () => {
+  const h = harness({ total: 320 });
+  await tick(); await tick();
+  assert.equal(h.getEl('sessions-per-page').disabled, false, 'idle: the control is live');
+  assert.equal(h.getEl('sessions-next').disabled, false);
+  h.getEl('sessions-next').fire('click');
+  // deliberately not awaited — this is mid-flight
+  assert.equal(h.getEl('sessions-next').disabled, true, 'in flight: Next is dead');
+  assert.equal(h.getEl('sessions-prev').disabled, true, 'in flight: Prev is dead');
+  assert.equal(h.getEl('sessions-per-page').disabled, true, 'in flight: per-page is dead');
+  await tick(); await tick();
+  assert.equal(h.getEl('sessions-per-page').disabled, false, 'landed: live again');
+});
+
+await test('Prev stays dead on page 1 — the kit decides that, not the page', async () => {
+  const h = harness({ total: 320 });
+  await tick(); await tick();
+  assert.equal(h.getEl('sessions-prev').disabled, true, 'page 1 has nothing before it');
+  assert.equal(h.getEl('sessions-next').disabled, false);
+});
+
+await test('a corpus that fits one page shows no bar at all', async () => {
+  const h = harness({ total: 8 });
+  await tick(); await tick();
+  assert.equal(h.getEl('sessions-pager').hidden, true);
+});
+
+await test('a missing kit degrades to a named failure, not a blank page', async () => {
+  // The kit is a separate <script>; a cache miss must not throw at parse time and take
+  // the whole page — including the rank gate — down with it.
+  const h = harness({ total: 320, dropKit: true });
+  await tick(); await tick();
+  assert.equal(h.searches().length, 0, 'no corpus request without a pager to place it');
+  assert.match(h.getEl('ledger-sub').textContent, /could not be loaded/);
+});
+
+await test('the rank gate still runs before any corpus request', async () => {
+  const h = harness({ total: 320, viewerRank: 'xenos' });
+  await tick(); await tick();
+  assert.equal(h.searches().length, 0, 'a xenos must not even ask');
+  assert.equal(h.getEl('gate-scroll').hidden, false, 'they get the sealed notice');
+});
+
+summary();