@bongos/core 1.19.1012 → 1.19.1014

package/tests/helpers.mjs

@@ -736,249 +736,217 @@ export function bootIdeaPage({ idea = null, status = 200, template = null, viewe
 // One microtask turn — profile.js boots through a chain of awaits.
 export const settle = () => new Promise((r) => setTimeout(r, 0));
 
-// bootThinkingPage — boot the REAL modules/hall-ui/public/thinking.js in a vm
-// against a stub DOM, and hand back what it wrote into each of the page's four
-// regions plus every request it made.
+// bootSkyPage — boot THE SKY for real: the REAL modules/hall-ui/public/thinking.html
+// markup, the REAL idea-objects.js and the REAL seven sky-*.js files, in a vm
+// against a stub DOM, a stub canvas and a stub client (task 1004231 / sky part 3
+// of 5, goal 1000095; ADR 0331).
 //
-// The third sibling of bootProfilePage / bootIdeaPage, and here for the reason
-// the second one is: THE ROOM (task 1004098 / BV2.R03) is asserted at the
-// RENDERED layer. Everything this page shows already has a server-side test —
-// the five states, size, the descent, brightness — and every one of them can
-// still reach a reader wrong, because what a reader is handed is HTML. Testing
-// the read alone is exactly how a renderer bug survives (the first of the three
-// findings inherited from abandoned task 1004054).
+// The successor of bootThinkingPage (the room, task 1004098) and the first
+// bootSkyPage (the ambient sky, task 1004105), which this page replaced. It
+// keeps their two rules — the real vocabulary is never stubbed, and every row
+// goes in shaped the way the route shapes one — and adds a third: THE MARKUP
+// IS THE PAGE'S OWN. The seven scripts wire ~60 elements by id at load and
+// read `.brand h1`'s first text node, so a stub that invented elements on
+// demand would pass a page whose html had lost a button. The body of
+// thinking.html is parsed into the mini-DOM below and that is what the
+// scripts find.
 //
-// THE REAL idea-objects.js IS LOADED INTO THE SAME SANDBOX, never stubbed. It
-// is half of the decision this page makes — the server says WHICH object, that
-// file says what the object is CALLED — so a suite that stubbed it would assert
-// the page renders a label the suite itself invented.
-const THINKING_JS = fs.readFileSync(path.join(ROOT, 'modules/hall-ui/public/thinking.js'), 'utf8');
-const IDEA_OBJECTS_JS = fs.readFileSync(path.join(ROOT, 'modules/hall-ui/public/idea-objects.js'), 'utf8');
-export function bootThinkingPage({ pages = [], viewer = { id: 95 }, meStatus = 200, trailStatus = 200 } = {}) {
-  const els = new Map();
-  const makeEl = () => ({
-    dataset: {}, style: {}, textContent: '', hidden: false, _html: '',
-    classList: { add() {}, remove() {}, toggle() { return false; }, contains() { return false; } },
-    setAttribute() {}, getAttribute() { return null; }, addEventListener() {},
-    querySelector() { return null; }, querySelectorAll() { return []; }, appendChild() {},
-    set innerHTML(v) { this._html = String(v); }, get innerHTML() { return this._html; },
-  });
-  const documentObj = {
-    title: '',
-    body: { dataset: { page: 'thinking' } },
-    documentElement: { dataset: {}, style: {}, classList: { add() {}, remove() {} } },
-    getElementById(id) { if (!els.has(id)) els.set(id, makeEl()); return els.get(id); },
-    querySelector(sel) { return this.getElementById(String(sel).replace(/^#/, '')); },
-    querySelectorAll() { return []; },
-    createElement() { return makeEl(); },
-    addEventListener() {},
-  };
-
-  // The kit's tab strip, reduced to what the page actually uses: the ids it was
-  // built with, a per-id count, a per-id hidden flag and a way to activate one.
-  // `querySelector` here answers a REAL object rather than null, because the
-  // page's "hide a filter nobody has any of" rule is a behaviour the suite must
-  // be able to read — a stub answering null for every selector would make that
-  // rule untestable while looking exactly like a passing one.
-  const tabState = { ids: [], counts: {}, hidden: {}, active: null, onChange: null };
-  const tabsEl = makeEl();
-  tabsEl.querySelector = (sel) => {
-    const m = /\[data-tab="(.+)"\]/.exec(String(sel));
-    if (!m) return null;
-    const id = m[1];
-    if (!tabState.ids.includes(id)) return null;
-    return { set hidden(v) { tabState.hidden[id] = !!v; }, get hidden() { return !!tabState.hidden[id]; } };
-  };
-
-  const requests = [];
-  const client = {
-    request: async (method, url) => {
-      requests.push(url);
-      if (/\/me$/.test(url)) {
-        return meStatus === 200
-          ? { status: 200, ok: true, data: { builder: viewer } }
-          : { status: meStatus, ok: false, data: null };
-      }
-      if (trailStatus !== 200) return { status: trailStatus, ok: false, data: null };
-      const offset = Number((/offset=(\d+)/.exec(url) || [])[1] || 0);
-      // The caller supplies whole PAGES keyed by offset, so the page's
-      // background paging loop is exercised rather than bypassed — the figures
-      // over the list are a claim about a whole trail, and a stub that always
-      // answered the first window would never let that claim be wrong.
-      const page = pages.find((p) => Number(p.offset || 0) === offset) || { ideas: [], total: 0 };
-      return { status: 200, ok: true, data: page };
-    },
-  };
-
-  const windowObj = {
-    __BRANDING__: {}, __MODULES__: { enabled: {} },
-    BongosClient: { createClient: () => client },
-    CSS: { escape: (s) => String(s) },
-    OTB: {
-      escapeHtml: (s) => String(s == null ? '' : s).replace(/[&<>"']/g, (c) => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;' }[c])),
-      $: (sel) => documentObj.querySelector(sel),
-      fmtDate: (iso) => String(iso ?? '').slice(0, 10),
-      toast() {},
-    },
-    OTBKit: {
-      makeTabs({ tabs = [], onChange = null }) {
-        tabState.ids = tabs.map((t) => t.id);
-        tabState.labels = tabs.map((t) => t.label);
-        tabState.onChange = onChange;
-        tabState.active = tabs.length ? tabs[0].id : null;
-        return {
-          el: tabsEl,
-          active: () => tabState.active,
-          activate(id) { tabState.active = id; if (onChange) onChange(id); },
-          setCount(id, n) { tabState.counts[id] = n; },
-        };
-      },
-    },
-    location: { hostname: 'builders.cloudbongos.com', search: '', pathname: '/thinking', hash: '', assign() {} },
-    localStorage: { getItem: () => null, setItem() {} },
-    addEventListener() {},
-  };
-
-  const sandbox = {
-    window: windowObj, document: documentObj, location: windowObj.location,
-    console, setTimeout, clearTimeout, URLSearchParams,
-  };
-  sandbox.globalThis = sandbox;
-  vm.createContext(sandbox);
-  vm.runInContext(IDEA_OBJECTS_JS, sandbox, { filename: 'idea-objects.js' });
-  vm.runInContext(THINKING_JS, sandbox, { filename: 'thinking.js' });
+// What a test can do with what comes back: read any element by id (`rows()`
+// is the drawer, `panel()` the panel, `stats()` the figures line), press a key
+// the way the window listener hears it (`key('l')`), type into the composer
+// and submit (`type()`, `submit()`), run the pending debounce timers
+// (`timers.flush()`), draw one frame (`frame()`), and read the live state the
+// page keeps on `window.OTBSky.S`. Every request the page made is on
+// `requests` with its body, so a filing can be checked byte for byte against
+// what the hall form sends.
+const SKY_FILES = ['idea-objects.js', 'sky-data.js', 'sky-layout.js', 'sky-draw.js', 'sky-interaction.js', 'sky-panel.js', 'sky-composer.js', 'sky-tour.js'];
+const SKY_SRC = SKY_FILES.map((f) => [f, fs.readFileSync(path.join(ROOT, 'modules/hall-ui/public', f), 'utf8')]);
+const SKY_HTML = fs.readFileSync(path.join(ROOT, 'modules/hall-ui/public/thinking.html'), 'utf8');
+const SKY_BODY = (/<body[^>]*>([\s\S]*)<\/body>/.exec(SKY_HTML) || [, ''])[1].replace(/<script[\s\S]*?<\/script>/g, '');
 
-  return {
-    requests,
-    objects: () => windowObj.OTBIdeaObjects,
-    rows: () => documentObj.getElementById('tr-body').innerHTML,
-    figs: () => documentObj.getElementById('tr-figs').innerHTML,
-    foot: () => documentObj.getElementById('tr-foot'),
-    sub: () => documentObj.getElementById('tr-sub').textContent,
-    tabs: () => tabState,
-    filter: (id) => { tabState.active = id; if (tabState.onChange) tabState.onChange(id); },
-  };
-}
-
-// bootSkyPage — boot the REAL modules/hall-ui/public/sky.js in a vm against a
-// stub DOM, and hand back the field, the panel and the legend it wrote plus
-// every request it made.
-//
-// The fourth sibling of bootProfilePage / bootIdeaPage / bootThinkingPage, and
-// here for the reason the third one is: THE SKY (task 1004105 / BV2.R26) is a
-// DRAWING of facts that are all correct upstream, and the only place it can go
-// wrong is the last step. A glyph is geometry, so the questions this can ask
-// that no server test can are: does a remnant keep its diameter and lose its
-// fill, does an unreadable brightness leave a star lit, does the page draw a
-// second compression curve of its own, and does every thought carry its whole
-// sentence for a reader who cannot see the picture.
-//
-// THE REAL idea-objects.js IS LOADED INTO THE SAME SANDBOX, never stubbed —
-// the same rule bootThinkingPage keeps, and for the sharper reason here: the
-// pair exists so the sky and the room cannot call one object two names, and a
-// suite that stubbed the vocabulary would assert the sky says whatever the
-// suite told it to.
-const SKY_JS = fs.readFileSync(path.join(ROOT, 'modules/hall-ui/public/sky.js'), 'utf8');
 export function bootSkyPage({
-  pages = [], viewer = { id: 95 }, meStatus = 200, trailStatus = 200,
-  goals = null, criteria = {},
+  mine = null, sky = null, versions = null, me = null, template = undefined,
+  viewer = { id: 95, permissions: {} }, status = {}, tourSeen = true, storage = {},
+  innerWidth = 1280, innerHeight = 800, reduce = true,
 } = {}) {
-  const els = new Map();
-  const listeners = new Map();
-  const makeEl = (id) => ({
-    dataset: {}, style: {}, textContent: '', hidden: false, _html: '',
-    classList: { add() {}, remove() {}, toggle() { return false; }, contains() { return false; } },
-    setAttribute() {}, getAttribute() { return null; },
-    addEventListener(type, fn) { listeners.set(`${id}:${type}`, fn); },
-    querySelector() { return null; }, querySelectorAll() { return []; }, appendChild() {},
-    set innerHTML(v) { this._html = String(v); }, get innerHTML() { return this._html; },
+  // ── the DOM ──────────────────────────────────────────────────────────────
+  const windowListeners = new Map();
+  const docListeners = new Map();
+  const timers = [];
+  let timerId = 0;
+  let focused = null;
+  const isPoll = (t) => t.fn && t.fn.name === 'pollFrame';
+  const classListOf = (el) => ({
+    add: (...cs) => { const s = new Set(String(el.className || '').split(/\s+/).filter(Boolean)); cs.forEach((c) => s.add(c)); el.className = [...s].join(' '); },
+    remove: (...cs) => { const s = new Set(String(el.className || '').split(/\s+/).filter(Boolean)); cs.forEach((c) => s.delete(c)); el.className = [...s].join(' '); },
+    toggle: (c, force) => { const has = String(el.className || '').split(/\s+/).includes(c); const on = force === undefined ? !has : !!force; (on ? el.classList.add : el.classList.remove)(c); return on; },
+    contains: (c) => String(el.className || '').split(/\s+/).includes(c),
+  });
+  function node(tag, attrs = {}) {
+    const el = makeEl(tag, attrs);
+    el.classList = classListOf(el);
+    el.hidden = 'hidden' in attrs;
+    el.placeholder = attrs.placeholder || '';
+    el.offsetWidth = 200; el.offsetHeight = 60;
+    el.focus = () => { focused = el; };
+    el.blur = () => { if (focused === el) focused = null; };
+    el.dispatchEvent = (ev) => { el.fire(ev.type, ev); return true; };
+    el.removeEventListener = () => {};
+    Object.defineProperty(el, 'firstChild', { get() { return { get textContent() { return el._text; }, set textContent(v) { el._text = String(v); } }; } });
+    if (tag === 'canvas') {
+      el.width = 0; el.height = 0;
+      el.getContext = () => new Proxy({}, {
+        get: (_, prop) => {
+          if (prop === 'measureText') return (t) => ({ width: String(t).length * 6 });
+          if (prop === 'createRadialGradient' || prop === 'createLinearGradient') return () => ({ addColorStop() {} });
+          return () => {};
+        },
+        set: () => true,
+      });
+      el.setPointerCapture = () => {};
+    }
+    return el;
+  }
+  // A parser over the page's own body, producing the elements above.
+  function parse(host, html) {
+    host.children = []; host._text = '';
+    const stack = [host];
+    const re = /<(\/?)([a-zA-Z][\w-]*)([^>]*?)(\/?)>/g;
+    let last = 0; let m;
+    const addText = (raw) => { if (raw) stack[stack.length - 1]._text += decodeEntities(raw); };
+    while ((m = re.exec(html))) {
+      addText(html.slice(last, m.index)); last = re.lastIndex;
+      const tag = m[2].toLowerCase();
+      if (m[1]) { for (let i = stack.length - 1; i > 0; i--) if (stack[i].tagName === tag) { stack.length = i; break; } continue; }
+      const el = node(tag, parseAttrs(m[3]));
+      stack[stack.length - 1].appendChild(el);
+      if (!m[4] && !VOID_TAGS.has(tag)) stack.push(el);
+    }
+    addText(html.slice(last));
+  }
+  // innerHTML on any element parses into children, so querySelectorAll('.row')
+  // finds what the page just wrote and the page's own listeners get wired.
+  const root = node('body', {});
+  const patchInnerHtml = (el) => Object.defineProperty(el, 'innerHTML', {
+    get() { return this._html === null ? '' : this._html; },
+    set(v) { this._html = String(v); this._value = null; parse(this, this._html); walk(this, (c) => { patchInnerHtml(c); return null; }); },
+    configurable: true,
   });
+  patchInnerHtml(root);
+  parse(root, SKY_BODY);
+  walk(root, (c) => { patchInnerHtml(c); return null; });
+  const byId = (id) => walk(root, (c) => (c.id === id ? c : null));
+  // '.brand h1' and '.jump' are the two descendant selectors the page uses.
+  const querySelector = (sel) => {
+    const parts = String(sel).trim().split(/\s+/);
+    let scope = [root];
+    for (const part of parts) { const next = []; for (const s of scope) walk(s, (c) => { if (matchesOne(c, part)) next.push(c); return null; }); scope = next; if (!scope.length) return null; }
+    return scope[0] || null;
+  };
   const documentObj = {
-    title: '',
-    body: { dataset: { page: 'sky' } },
+    body: root, hidden: false,
     documentElement: { dataset: {}, style: {}, classList: { add() {}, remove() {} } },
-    getElementById(id) { if (!els.has(id)) els.set(id, makeEl(id)); return els.get(id); },
-    querySelector(sel) { return this.getElementById(String(sel).replace(/^#/, '')); },
-    querySelectorAll() { return []; },
-    createElement() { return makeEl('new'); },
-    addEventListener() {},
+    getElementById: (id) => byId(id),
+    querySelector,
+    querySelectorAll: (sel) => { const out = []; walk(root, (c) => { if (matchesOne(c, sel)) out.push(c); return null; }); return out; },
+    createElement: (tag) => node(tag, {}),
+    addEventListener: (type, fn) => { docListeners.set(type, fn); },
   };
 
+  // ── the client ───────────────────────────────────────────────────────────
   const requests = [];
+  const answers = {
+    sky: sky === null ? { status: status.sky || 404, ok: false, data: null } : { status: 200, ok: true, data: sky },
+    mine: mine === null ? { status: status.mine || 404, ok: false, data: null } : { status: 200, ok: true, data: mine },
+    versions: versions === null ? { status: 404, ok: false, data: null } : { status: 200, ok: true, data: versions },
+    me: me === null ? { status: 200, ok: true, data: { builder: viewer, permissions: viewer.permissions || {} } } : { status: 200, ok: true, data: me },
+    template: template === undefined
+      ? { status: 200, ok: true, data: { template: { key: 'base-v2', label: 'Full Idea', fields: [
+        { key: 'why_had', label: 'What made you have the idea', required: true, substance_min: 25 },
+        { key: 'scope', label: 'Scope it as best as you can here', required: true, substance_min: 65 },
+        { key: 'build_context', label: 'What should an engineer or artist know prior to building', required: true, substance_min: 45 },
+        { key: 'fit', label: 'How is this long term justified in the project', required: true, substance_min: 30 },
+        { key: 'success', label: 'What does a successful implementation of the idea look like', required: true, substance_min: 35 },
+      ] } } }
+      : (template === null ? { status: 404, ok: false, data: null } : { status: 200, ok: true, data: { template } }),
+  };
+  const handlers = [];
   const client = {
-    request: async (method, url) => {
-      requests.push(url);
-      if (/\/me$/.test(url)) {
-        return meStatus === 200
-          ? { status: 200, ok: true, data: { builder: viewer } }
-          : { status: meStatus, ok: false, data: null };
-      }
-      // The two well reads. `goals: null` is a route that could not be read at
-      // all, which must leave the wells named by their id rather than blank;
-      // `criteria` absent for a goal is "not read", which must leave that well
-      // with no rings rather than zero of them.
-      const one = /\/goals\/(\d+)$/.exec(url);
-      if (one) {
-        const list = criteria[one[1]];
-        return list === undefined
-          ? { status: 404, ok: false, data: null }
-          : { status: 200, ok: true, data: { goal: { id: one[1] }, criteria: list } };
-      }
-      if (/\/goals$/.test(url)) {
-        return goals === null
-          ? { status: 500, ok: false, data: null }
-          : { status: 200, ok: true, data: { goals } };
-      }
-      if (trailStatus !== 200) return { status: trailStatus, ok: false, data: null };
-      const offset = Number((/offset=(\d+)/.exec(url) || [])[1] || 0);
-      const page = pages.find((p) => Number(p.offset || 0) === offset) || { ideas: [], total: 0 };
-      return { status: 200, ok: true, data: page };
+    request: async (method, url, opts = {}) => {
+      const body = opts.body; requests.push({ method, url, body });
+      for (const h of handlers) { const r = h(method, url, body); if (r) return r; }
+      if (/\/sky\/mine$/.test(url)) return answers.mine;
+      if (/\/sky$/.test(url)) return answers.sky;
+      if (/\/versions\b/.test(url)) return answers.versions;
+      if (/\/me$/.test(url)) return answers.me;
+      if (/\/inbox\/template$/.test(url)) return answers.template;
+      return { status: 404, ok: false, data: null };
     },
   };
 
+  // ── the window ───────────────────────────────────────────────────────────
+  const store = { ...(tourSeen ? { 'sky-tour-seen': '4' } : {}), ...storage };
+  let raf = null;
   const windowObj = {
     __BRANDING__: {}, __MODULES__: { enabled: {} },
     BongosClient: { createClient: () => client },
-    CSS: { escape: (s) => String(s) },
-    OTB: {
-      escapeHtml: (s) => String(s == null ? '' : s).replace(/[&<>"']/g, (c) => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;' }[c])),
-      $: (sel) => documentObj.querySelector(sel),
-      fmtDate: (iso) => String(iso ?? '').slice(0, 10),
-      toast() {},
-    },
-    location: { hostname: 'builders.cloudbongos.com', search: '', pathname: '/sky', hash: '', assign() {} },
-    localStorage: { getItem: () => null, setItem() {} },
-    addEventListener() {},
+    innerWidth, innerHeight, devicePixelRatio: 1,
+    matchMedia: () => ({ matches: reduce }),
+    localStorage: { getItem: (k) => (k in store ? store[k] : null), setItem: (k, v) => { store[k] = String(v); } },
+    location: { hostname: 'builders.cloudbongos.com', search: '', pathname: '/thinking', hash: '', assign: (u) => { out.navigated = u; }, replace: (u) => { out.navigated = u; } },
+    addEventListener: (type, fn) => { windowListeners.set(type, fn); },
+    requestAnimationFrame: (fn) => { raf = fn; return 1; },
+    performance: { now: () => Date.now() },
+    setTimeout: (fn, ms) => { const id = ++timerId; timers.push({ id, fn, ms }); return id; },
+    clearTimeout: (id) => { const i = timers.findIndex((t) => t.id === id); if (i >= 0) timers.splice(i, 1); },
   };
+  class Event { constructor(type) { this.type = type; } preventDefault() {} }
 
   const sandbox = {
-    window: windowObj, document: documentObj, location: windowObj.location,
-    console, setTimeout, clearTimeout, URLSearchParams, Math, Number,
+    window: windowObj, document: documentObj, location: windowObj.location, localStorage: windowObj.localStorage,
+    innerWidth, innerHeight, devicePixelRatio: 1, matchMedia: windowObj.matchMedia, performance: windowObj.performance,
+    requestAnimationFrame: windowObj.requestAnimationFrame, addEventListener: windowObj.addEventListener,
+    setTimeout: windowObj.setTimeout, clearTimeout: windowObj.clearTimeout,
+    console, Event, URLSearchParams, Math, Number, Date, JSON, Map, Set, Promise, Object, Array, String, Infinity, NaN,
   };
   sandbox.globalThis = sandbox;
   vm.createContext(sandbox);
-  vm.runInContext(IDEA_OBJECTS_JS, sandbox, { filename: 'idea-objects.js' });
-  vm.runInContext(SKY_JS, sandbox, { filename: 'sky.js' });
-
-  return {
-    requests,
-    objects: () => windowObj.OTBIdeaObjects,
-    field: () => documentObj.getElementById('sky-map').innerHTML,
-    panel: () => documentObj.getElementById('sky-panel').innerHTML,
-    legend: () => documentObj.getElementById('sky-legend').innerHTML,
-    sub: () => documentObj.getElementById('sky-sub').textContent,
-    foot: () => documentObj.getElementById('sky-foot'),
-    // Picking is the page's only control, and it is DELEGATED — one listener on
-    // the field for a trail of 300 bodies — so the suite drives it the way a
-    // click does rather than by calling an internal the page does not export.
-    pick: (ideaId) => {
-      const fn = listeners.get('sky-map:click');
-      if (!fn) throw new Error('the field wired no click listener');
-      fn({ target: { closest: (sel) => (sel === '[data-idea]'
-        ? { getAttribute: () => String(ideaId) }
-        : null) } });
+  for (const [name, src] of SKY_SRC) vm.runInContext(src, sandbox, { filename: name });
+
+  const out = {
+    requests, handlers, timers: {
+      // Run every pending timer (the composer's 300ms debounce, the tour's 600ms
+      // autostart), shortest first. Under reduced motion (the default here) the
+      // page polls for a redraw with a named 120ms timer instead of a rAF loop;
+      // that poll is not something a test waits on, so it is left alone and
+      // never counted.
+      flush: async () => { let guard = 0; while (timers.some((t) => !isPoll(t)) && guard++ < 50) { timers.sort((a, b) => a.ms - b.ms); const i = timers.findIndex((t) => !isPoll(t)); const [t] = timers.splice(i, 1); t.fn(); await settle(); } },
+      pending: () => timers.filter((t) => !isPoll(t)).length,
+      // Draw one polled frame, the way the page would after 120ms.
+      poll: () => { const i = timers.findIndex(isPoll); if (i >= 0) { const [t] = timers.splice(i, 1); t.fn(); } },
     },
+    navigated: null,
+    el: (id) => byId(id),
+    S: () => windowObj.OTBSky.S,
+    SKY: () => windowObj.OTBSky,
+    objects: () => windowObj.OTBIdeaObjects,
+    rows: () => byId('rows').innerHTML,
+    filters: () => byId('filters').innerHTML,
+    panel: () => byId('panel').innerHTML,
+    stats: () => byId('stats').innerHTML,
+    gravity: () => byId('gravity').innerHTML || byId('gravity').textContent,
+    receipt: () => byId('receiptText').innerHTML,
+    card: () => byId('card').innerHTML,
+    steps: () => byId('fullSteps').innerHTML,
+    focused: () => focused,
+    key: (k, target = null) => { const fn = windowListeners.get('keydown'); if (!fn) throw new Error('the page wired no keydown listener'); fn({ key: k, target, preventDefault() {} }); },
+    type: (v) => { const t = byId('thought'); t.value = v; t.fire('input', new Event('input')); },
+    submit: () => { byId('file').fire('submit', new Event('submit')); },
+    click: (id) => { const el = byId(id); if (!el) throw new Error(`no element #${id}`); el.fire('click', new Event('click')); },
+    frame: () => { if (raf) raf(Date.now()); },
+    ready: () => root.dataset.skyReady === '1',
   };
+  return out;
 }
 
 // namesFieldKey — does this source USE `key` as a Full Idea field key, as

package/tests/ideator_large_dead_thought_proof.mjs

@@ -174,32 +174,38 @@ async function trailRowsFor(cast) {
   return rows;
 }
 
-const page = (ideas) => ({ ideas, total: ideas.length, offset: 0, limit: 100 });
-
-// Read a glyph's geometry back off the markup the real renderer wrote.
-function glyphOf(html, ideaId) {
-  const re = new RegExp(`data-idea="${ideaId}"[\\s\\S]*?<span class="sky-glyph"([^>]*)>`);
-  const m = re.exec(html);
-  if (!m) return null;
-  const attrs = m[1];
-  return {
-    object: (/data-object="([^"]+)"/.exec(attrs) || [])[1] || null,
-    d: Number((/--d:(\d+)px/.exec(attrs) || [])[1]),
-    lit: Number((/--lit:([\d.]+)/.exec(attrs) || [])[1]),
-    unknownSize: /data-size="unknown"/.test(attrs),
-  };
-}
-const labelOf = (html, ideaId) =>
-  (new RegExp(`data-idea="${ideaId}"[\\s\\S]*?aria-label="([^"]*)"`).exec(html) || [])[1] || '';
+// The rows as GET /sky/mine hands them back — the SAME trail rows, whole
+// (task 1004231: the sky reads its trail through that one route now).
+const page = (ideas) => ({ builder_id: 95, ideas, total: ideas.length, cap: 1000, truncated: false });
 
 // Render a cast end to end and hand back the glyphs, so a case states the
-// SCENARIO and never the plumbing.
+// SCENARIO and never the plumbing. A glyph is what the real page decided to
+// draw for the thought — the object, the diameter (the page's one curve over
+// the server's scale, sky-data.js `diameter`) and the light — read off the
+// page's live state; `drawn` is the width the drawer's mark was actually
+// written at, for the two objects the mark carries a width for. A label is
+// every sentence the page writes about the thought: its row in the drawer,
+// its panel and its hover card.
 async function render(cast) {
   const rows = await trailRowsFor(cast);
-  const p = bootSkyPage({ pages: [page(rows)] });
+  const p = bootSkyPage({ mine: page(rows) });
   await drain();
-  const html = p.field();
-  return { html, rows, glyph: (id) => glyphOf(html, id), label: (id) => labelOf(html, id), page: p };
+  p.key('l');
+  const SKY = p.SKY();
+  const html = p.rows();
+  const find = (id) => p.S().ideas.find((x) => x.id === String(id));
+  const glyph = (id) => {
+    const i = find(id);
+    return { object: i.st, d: SKY.diameter(i), lit: i.lit, drawn: Number((new RegExp(`data-id="${id}"[\\s\\S]*?style="width:(\\d+)px`).exec(html) || [])[1]) || null };
+  };
+  const label = (id) => {
+    const i = find(id);
+    SKY.pick({ kind: 'idea', ref: i }, false);
+    SKY.showCard({ kind: 'idea', ref: i }, 10, 10);
+    const row = (new RegExp(`data-id="${id}"[\\s\\S]*?</button>`).exec(html) || [''])[0];
+    return [row, p.panel(), p.card()].join('\n');
+  };
+  return { html, rows, glyph, label, page: p };
 }
 
 // ---------------------------------------------------------------------------
@@ -245,9 +251,10 @@ await test('THE SCENARIO: a large dead thought draws at FULL SIZE and ZERO brigh
   assert.equal(dead.lit, 0, 'zero brightness: none of the work it caused is still alive');
   // FULL SIZE, measured rather than promised: the diameter is computed from a
   // `scale` the real size read produced AFTER the removal was confirmed.
-  const expected = 9 + (32 - 9) * compressIdeaSize(TOTAL);
-  assert.ok(Math.abs(dead.d - Math.round(expected)) <= 1,
+  const expected = 6 + 22 * compressIdeaSize(TOTAL);
+  assert.ok(Math.abs(dead.d - expected) < 0.001,
     `it keeps the diameter its 240 credits earn (${dead.d}px vs ~${expected.toFixed(1)}px)`);
+  assert.equal(dead.drawn, Math.round(expected * 1.1), 'and the drawer draws the mark at that width');
 });
 
 await test('SIZE NEVER FELL — the dead thought is exactly as big as its untouched twin', async () => {
@@ -260,6 +267,7 @@ await test('SIZE NEVER FELL — the dead thought is exactly as big as its untouc
   // The two were paid identically; only one had its work removed. This is the
   // claim hall_sky.mjs cannot make, because there the sizes were written by hand.
   assert.equal(dead.d, live.d, 'removal took the light and left the size alone');
+  assert.equal(dead.drawn, live.drawn, 'and the two marks in the drawer are the same width');
   assert.equal(r.rows[0].size.credits, TOTAL, 'and the credits behind it are untouched too');
   assert.equal(r.rows[0].size.credits, r.rows[1].size.credits);
   assert.equal(live.lit, 1, 'while the twin is still fully lit');
@@ -275,7 +283,7 @@ await test('THE DISTINCTION: dead and never-caused do not render alike on EITHER
   // Channel one — size. The whole reason there are two.
   assert.ok(dead.d > never.d,
     `the thought that mattered is visibly bigger (${dead.d}px vs ${never.d}px)`);
-  assert.equal(never.d, 9, 'a thought that caused nothing sits at the floor diameter');
+  assert.equal(never.d, 6, 'a thought that caused nothing sits at the floor diameter');
   // Channel two — brightness, and it runs the OPPOSITE way, which is the part a
   // single number could never express: the dead one is dark, the never-caused
   // one is LIT, because nothing has been taken from it.
@@ -378,7 +386,7 @@ await test('AN UNREADABLE REMOVAL IS NOT A DEATH — it stays lit and full, and
     assert.notEqual(g.object, 'remnant', 'an unread removal must never be drawn as a confirmed one');
     assert.equal(g.lit, 1, 'the glyph stays FULL — the doubt goes in words, not in the picture');
     assert.match(r.label(601), /unknown/, 'and the words say the share is unknown');
-    assert.ok(g.d > 9, 'the size, which never depended on the removal facts, is still drawn');
+    assert.ok(g.d > 6, 'the size, which never depended on the removal facts, is still drawn');
   } finally {
     removalsPort.confirmedRemovalsForTasks = savedFn;
   }