@bongos/core 1.21.112 → 1.21.114

package/tests/hall_street_depth.mjs

@@ -0,0 +1,559 @@
+// tests/hall_street_depth.mjs — THE LIVING STREET (task 1004685, the
+// living-city prototype): the street exterior in three planes over the real
+// hall-preview fixtures and nothing else (task 1004717 deleted the prototype
+// overlay), with a seated government in the routes' own shapes
+// (tests/fixtures/gov-seated.mjs).
+//
+// What it pins:
+//   1. without `depth` the street is exactly the street it was (the prototype
+//      tests in tests/hall_street.mjs keep holding), and with it the civic row
+//      has its deeper side face;
+//   2. BACK: one skyline cluster per OPEN goal, heights from the real rollups,
+//      in two rows, never over the Charter;
+//   3. MIDDLE: height is structure — a seated Lead and each committee room
+//      add a capsule floor and make the building taller; the plate
+//      names the Lead, "you", or "owner" for an unseated building;
+//   4. the agents: exactly one pod per active claim, on the skylane from its
+//      goal's plot (or the plot for the other goals) or on the road, a fixed
+//      gap apart, every pod on one clock (data is never a speed);
+//   5. construction: the authorised build-out is a site at its % complete, a
+//      proposal a ghost annex with one tally dot per seat; an open sitting is
+//      a shaft; what needs you lights SALMON windows on the floor that holds
+//      it, with a ring that fills with age; nothing else is salmon;
+//   6. the readings as tiles: one number and two words, hidden at zero;
+//   7. all of it real: an overlay handed in changes nothing, nothing is marked
+//      prototype and there is no prototype key;
+//   8. the CSS: Keith Clark's parallax, motion at 20 s or slower on transform
+//      and offset-distance only, the kill switch, tokens only, the dark twins;
+//   9. the page in a vm: the layers drawn, the deck link, the tiles.
+//
+// Run:  node --test --test-reporter=tap tests/hall_street_depth.mjs
+
+import { test } from 'node:test';
+// five Leads seated, a room and two build-outs, the docket routed to them (test data)
+import { SEATED, leadsRead, docketRouted } from './fixtures/gov-seated.mjs';
+import assert from 'node:assert/strict';
+import fs from 'node:fs';
+import path from 'node:path';
+import vm from 'node:vm';
+import { createRequire } from 'node:module';
+import { fileURLToPath } from 'node:url';
+
+const ROOT = path.resolve(path.dirname(fileURLToPath(import.meta.url)), '..');
+const PUB = path.join(ROOT, 'modules/hall-ui/public');
+const FX = path.join(ROOT, 'scripts/hall-preview/fixtures');
+const require = createRequire(import.meta.url);
+const City = require(path.join(PUB, 'city-draw.js'));
+const S = require(path.join(PUB, 'street-draw.js'));
+const L = require(path.join(PUB, 'gov-living.js'));
+const I = require(path.join(PUB, 'street-inside.js'));
+const Dp = require(path.join(PUB, 'street-depth.js'));
+require(path.join(PUB, 'street-desk.js')); // the line rule's fit, on the global the street reads
+const read = (f) => fs.readFileSync(path.join(PUB, f), 'utf8');
+const fx = (name) => JSON.parse(fs.readFileSync(path.join(FX, name + '.json'), 'utf8'));
+const NOW = Date.parse('2026-10-09T14:00:00.000Z');
+const clone = (o) => JSON.parse(JSON.stringify(o));
+
+function feeds(over = {}) {
+  return {
+    docket: docketRouted(), goals: fx('goals'), rollups: fx('goals__rollups'), claims: fx('tasks__claimable'),
+    tasks: fx('tasks__status-active'), cost: fx('public__cost-summary'), roster: fx('builders__roster'), me: fx('me'),
+    leads: leadsRead(), ...over,
+  };
+}
+function living(f) { return L.livingModel({ ...f, now: NOW }); }
+function street(over = {}, mode = 'dark') {
+  const f = feeds(over);
+  return S.streetModel({ docket: f.docket, goals: f.goals.goals, rollups: f.rollups.rollups, mode, now: NOW, depth: true, living: f.living === null ? null : living(f), roster: f.roster });
+}
+const openGoals = () => fx('goals').goals.filter((g) => g.status === 'open');
+
+// ── 1. the flat street is untouched; the deep one has its deeper sides ──────
+
+test('without depth the street is the street it was: no depth layers, the same buildings and pins', () => {
+  const f = feeds();
+  const base = { docket: f.docket, goals: f.goals.goals, rollups: f.rollups.rollups, mode: 'dark', now: NOW };
+  const flat = S.streetModel(base);
+  assert.equal('depth' in flat, false);
+  assert.deepEqual(S.streetModel({ ...base, depth: false, living: living(f) }), flat, 'living alone changes nothing');
+  assert.equal('deck' in flat.hud, false);
+});
+
+test('the deep civic row draws its side faces DEPTH.side deep; the prototype theme keeps 7', () => {
+  const side = (polys) => {
+    const m = /^M([\d.]+) ([\d.]+)L([\d.]+) ([\d.]+)L/.exec(polys[0].d);
+    return Number(m[3]) - Number(m[1]);
+  };
+  for (const kind of S.CIVIC_KEYS) {
+    const a = []; const b = [];
+    S.civic(a, S.theme('dark'), kind, 100, S.G, 84, { evening: false, reviewHeld: true, fixes: false });
+    S.civic(b, { ...S.theme('dark'), depth: Dp.DEPTH.side }, kind, 100, S.G, 84, { evening: false, reviewHeld: true, fixes: false });
+    assert.equal(side(a), 7, kind);
+    assert.equal(side(b), Dp.DEPTH.side, kind);
+  }
+  const g = [];
+  S.gable(g, 0, 100, 30, 10, S.theme('dark').roof);
+  assert.match(g[0].d, /L22 83L37 93/, 'a gable with no depth keeps the prototype\'s 7');
+});
+
+// ── 2. BACK: the skyline ─────────────────────────────────────────────────────
+
+test('the skyline is one cluster per OPEN goal, in two rows, its heights from the real rollups', () => {
+  const m = street();
+  const d = m.depth;
+  const open = openGoals();
+  assert.equal(d.clusters.length, open.length);
+  assert.deepEqual(d.clusters.map((c) => c.goal).sort(), open.map((g) => String(g.id)).sort());
+  assert.deepEqual([...new Set(d.clusters.map((c) => c.row))].sort(), ['far', 'near']);
+  const ro = {};
+  fx('goals__rollups').rollups.forEach((r) => { ro[String(r.goal_id)] = r; });
+  for (const c of d.clusters) {
+    assert.equal(c.total, ro[c.goal] ? ro[c.goal].total : 0, `goal ${c.goal}: its real size`);
+    assert.ok(c.h >= 24 && c.h <= 196, `goal ${c.goal}: ${c.h} inside the skyline's range`);
+  }
+  // the largest, most-built goal stands tallest; and a skyline never tops the Charter
+  const big = d.clusters.reduce((a, b) => (b.total > a.total ? b : a));
+  assert.ok(d.clusters.every((c) => c.h <= big.h + 60), 'size drives height');
+  assert.ok(Math.max(...d.clusters.map((c) => c.h)) < 226, 'the civic row stays the subject');
+  // a goal that is not open builds nothing, and no goals leave an empty sky
+  const closed = street({ goals: { goals: open.map((g, i) => (i === 0 ? { ...g, status: 'achieved' } : g)) } });
+  assert.equal(closed.depth.clusters.length, open.length - 1);
+  assert.deepEqual(street({ goals: { goals: [] } }).depth.near, []);
+  // more of a goal built raises it
+  const r = clone(fx('goals__rollups'));
+  const gid = String(open[0].id);
+  const row = r.rollups.find((x) => String(x.goal_id) === gid);
+  const before = street({ rollups: r }).depth.clusters.find((c) => c.goal === gid).h;
+  row.done = row.total;
+  assert.ok(street({ rollups: r }).depth.clusters.find((c) => c.goal === gid).h > before, 'built work raises the cluster');
+});
+
+// ── 3. MIDDLE: height is structure ──────────────────────────────────────────
+
+test('a seated Lead and each committee room plug in one capsule floor, and the building rises', () => {
+  const m = street();
+  const caps = Object.fromEntries(m.depth.capsules.map((c) => [c.building, c]));
+  for (const l of SEATED) {
+    assert.equal(caps[l.building].floors, l.building === 'review' ? 2 : 1, l.building + ': the Lead, and Review\'s Testers room');
+    assert.equal(caps[l.building].roles[0], 'lead', `${l.building}: the Lead's office comes first`);
+    assert.equal('proto' in caps[l.building], false);
+  }
+  for (const k of ['charter', 'rules', 'disputes', 'automation']) assert.equal(caps[k], undefined, `${k}: unseated, no capsule`);
+  // the Planning Lead leaves office: Planning stands lower, and its pin comes down with it
+  const l2 = leadsRead();
+  l2.buildings.find((b) => b.building === 'planning').lead = null;
+  const m2 = street({ leads: l2 });
+  const door = (mm, k) => mm.doors.find((d) => d.key === k);
+  const rise = door(m2, 'planning').y - door(m, 'planning').y;
+  assert.ok(rise >= Dp.DEPTH.cap - 2 && rise <= Dp.DEPTH.cap + 5, `the Lead's floor adds about a floor of height (${rise})`);
+  const pin = (mm, k) => mm.pins.find((p) => p.building === k);
+  assert.equal(pin(m2, 'planning').y - pin(m, 'planning').y, rise, 'the pin stands on the new roof');
+  // a Lead and a committee room at Charter make Charter taller too
+  const l3 = leadsRead();
+  const ch = l3.buildings.find((b) => b.building === 'charter');
+  ch.lead = { id: 'Lc', building: 'charter', builder: { id: '3', login: 'builder-2013', name: 'Builder 2013' }, charter: 'x', since: '2026-10-09', appointed_by: { item_id: '2' } };
+  ch.structure = { standing: [{ id: 5, capsule: 'committee', name: 'C', line: '', state: 'built', progress: 1 }], proposed: [] };
+  const m3 = street({ leads: l3 });
+  assert.equal(m3.depth.capsules.find((c) => c.building === 'charter').floors, 2);
+  assert.ok(door(m3, 'charter').h > door(m, 'charter').h);
+});
+
+test('the name plate at street level names the Lead, "you" for the viewer, and "owner" where nobody holds it', () => {
+  const m = street();
+  const plates = Object.fromEntries(m.depth.plates.map((p) => [p.building, p]));
+  assert.equal(m.depth.plates.length, 9, 'every civic building');
+  for (const k of ['charter', 'rules', 'disputes', 'automation']) { assert.equal(plates[k].text, 'owner', k); assert.equal(plates[k].seat, 'owner'); }
+  const me = String(fx('me').builder.id);
+  const roster = fx('builders__roster').builders;
+  for (const l of SEATED) {
+    const want = l.lead === me ? 'you' : roster.find((b) => String(b.id) === l.lead).display_name;
+    assert.equal(plates[l.building].text, want, l.building);
+    assert.equal(plates[l.building].seat, 'lead');
+  }
+  assert.ok(m.depth.plates.every((p) => !('proto' in p)), 'every plate is GET /government/leads\' own');
+  assert.ok(m.depth.plates.every((p) => p.y > S.G && p.y < S.G + 30), 'at street level, on the road\'s kerb');
+  assert.match(m.doors.find((d) => d.key === 'planning').aria, /, led by you$/);
+  assert.match(m.doors.find((d) => d.key === 'charter').aria, /, held by the owner$/);
+});
+
+// ── 4. the agents ────────────────────────────────────────────────────────────
+
+test('one pod per active claim: on the skylane from its goal\'s plot, or on the road; never more, never fewer', () => {
+  const m = street();
+  const d = m.depth;
+  const claims = fx('tasks__claimable').active_claims;
+  const roadN = d.road.reduce((a, r) => a + r.n, 0);
+  assert.equal(d.pods.length + roadN, claims.length, 'the count is the agents');
+  assert.equal(d.agents, claims.length);
+  // the fixture: two claims whose goals stand on the street, two whose goals are past the eighth, one with no goal
+  const lanes = Object.fromEntries(d.lanes.map((l) => [l.key, l.n]));
+  assert.deepEqual(lanes, { 'lane:more>charter': 1, 'lane:1000095>review': 1, 'lane:1000090>release': 1, 'lane:more>release': 1 });
+  assert.deepEqual(d.road.map((r) => [r.building, r.n]), [['review', 1]], 'the claim with no goal works on the road at its building');
+  // more claims on one lane ride a fixed gap apart, on one clock
+  const c2 = clone(fx('tasks__claimable'));
+  const tpl = c2.active_claims.find((c) => c.task_id === '1004557');
+  for (let i = 0; i < 3; i++) c2.active_claims.push({ ...tpl, claim_id: 'x' + i });
+  const d2 = street({ claims: c2 }).depth;
+  const lane = d2.pods.filter((p) => p.lane === 'lane:1000090>release');
+  assert.equal(lane.length, 4);
+  const at = lane.map((p) => p.at);
+  for (let i = 1; i < at.length; i++) assert.equal(Math.round((at[i] - at[i - 1]) * 100) / 100, Dp.DEPTH.podGap, 'a fixed gap');
+  for (const p of d2.pods) assert.equal(p.delay, -Math.round(p.at / 100 * Dp.DEPTH.period * 100) / 100, 'every pod on the same lap, offset by its place');
+  // no claims: empty lanes, a real quiet state
+  const quiet = street({ claims: { active_claims: [] } }).depth;
+  assert.deepEqual([quiet.pods.length, quiet.road.length, quiet.lanes.length], [0, 0, 0]);
+  assert.match(quiet.label, /No agent is at work/);
+});
+
+test('a claim with no building rides the whole road; a claim on a goal that is not open is not drawn as that goal', () => {
+  const c = clone(fx('tasks__claimable'));
+  c.active_claims = [{ claim_id: 'z', task_id: 'nope', builder_id: '3', touches: [] }];
+  const d = street({ claims: c }).depth;
+  assert.deepEqual(d.road.map((r) => [r.building, r.n]), [[null, 1]]);
+  assert.match(d.road[0].path, /^M\d+(\.\d+)? 578H/, 'along the road\'s near lane');
+});
+
+// ── 5. construction, sittings, and what needs you ───────────────────────────
+
+test('the authorised build-out is a live site at its % complete; the pending proposal a ghost annex with a tally of seats', () => {
+  const d = street().depth;
+  assert.deepEqual(d.sites.map((s) => [s.building, s.progress]), [['release', 0.55]]);
+  assert.ok(d.sites[0].lift > 0 && d.sites[0].platform.rise > 0);
+  assert.deepEqual(d.proposals.map((p) => p.building), ['treasury']);
+  const seats = fx('government__docket').buildings.find((b) => b.key === 'charter').holders.length;
+  assert.equal(d.proposals[0].dots.length, seats, 'one dot per council seat');
+  assert.ok(d.proposals[0].dots.every((x) => x.vote === 'open'), 'nobody has voted yet');
+  // more progress, more finished floors, a taller scaffold
+  const done = leadsRead();
+  done.buildings.find((b) => b.building === 'release').structure.standing[0].progress = 1;
+  const full = Dp.structureOf({ ...S.theme('dark'), depth: Dp.DEPTH.side }, 'release', 100, living(feeds({ leads: done })).buildings.find((b) => b.key === 'release'), { tallyOf: () => ({ for: 0, against: 0, seats: 5 }) });
+  const part = Dp.structureOf({ ...S.theme('dark'), depth: Dp.DEPTH.side }, 'release', 100, living(feeds()).buildings.find((b) => b.key === 'release'), { tallyOf: () => ({ for: 0, against: 0, seats: 5 }) });
+  assert.ok(full.polys.length > part.polys.length, 'finished floors stack');
+  assert.ok(full.site.platform.rise > part.site.platform.rise, 'the scaffold climbs with the work');
+});
+
+test('a real board sitting still open is a scaffold proposal and a shaft from its roof, its tally the vote\'s own', () => {
+  const doc = clone(fx('government__docket'));
+  doc.matters.push({ id: 'board:99', source: 'board', building: 'rules', state: 'needs', title: 'A new rule', short: 'a new rule', rule: 'majority', opened_at: '2026-10-08T00:00:00Z', deadline: null, tally: { for: 2, against: 1, open: 2 }, ref: { type: 'board_item', id: '99' }, acts: [] });
+  const d = street({ docket: doc }).depth;
+  const shaft = d.shafts.find((s) => s.building === 'rules');
+  assert.ok(shaft, 'an open sitting is a shaft');
+  const p = d.proposals.find((x) => x.building === 'rules');
+  assert.ok(p);
+  assert.deepEqual(p.dots.map((x) => x.vote), ['for', 'for', 'against', 'open', 'open']);
+  // settled, it is neither
+  doc.matters[doc.matters.length - 1].state = 'settled';
+  const e = street({ docket: doc }).depth;
+  assert.equal(e.shafts.some((s) => s.building === 'rules'), false);
+  assert.equal(e.proposals.some((x) => x.building === 'rules'), false);
+  // the annex's own sitting is the treasury's shaft
+  assert.deepEqual(street().depth.shafts.map((s) => s.building), ['treasury']);
+});
+
+test('what needs you lights salmon windows on the floor that holds it, with a ring that fills with age', () => {
+  const d = street().depth;
+  const doc = docketRouted();
+  // salmon only for what needs YOU: a matter the server routes to someone else
+  // (another building's Lead) waits on them, so its floor stays dark
+  const yours = new Set(living(feeds()).city.asks.filter(L.isOnYou).map((a) => a.id));
+  const needs = doc.matters.filter((m) => m.state === 'needs' && yours.has(m.id));
+  assert.ok(needs.length > 0 && needs.length < doc.matters.filter((m) => m.state === 'needs').length, 'some of the docket\'s needs are someone else\'s now');
+  // every lit row is a real floor of the building's plan holding real matters that need you
+  let counted = 0;
+  for (const w of d.windows) {
+    const b = w.building;
+    const here = needs.filter((m) => m.building === b && I.PLAN[b].floors.find((f) => f[0] === w.floor)[2].source === m.source);
+    assert.equal(w.count, here.length, w.key);
+    assert.ok(w.lit >= 1 && w.lit <= w.count, w.key);
+    assert.equal((w.d.match(/M/g) || []).length, w.lit, `${w.key}: one window per matter, up to the face`);
+    const oldest = here.map((m) => Date.parse(m.opened_at)).filter(Number.isFinite);
+    const age = oldest.length ? Math.floor((NOW - Math.min(...oldest)) / 86400000) : null;
+    assert.equal(w.age, age, w.key);
+    assert.equal(w.frac, age == null ? 0 : Math.min(1, Math.round(age / Dp.DEPTH.ageFull * 1000) / 1000), w.key);
+    counted += w.count;
+  }
+  assert.equal(counted, needs.length, 'every matter that needs you has its floor');
+  assert.ok(d.windows.some((w) => w.building === 'planning'), 'the viewer leads Planning');
+  assert.ok(!d.windows.some((w) => ['review', 'release', 'treasury'].includes(w.building)), 'what waits on another Lead lights nothing');
+  // the hub as it is (no Lead read, everything on the owner seat): every docket need is the viewer's own
+  assert.deepEqual(street({ leads: null, docket: fx('government__docket') }).depth.windows.map((w) => w.key), ['needs:automation:0', 'needs:disputes:0', 'needs:planning:2', 'needs:release:0', 'needs:review:1', 'needs:treasury:4']);
+  // moving and settled light nothing; nor does a source no floor holds
+  const doc2 = clone(doc);
+  doc2.matters.forEach((m) => { m.state = 'moving'; });
+  assert.deepEqual(street({ docket: doc2 }).depth.windows, []);
+  const doc3 = clone(doc);
+  doc3.matters = [{ ...doc.matters[0], source: 'nowhere' }];
+  assert.deepEqual(street({ docket: doc3 }).depth.windows, [], 'no floor holds it: no window is invented');
+});
+
+// ── 6. the readings as tiles ─────────────────────────────────────────────────
+
+test('the six readings are tiles: one number and two words, from the living model where it reads them', () => {
+  const t = street().depth.tiles;
+  const lm = living(feeds());
+  assert.deepEqual(Object.keys(t), ['flow', 'promises', 'money', 'people', 'fairness', 'rules']);
+  for (const [k, v] of Object.entries(t)) {
+    assert.ok(v, k + ' shows');
+    assert.match(v.n, /^\$?[\d,]+$/, k + ': one number');
+    assert.equal(v.words.split(' ').length, 2, k + ': two words');
+  }
+  assert.equal(t.flow.n, String(lm.city.traffic.agents));
+  assert.equal(t.money.n, S.money(lm.city.spend.month_usd));
+  assert.equal(t.people.n, String(fx('builders__roster').builders.filter((b) => b.status === 'active').length));
+  assert.equal(t.promises.n, String(fx('government__docket').readings.find((r) => r.key === 'promises').value.kept));
+  assert.equal(t.fairness.n, String(fx('government__docket').readings.find((r) => r.key === 'fairness').value));
+  assert.equal(t.rules.n, String(lm.city.laws.length));
+  assert.ok(Object.values(t).every((v) => !('proto' in v)), 'every tile is a real read');
+});
+
+test('a tile is hidden at zero and when nothing real holds it; never "module not enabled"', () => {
+  const off = clone(fx('government__docket'));
+  off.readings.forEach((r) => { r.status = 'off'; r.figure = null; r.value = null; r.reason = 'The module that holds this is not enabled here.'; });
+  off.matters = [];
+  const t = Dp.readingTiles(off, null, null);
+  assert.deepEqual(Object.values(t), [null, null, null, null, null, null]);
+  const z = Dp.readingTiles(off, { city: { traffic: { agents: 0 }, spend: { month_usd: 0 }, laws: [] } }, { builders: [] });
+  assert.deepEqual(Object.values(z), [null, null, null, null, null, null], 'zero agents, no spend, nobody, no laws: all hidden');
+  // with no living model, a live reading's own figure stands in, if it is a number and at most two words
+  const live = fx('government__docket');
+  const f = Dp.readingTiles(live, null, null);
+  assert.deepEqual([f.flow.n, f.flow.words], ['7', 'stuck']);
+  assert.deepEqual([f.rules.n, f.rules.words], ['1', 'rule']);
+  assert.equal(Dp.readingTiles({ readings: [{ key: 'flow', status: 'live', figure: '7 of 9 stuck in review' }], matters: [] }, null, null).flow, null);
+});
+
+// ── 7. all of it real ────────────────────────────────────────────────────────
+
+test('an overlay handed in changes nothing; the Leads not read, no Lead, capsule or build-out is invented; no prototype key', () => {
+  const a = street().depth;
+  const b = street({ overlay: { leads: [{ building: 'rules', lead: '1000301', committees: [] }], buildouts: [{ id: 'x', building: 'rules', authorised: true, progress: 0.1 }], laws: [{ id: 'y', text: 'An invented law' }] } }).depth;
+  assert.deepEqual(b, a, 'the overlay is not read');
+  assert.equal('key' in a, false, 'there is no prototype key');
+  const c = street({ leads: null }).depth;
+  assert.deepEqual([c.plates.length, c.capsules.length, c.sites.length], [0, 0, 0], 'no Leads read: no plate, no capsule, no build-out going up');
+  // without the living model at all the deep street still draws its real skyline and windows
+  const none = S.streetModel({ docket: fx('government__docket'), goals: fx('goals').goals, rollups: fx('goals__rollups').rollups, mode: 'dark', now: NOW, depth: true, living: null, roster: null }).depth;
+  assert.deepEqual(none.clusters, a.clusters);
+  assert.deepEqual(none.windows, street({ leads: null, docket: fx('government__docket') }).depth.windows, 'no living model and the hub as it is light the same, the docket\'s own');
+  assert.equal(none.agents, 0);
+});
+
+test('street-depth.js: its model half is pure, and the two drawing files require each other in one direction only', () => {
+  const src = read('street-depth.js');
+  const cut = src.indexOf('// THE PAGE HALF.');
+  assert.ok(cut > 0, 'the page half is marked');
+  const model = src.slice(0, cut).replace(/^\s*\/\/.*$/gm, '');
+  assert.doesNotMatch(model, /\bdocument\b|\bfetch\s*\(|Date\.now|new Date\(\)|localStorage|setTimeout/, 'the model half reads no DOM, no network, no clock');
+  // street-depth.js needs street-draw.js (the kit) and street-inside.js (the floor plan);
+  // street-draw.js finds it on its global, so neither drawing file requires back
+  const draw = read('street-draw.js').split('\n').filter((l) => !/^\s*(\/\/|\*)/.test(l)).join('\n');
+  const inside = read('street-inside.js').split('\n').filter((l) => !/^\s*(\/\/|\*)/.test(l)).join('\n');
+  assert.doesNotMatch(draw, /require\('\.\/street-(inside|depth)\.js'\)/, 'street-draw.js requires neither');
+  assert.doesNotMatch(inside, /require\('\.\/street-depth\.js'\)/);
+  assert.match(src, /require\('\.\/street-draw\.js'\)/);
+  // a street asked to be deep without the depth kit is drawn flat, never half-drawn
+  const before = globalThis.GovStreetDepth;
+  delete globalThis.GovStreetDepth;
+  try {
+    const flat = S.streetModel({ docket: fx('government__docket'), goals: openGoals(), rollups: fx('goals__rollups').rollups, mode: 'dark', now: NOW, depth: true });
+    assert.equal(flat.depth, undefined);
+  } finally { globalThis.GovStreetDepth = before; }
+});
+
+test('street-draw.js stays pure: no DOM, no fetch, no clock', () => {
+  const src = read('street-draw.js').replace(/^\s*\/\/.*$/gm, '');
+  assert.doesNotMatch(src, /\bdocument\b|\bfetch\s*\(|Date\.now|new Date\(\)|localStorage|setTimeout/);
+  const a = street(), b = street();
+  assert.deepEqual(a, b, 'the same feeds give the same street');
+});
+
+// ── 8. the CSS ───────────────────────────────────────────────────────────────
+
+const CSS = read('street.css').replace(/\/\*[\s\S]*?\*\//g, '');
+const rule = (sel) => { const m = new RegExp(sel.replace(/[.*+?^${}()|[\]\\]/g, '\\$&') + ' \\{([^}]*)\\}').exec(CSS); return m ? m[1] : null; };
+
+test('the parallax is Keith Clark\'s, sideways, CSS only: a perspective window, kept 3D, each row deeper and scaled back', () => {
+  assert.match(rule('.street-window'), /perspective: 1px; perspective-origin: 50% 50%;/);
+  assert.match(rule('.street-sizer'), /overflow: visible; transform-style: preserve-3d;/, 'an overflow clip would flatten the 3D');
+  assert.match(rule('.street-board'), /transform-style: preserve-3d;/);
+  for (const [row, z] of [['near', 1], ['far', 2]]) {
+    const m = new RegExp(`translateZ\\(-(\\d+)px\\) scale\\((\\d+)\\)`).exec(rule('.street-depth-back--' + row));
+    assert.equal(Number(m[1]), z, row);
+    assert.equal(Number(m[2]), 1 + z, `${row}: scaled back to its own size at perspective 1px`);
+  }
+  assert.match(rule('.street-depth-back'), /width: 1px; height: 1px;[^}]*transform-origin: var\(--street-depth-ox, 720px\) 446px;/, 'a 1 px box: its depth never widens the scroll; origin the band\'s middle (196 + 500 / 2, task 1004718)');
+  const scrolls = [...read('street.js').matchAll(/addEventListener\('scroll',\s*([A-Za-z]+)/g)].map((m) => m[1]);
+  assert.deepEqual([...new Set(scrolls)], ['placeCard'], 'the one scroll handler places the card; none moves the street');
+});
+
+test('motion only says "this is live": 20 s or slower, transform and offset-distance only, dead under the kill switch', () => {
+  const block = CSS.slice(CSS.indexOf('.street-depth-layer'), CSS.indexOf('.street-card {'));
+  const anims = [...block.matchAll(/animation: (street-depth-[a-z]+) (\d+)s/g)];
+  assert.ok(anims.length >= 7, 'the pods, the train, the ring, the platform, the jib, the line, the slab');
+  for (const [, name, s] of anims) assert.ok(Number(s) >= 20, `${name}: ${s}s`);
+  assert.equal(Number(/street-depth-travel (\d+)s/.exec(block)[1]), Dp.DEPTH.period, 'the pods\' lap is the model\'s period');
+  for (const m of block.matchAll(/@keyframes (street-depth-[a-z]+) \{([^@]*?)\}\s*\}/g)) {
+    const props = [...m[2].matchAll(/([a-z-]+):/g)].map((x) => x[1]);
+    assert.ok(props.every((p) => p === 'transform' || p === 'offset-distance'), `${m[1]} animates ${props}`);
+  }
+  assert.doesNotMatch(block, /stroke-dashoffset|blur\(/);
+  const kill = CSS.slice(CSS.indexOf('@media (prefers-reduced-motion: reduce)'));
+  assert.match(kill, /animation: none !important; transition: none !important;/);
+  assert.match(kill, /\.street-window \{ perspective: none; \}/);
+  assert.match(kill, /\.street-depth-back \{ transform: none; \}/);
+});
+
+test('every colour is a token; salmon only for what needs you; the dark twins stay byte-identical', () => {
+  const block = CSS.slice(CSS.indexOf('.street-depth-layer'), CSS.indexOf('.street-card {'));
+  assert.doesNotMatch(block, /(fill|stroke|background|color|border[a-z-]*): #/, 'no literal paint');
+  // the only literal is the mask's black, a mask (DESIGN.md: black with alpha as a scrim or mask)
+  for (const m of block.matchAll(/#[0-9a-f]{3,6}\b/gi)) assert.equal(m[0], '#000', 'a literal is only the mask\'s black');
+  for (const m of block.matchAll(/([^{}]+)\{([^}]*var\(--accent\)[^}]*)\}/g)) {
+    assert.match(m[1], /needs|age__arc|deck/, `salmon spent on ${m[1].trim()}`);
+  }
+  const twin = (re) => CSS.match(re)[1].replace(/\s+/g, ' ').trim();
+  assert.equal(twin(/html\[data-theme="dark"\] body\[data-page="street"\] \{([^}]*)\}/), twin(/html:not\(\[data-theme\]\) body\[data-page="street"\] \{([^}]*)\}/));
+  assert.match(CSS, /html\[data-theme="dark"\] body\[data-page="street"\] \{[^}]*--street-depth-face:/, 'the depth tokens have dark twins');
+  assert.doesNotMatch(CSS, /:root/);
+});
+
+test('the markup: the back rows and the sky behind the street, the front over it, the deck behind "to do"', () => {
+  const html = read('street.html').replace(/<!--[\s\S]*?-->/g, '');
+  const order = ['streetEvening', 'streetDepthFar', 'streetDepthNear', 'streetDepthSky', 'streetSvg', 'streetDepthFront', 'streetCrates', 'streetPins'].map((id) => html.indexOf(`id="${id}"`));
+  assert.equal(html.indexOf('streetDepthKey'), -1, 'no prototype key');
+  assert.ok(order.every((i) => i > 0));
+  assert.deepEqual([...order].sort((a, b) => a - b), order, 'in paint order');
+  assert.match(html, /<a class="street-hud__item street-depth-deck" id="hudDeck" href="\/builders\/street#deck">\s*<span class="street-hud__dot" id="hudDot"[^>]*><\/span>\s*<span class="street-label">to do<\/span>\s*<span class="street-hud__n" id="hudNeeds">/);
+  assert.ok(html.indexOf('/builders/gov-living.js') > 0 && html.indexOf('/builders/gov-living.js') < html.indexOf('/builders/street.js'), 'the living model loads before the page');
+  assert.equal(Dp.DECK_HREF, '/builders/street#deck');
+  assert.equal(S.parseHash('#deck'), null, 'the deck is not a building or a district: the street stays');
+});
+
+// ── 9. the page in a vm ──────────────────────────────────────────────────────
+
+function fakeDom() {
+  const byId = new Map();
+  const mk = (tag) => {
+    const el = {
+      tagName: tag, attrs: {}, children: [], className: '', listeners: {}, _text: '', hidden: false, parentNode: null,
+      style: { setProperty(k, v) { this[k] = v; } },
+      clientWidth: 1440, clientHeight: 708, offsetLeft: 0, scrollLeft: 0,
+      get firstChild() { return this.children[0] || null; },
+      setAttribute(k, v) { this.attrs[k] = String(v); if (k === 'id') byId.set(String(v), this); if (k === 'class') this.className = String(v); },
+      getAttribute(k) { return k in this.attrs ? this.attrs[k] : null; },
+      appendChild(c) { this.children.push(c); c.parentNode = this; return c; },
+      removeChild(c) { this.children = this.children.filter((x) => x !== c); return c; },
+      addEventListener(t, fn) { (this.listeners[t] = this.listeners[t] || []).push(fn); },
+      focus() {},
+      set textContent(v) { this._text = String(v); this.children = []; },
+      get textContent() { return this._text; },
+      get innerHTML() { throw new Error('no innerHTML'); },
+      set innerHTML(v) { throw new Error('no innerHTML'); },
+    };
+    return el;
+  };
+  const ids = ['streetMode', 'streetModeIcon', 'streetModeWord', 'streetWindow', 'streetSizer', 'streetBoard', 'streetSvg', 'streetFlat', 'streetBlds', 'streetCrates', 'streetCols', 'streetGroups', 'streetDoors', 'streetPins', 'streetSigns', 'streetEvening', 'streetEveningLine', 'hudNeeds', 'hudMoving', 'hudShare', 'hudDot', 'hudDeck', 'streetHome', 'streetCard', 'streetCardWhere', 'streetCardWhen', 'streetCardTitle', 'streetCardBody', 'streetCardClose', 'streetToast', 'streetDepthFar', 'streetDepthNear', 'streetDepthSky', 'streetDepthFront'];
+  for (const id of ids) mk('x').setAttribute('id', id);
+  const document = { documentElement: mk('html'), getElementById: (id) => byId.get(id) || null, createElement: (t) => mk(t), createElementNS: (_ns, t) => mk(t) };
+  return { document, byId };
+}
+const walk = (el, out = []) => { out.push(el); el.children.forEach((c) => walk(c, out)); return out; };
+
+async function bootPage({ withLiving = true } = {}) {
+  const { document, byId } = fakeDom();
+  const calls = [];
+  const F = {
+    '/api/bongos/government/docket': docketRouted(), '/api/bongos/goals': fx('goals'), '/api/bongos/goals/rollups': fx('goals__rollups'),
+    '/api/bongos/government/leads': leadsRead(),
+    '/api/bongos/tasks/claimable?limit=1': fx('tasks__claimable'), '/api/bongos/tasks?status=active': fx('tasks__status-active'),
+    '/api/bongos/public/cost-summary': fx('public__cost-summary'), '/api/bongos/builders/roster': fx('builders__roster'), '/api/bongos/me': fx('me'),
+    // the living model's reads, as gov-feeds.js names them
+    '/api/bongos/tasks?status=active&limit=200': fx('tasks__status-active'), '/api/bongos/blockers?limit=100': fx('blockers'),
+    '/api/bongos/moving': fx('moving'), '/api/bongos/autonomy/fence': fx('autonomy__fence'), '/api/bongos/government/constitution': fx('government__constitution'),
+  };
+  const fetch = (url) => { calls.push(url); const b = F[url]; return Promise.resolve(b === undefined ? { ok: false, json: async () => ({}) } : { ok: true, json: async () => b }); };
+  const window = { innerWidth: 1440, innerHeight: 900, location: { hash: '' }, localStorage: { getItem: () => 'dark', setItem() {} }, matchMedia: () => ({ matches: true, addEventListener() {} }), addEventListener() {} };
+  class MutationObserver { observe() {} }
+  window.fetch = fetch;
+  const ctx = vm.createContext({ window, document, fetch, Promise, Math, String, Number, Array, Object, JSON, Date, console, encodeURIComponent, decodeURIComponent, isNaN, isFinite, MutationObserver, Set });
+  ctx.globalThis = ctx;
+  for (const f of (withLiving ? ['gov-living.js', 'gov-feeds.js'] : []).concat(['city-draw.js', 'street-draw.js', 'street-card.js', 'street-inside.js', 'street-depth.js', 'street-desk.js', 'street.js'])) vm.runInContext(read(f), ctx);
+  await window.GovStreetPage.ready;
+  for (let i = 0; i < 5; i++) await new Promise((r) => setImmediate(r));
+  return { byId, calls, window };
+}
+
+test('the page draws the living street: the skyline, a pod per claim, the plates, construction, the windows', async () => {
+  const p = await bootPage();
+  const all = (id) => walk(p.byId.get(id));
+  const cls = (id, c) => all(id).filter((e) => (e.className || '').split(' ').includes(c));
+  for (const u of ['/api/bongos/tasks/claimable?limit=1', '/api/bongos/government/leads']) assert.ok(p.calls.includes(u), u);
+  assert.ok(!p.calls.some((u) => /governor-overlay/.test(u)), 'no overlay is read');
+  assert.equal(p.calls.filter((u) => u === '/api/bongos/me').length, 1, 'the living feeds are read once');
+  assert.equal(cls('streetDepthNear', 'street-depth-sil__face').length, 1);
+  assert.equal(cls('streetDepthFar', 'street-depth-sil__face').length, 1);
+  const claims = fx('tasks__claimable').active_claims.length;
+  assert.equal(cls('streetDepthSky', 'street-depth-pod').length + cls('streetDepthFront', 'street-depth-pod').length, claims, 'one pod per agent');
+  const pod = cls('streetDepthSky', 'street-depth-pod')[0];
+  assert.match(pod.style.offsetPath, /^path\('M/);
+  assert.match(pod.style.animationDelay, /^-[\d.]+s$/);
+  assert.equal(cls('streetDepthFront', 'street-depth-plate').length, 9);
+  assert.equal(all('streetDepthFront').concat(all('streetDepthSky')).filter((e) => 'data-proto' in e.attrs).length, 0, 'nothing is marked prototype');
+  assert.equal(cls('streetDepthFront', 'street-depth-jib').length, 1, 'the live site\'s crane');
+  assert.equal(cls('streetDepthFront', 'street-depth-seat').length, 5, 'the tally\'s seats');
+  assert.equal(cls('streetDepthFront', 'street-depth-needs').length, street().depth.windows.length, 'the floors that hold what needs you light');
+  assert.equal(cls('streetDepthSky', 'street-depth-shaft').length, 1);
+  // the moving nodes stay well under a hundred
+  const moving = ['street-depth-pod', 'street-depth-train', 'street-depth-jib', 'street-depth-line', 'street-depth-slab', 'street-depth-platform', 'street-depth-shaft__ring'];
+  const n = ['streetDepthSky', 'streetDepthFront'].flatMap((id) => all(id)).filter((e) => moving.some((c) => (e.className || '').split(' ').includes(c))).length;
+  assert.ok(n < 100, `${n} moving nodes`);
+});
+
+test('"to do" opens the deck; the readings are tiles, one number and two words', async () => {
+  const p = await bootPage();
+  const deck = p.byId.get('hudDeck');
+  assert.equal(deck.attrs.href, '/builders/street#deck');
+  // the header's count is the one every surface prints (gov-living.js countsOf)
+  const onYou = L.countsOf(living(feeds())).on_you;
+  assert.equal(deck.attrs['aria-label'], onYou + ' to do. Decide them in a row.');
+  assert.equal(p.byId.get('hudNeeds').textContent, String(onYou), 'the city\'s count, not the docket\'s own');
+  assert.equal(p.byId.get('hudMoving').textContent, String(fx('moving').moving), 'moving is GET /moving');
+  const signs = p.byId.get('streetSigns').children;
+  assert.equal(signs.length, 6);
+  for (const a of signs) {
+    assert.equal(a.hidden, false);
+    const fig = a.children[1];
+    assert.equal(fig.className, 'street-sign__figure street-depth-tile__fig');
+    assert.match(fig.children[0].textContent, /^\$?[\d,]+$/);
+    assert.equal(fig.children[1].textContent.split(' ').length, 2);
+  }
+  assert.ok(!('data-proto' in signs[5].children[1].children[0].attrs), 'the laws are a real read');
+});
+
+test('with no living model (gov-living.js not loaded) the page reads no more feeds and still draws the deep street', async () => {
+  const p = await bootPage({ withLiving: false });
+  assert.ok(!p.calls.some((u) => /claimable|governor-overlay|cost-summary|roster/.test(u)));
+  assert.equal(walk(p.byId.get('streetDepthNear')).filter((e) => e.className === 'street-depth-sil__face').length, 1, 'the real skyline');
+  assert.equal(walk(p.byId.get('streetDepthFront')).filter((e) => e.className === 'street-depth-plate').length, 0, 'no Leads');
+  assert.equal(p.byId.get('streetSigns').children.filter((a) => !a.hidden).length, 6, 'the docket\'s own readings stand in');
+});
+
+// task 1004718: the street band is cropped to what it draws. The empty sky
+// over the skylanes and the bare ground under the brackets are cut, so a wide
+// stage fills with the street rather than black sky; everything drawn in the
+// sky (the first skylane, a sitting's shaft, the evening's words) stays inside.
+test('the band is cropped to what it draws: no empty sky over the skylanes', () => {
+  const js = read('street.js'), css = read('street.css').replace(/\/\*[\s\S]*?\*\//g, '');
+  const m = /var BAND_TOP = (\d+), BAND_H = (\d+);/.exec(js);
+  assert.ok(m, 'the band is named once');
+  const top = Number(m[1]), h = Number(m[2]);
+  assert.ok(top >= 128, 'the empty sky over the first skylane is cut');
+  const ruleOf = (sel) => (css.split('\n').find((l) => l.startsWith(sel + ' {')) || '');
+  assert.ok(ruleOf('.street-board').includes('translateY(-' + top + 'px)'), 'the board is lifted by the band\'s top');
+  assert.ok(ruleOf('.street-depth-back').includes('720px) ' + (top + h / 2) + 'px;'), 'the parallax turns on the band\'s middle');
+  assert.ok(Dp.DEPTH.skyTop - top >= 40, 'the first skylane crests inside the band');
+  assert.ok(Dp.DEPTH.shaftTop >= top, 'a sitting\'s shaft starts inside the band');
+  const eve = Number(/\.street-evening \{[^}]*top: (\d+)px/.exec(css)[1]);
+  assert.ok(eve >= top, 'the evening\'s words stand inside the band');
+  assert.ok(top + h >= S.G + 120, 'the brackets and their names stay inside the band');
+});

package/tests/hall_street_desk.mjs

@@ -303,7 +303,7 @@ async function bootPage(hash, ms, { refuse = false, over = {}, xhr = null, answe
   };
   const ctx = vm.createContext({ window, document, fetch, Promise, Math, String, Number, Array, Object, JSON, Date, console, encodeURIComponent, decodeURIComponent, isNaN, isFinite, Map, Set });
   ctx.globalThis = ctx;
-  for (const f of ['city-draw.js', 'street-draw.js', 'street-card.js', 'street-inside.js', 'street-desk.js', 'street.js']) vm.runInContext(read(f), ctx);
+  for (const f of ['city-draw.js', 'street-draw.js', 'street-card.js', 'street-inside.js', 'street-depth.js', 'street-desk.js', 'street.js']) vm.runInContext(read(f), ctx);
   await window.GovStreetPage.ready;
   await new Promise((r) => setTimeout(r, 0));
   const deskEl = () => (byId.get('insideOpenA').hidden ? byId.get('insideOpenB') : byId.get('insideOpenA'));