@bongos/core 1.19.561 → 1.19.563

package/tests/project_invite_ui.mjs

@@ -48,7 +48,8 @@ const END = SCRIPT.indexOf('/* ── boot: who am I');
 assert.ok(START > 0, 'the invite region must start at INVITE_MOUNTS');
 assert.ok(END > START, 'the invite region must end before the boot block');
 const REGION = SCRIPT.slice(START, END);
-for (const fn of ['function setInviteSlug(', 'function doInvite(', 'function skipInvite(', 'function inviteRefusal(']) {
+for (const fn of ['function setInviteSlug(', 'function doInvite(', 'function skipInvite(', 'function inviteRefusal(',
+  'function setInviteSuggestions(', 'function renderInviteSugg(', 'function loadInviteSuggestions(']) {
   assert.ok(REGION.includes(fn), `the region must carry ${fn}`);
 }
 
@@ -59,24 +60,43 @@ for (const fn of ['function setInviteSlug(', 'function doInvite(', 'function ski
 const ROW = /<li><b>([^<]*)<\/b><small>([^<]*)<\/small><\/li>/g;
 const parseRows = (html) => [...String(html).matchAll(ROW)].map((m) => ({ login: m[1], said: m[2] }));
 
+// A suggestion row: whatever the row NAMES, plus the login its button carries.
+// Parsed off the button so the test reads the address the click will actually
+// send, not the label a row happened to render.
+const SUGG = /<li><span class="suggWho">(.*?)<\/span><button [^>]*data-invite-pick="([^"]*)"[^>]*>/g;
+const parseSugg = (html) => [...String(html).matchAll(SUGG)].map((m) => ({ named: m[1], login: m[2] }));
+
 function boot({ mount = 'wizInvite', answers = [] } = {}) {
   const requests = [];
   const els = new Map();
   const listeners = new Map();          // "elId:type" → [fn]
   const focused = [];
 
-  const makeEl = (id) => ({
-    _id: id, _html: '', textContent: '', className: '', value: '', hidden: false,
-    set innerHTML(v) { this._html = String(v); },
-    get innerHTML() { return this._html; },
-    addEventListener(type, fn) {
-      const key = id + ':' + type;
-      if (!listeners.has(key)) listeners.set(key, []);
-      listeners.get(key).push(fn);
-    },
-    setAttribute() {},
-    focus() { focused.push(id); },
-  });
+  const makeEl = (id) => {
+    const classes = new Set();
+    return {
+      _id: id, _html: '', textContent: '', className: '', value: '', hidden: false,
+      _classes: classes,
+      set innerHTML(v) { this._html = String(v); },
+      get innerHTML() { return this._html; },
+      // task 1002347 (R28): the suggestion surface shows its reason line the
+      // .modWhy way — a class toggle, not a hidden flag — so the stub grows the
+      // one DOM affordance that answer needs.
+      classList: {
+        toggle(name, on) { if (on) classes.add(name); else classes.delete(name); },
+        add(name) { classes.add(name); },
+        remove(name) { classes.delete(name); },
+        contains(name) { return classes.has(name); },
+      },
+      addEventListener(type, fn) {
+        const key = id + ':' + type;
+        if (!listeners.has(key)) listeners.set(key, []);
+        listeners.get(key).push(fn);
+      },
+      setAttribute() {},
+      focus() { focused.push(id); },
+    };
+  };
   const $ = (id) => {
     if (id == null) return null;
     if (!els.has(id)) els.set(id, makeEl(id));
@@ -86,7 +106,9 @@ function boot({ mount = 'wizInvite', answers = [] } = {}) {
   // Every mount's elements exist before the region wires them, exactly as the
   // real page has them: the script runs at the end of <body>.
   ['wizInvite', 'wizInviteWho', 'wizInviteList', 'wizInviteMsg', 'wizInviteLater', 'doneStepsHead',
-    'mInvite', 'mInviteWho', 'mInviteList', 'mInviteMsg'].forEach($);
+    'wizInviteWhy', 'wizInviteSugg',
+    'mInvite', 'mInviteWho', 'mInviteList', 'mInviteMsg',
+    'mInviteWhy', 'mInviteSugg'].forEach($);
 
   const queued = answers.slice();
   const fetch = (url, init = {}) => {
@@ -113,19 +135,20 @@ function boot({ mount = 'wizInvite', answers = [] } = {}) {
   vm.runInContext(REGION, sandbox, { filename: 'projects.html#project-invite' });
 
   const mounts = {
-    wizInvite: { who: 'wizInviteWho', list: 'wizInviteList', msg: 'wizInviteMsg' },
-    mInvite: { who: 'mInviteWho', list: 'mInviteList', msg: 'mInviteMsg' },
+    wizInvite: { who: 'wizInviteWho', list: 'wizInviteList', msg: 'wizInviteMsg', why: 'wizInviteWhy', sugg: 'wizInviteSugg' },
+    mInvite: { who: 'mInviteWho', list: 'mInviteList', msg: 'mInviteMsg', why: 'mInviteWhy', sugg: 'mInviteSugg' },
   };
   const m = mounts[mount];
   const settle = async () => { for (let i = 0; i < 40; i++) await Promise.resolve(); };
 
+  let pickLogin = '';
   const press = async (marker) => {
     const handlers = listeners.get(mount + ':click') || [];
     assert.equal(handlers.length, 1, 'the mount wires exactly one delegated click handler');
     handlers[0]({
       target: {
-        closest: (sel) => (sel === '[data-invite-send],[data-invite-skip]'
-          ? { hasAttribute: (a) => a === marker }
+        closest: (sel) => (sel === '[data-invite-send],[data-invite-skip],[data-invite-pick]'
+          ? { hasAttribute: (a) => a === marker, getAttribute: () => pickLogin }
           : null),
       },
     });
@@ -142,6 +165,13 @@ function boot({ mount = 'wizInvite', answers = [] } = {}) {
     async type(login) { $(m.who).value = login; },
     async send() { await press('data-invite-send'); },
     async skip() { await press('data-invite-skip'); },
+    // ── the suggestion half (task 1002347, BV1.R28) ──────────────────────
+    why: () => $(m.why),
+    whyOn: () => $(m.why)._classes.has('on'),
+    suggested: () => parseSugg($(m.sugg).innerHTML),
+    async suggest(payload) { sandbox.setInviteSuggestions(mount, payload); await settle(); },
+    async load(instanceId) { sandbox.loadInviteSuggestions(mount, instanceId); await settle(); },
+    async pick(login) { pickLogin = login; await press('data-invite-pick'); },
     async enter() {
       const handlers = listeners.get(m.who + ':keydown') || [];
       assert.equal(handlers.length, 1, 'the field takes Enter');
@@ -500,3 +530,126 @@ test('the manage view has a rendered state for the invite line', () => {
   assert.ok(states['in-manage-invite'], 'the section has a kit state');
   assert.deepEqual(states['in-manage-invite'].expect.visible, ['#mInvite', '#mInvite h2', '#mInviteWho', '#mInvite [data-invite-send]']);
 });
+
+// ── who is worth inviting (task 1002347, BV1.R28, ADR 0251) ──────────────────
+// The engine states WHAT to look for and never who (ADR 0239 §6); these are the
+// names, and the rules they must not break: the reason is always said, "nobody"
+// is an answer rather than a blank, and a picked name takes the SAME write path
+// as a typed one.
+
+test('a suggestion list renders its names, and each row carries the login its button will send', async () => {
+  const h = boot();
+  await h.open('mercury');
+  await h.suggest({
+    suggested: [
+      { github_login: 'ada', display_name: 'Ada L', total_tasks_shipped: 12, project_count: 3 },
+      { github_login: 'grace', display_name: null, total_tasks_shipped: 0, project_count: 0 },
+    ],
+    seeking: { kind: 'top-builders', limit: 3 },
+    reason: 'A small team is the shape that fills fastest.',
+  });
+  assert.deepEqual(h.suggested().map((r) => r.login), ['ada', 'grace']);
+  assert.match(h.suggested()[0].named, /Ada L/, 'a display name is used when the row carries one');
+  assert.match(h.suggested()[0].named, /@ada/, 'and the login is still shown — it is the address');
+  assert.match(h.suggested()[1].named, /<b>@grace<\/b>/, 'with no display name the login stands alone');
+});
+
+test('the reason is ALWAYS said — including when the answer is nobody', async () => {
+  const h = boot();
+  await h.open('mercury');
+  await h.suggest({ suggested: [], seeking: null, reason: 'You said you are building alone, so nobody is suggested.' });
+  assert.equal(h.suggested().length, 0, 'no names');
+  assert.equal(h.why().textContent, 'You said you are building alone, so nobody is suggested.');
+  assert.ok(h.whyOn(), 'and the line is shown — "nobody" is an answer, not a blank state');
+});
+
+test('no payload at all says nothing — a failed lookup must not invent a reason', async () => {
+  const h = boot();
+  await h.open('mercury');
+  await h.suggest(null);
+  assert.equal(h.suggested().length, 0);
+  assert.equal(h.why().textContent, '');
+  assert.ok(!h.whyOn(), 'the reason line is off entirely, not empty-but-present');
+});
+
+test('picking a suggestion sends exactly what typing that name would have sent', async () => {
+  const h = boot();
+  await h.open('mercury');
+  await h.suggest({ suggested: [{ github_login: 'ada' }], seeking: { kind: 'top-builders', limit: 3 }, reason: 'r' });
+  await h.pick('ada');
+  const posts = h.requests.filter((r) => r.method === 'POST');
+  assert.equal(posts.length, 1, 'one invite, through the one write path');
+  assert.deepEqual(JSON.parse(posts[0].body), { client_id: 'mercury', github_login: 'ada' },
+    'the same body shape as a typed invite — the slug IS the client_id');
+});
+
+test('a name invited this session stops being suggested — the pending line is its receipt', async () => {
+  const h = boot();
+  await h.open('mercury');
+  await h.suggest({ suggested: [{ github_login: 'ada' }, { github_login: 'grace' }], seeking: { kind: 'top-builders', limit: 3 }, reason: 'r' });
+  assert.equal(h.suggested().length, 2);
+  await h.pick('ada');
+  assert.deepEqual(h.suggested().map((r) => r.login), ['grace'], 'ada moved to the pending list and left the suggestions');
+  assert.deepEqual(h.rows().map((r) => r.login), ['ada'], 'and she is on the pending list exactly once');
+});
+
+test('switching the mount to another project drops the suggestions with the pending rows', async () => {
+  const h = boot();
+  await h.open('mercury');
+  await h.suggest({ suggested: [{ github_login: 'ada' }], seeking: { kind: 'top-builders', limit: 3 }, reason: 'r' });
+  await h.open('venus');
+  assert.equal(h.suggested().length, 0, 'the names belonged to the project they were suggested for');
+  assert.ok(!h.whyOn(), 'and so did the reason');
+});
+
+test('the suggestions read is own-scoped by ADDRESS: it asks the instance route, with the session', async () => {
+  const h = boot({ answers: [{ ok: true, status: 200, body: { suggested: [{ github_login: 'ada' }], seeking: { kind: 'top-builders', limit: 3 }, reason: 'r' } }] });
+  await h.open('mercury');
+  await h.load(41);
+  const get = h.requests.find((r) => r.method === 'GET');
+  assert.equal(get.url, '/api/bongos/provisioning/instances/41/invite-suggestions');
+  assert.equal(get.credentials, 'same-origin', 'the cookie is the whole gate — the route 404s for anyone else');
+  assert.deepEqual(h.suggested().map((r) => r.login), ['ada']);
+});
+
+test('no instance id asks nothing at all', async () => {
+  const h = boot();
+  await h.open('mercury');
+  await h.load('');
+  assert.equal(h.requests.filter((r) => r.method === 'GET').length, 0, 'no project, no question');
+});
+
+test('a refused or unreachable lookup is SILENT — a created project never looks broken over an extra', async () => {
+  for (const answer of [{ ok: false, status: 404, body: {} }, { reject: true }]) {
+    const h = boot({ answers: [answer] });
+    await h.open('mercury');
+    await h.load(41);
+    assert.equal(h.suggested().length, 0, 'no names');
+    assert.equal(h.msg().textContent, '', 'and NOT a word in the invite message line');
+  }
+});
+
+test('a suggestion never renders a github_id, and its name goes through the escaper', async () => {
+  const h = boot();
+  await h.open('mercury');
+  await h.suggest({
+    suggested: [{ github_login: 'x"><img src=x onerror=1>', display_name: '<b>bad</b>', github_id: 4242, total_tasks_shipped: 1 }],
+    seeking: { kind: 'top-builders', limit: 3 },
+    reason: 'r',
+  });
+  const html = h.sandbox.$('wizInviteSugg').innerHTML;
+  assert.doesNotMatch(html, /4242/, 'the id names someone who has accepted nothing');
+  assert.doesNotMatch(html, /<img/, 'the login is escaped inside the attribute it rides in');
+  assert.doesNotMatch(html, /<b>bad<\/b>/, 'and the display name is escaped in the body');
+});
+
+test('the suggestion surface is mounted on BOTH the wizard and the project page', () => {
+  assert.match(HUB, /<ul class="suggList" id="wizInviteSugg"><\/ul>/, 'the wizard mount');
+  assert.match(HUB, /<ul class="suggList" id="mInviteSugg"><\/ul>/, 'and the project page mount');
+  assert.match(SCRIPT, /loadInviteSuggestions\('wizInvite', \(me && created && created\.slug\) \? created\.id : ''\)/,
+    'the wizard asks keyed on the SAME created record the slug comes from (ADR 0249 §1)');
+  assert.match(SCRIPT, /loadInviteSuggestions\('mInvite', inst\.slug \? inst\.id : ''\)/,
+    'and the manage page asks with the id whose read already proved ownership');
+  assert.match(COSMOS, /\.suggList\{/, 'styled in cosmos.css like its sibling list');
+  assert.doesNotMatch(HUB.slice(0, HUB.indexOf('</head>') + 1), /suggList/, 'not in the page head');
+});