@bongos/core 1.25.31 → 1.25.33

package/tests/welcome_boot_browser.mjs

@@ -1,9 +1,9 @@
 // tests/welcome_boot_browser.mjs — the welcome in a real browser (tasks 1004785, 1004818).
 //
 // WHY. "Once a day", "Skip", "the craft picker does not also open", "Patron only with a seat", the day
-// and night paintings and the slow way out are behaviour across the real shell.js, craft-mode.js and
+// and night veils over the city in the clouds and the slow way out are behaviour across the real shell.js, craft-mode.js and
 // welcome-boot.js together — the shell is what decides which of the two greets a builder — so this
-// serves the REAL Home markup, the REAL hall scripts and the REAL paintings from a routed origin
+// serves the REAL Home markup and the REAL hall scripts (the city's painters too) from a routed origin
 // (localStorage needs one) in the ui-design kit's launcher. Every wait is on DOM state, never on a
 // flag that flips before the DOM settles (the task 1004780 CI flake). Skips when the machine has no
 // system Edge or Chrome, as ui_design_kit_fit does.
@@ -33,7 +33,9 @@ const INDEX = fs.readFileSync(path.join(HALL, 'index.html'), 'utf8')
   .replace(/<script\b[^>]*>[\s\S]*?<\/script>/g, '')
   .replace(/\{\{[^}]*\}\}/g, '');
 const STUB = '<script>window.__BRANDING__ = { identity: { worldName: "Harbor" } }; window.BongosClient = { createClient: () => ({ request: async () => ({ ok: false, status: 404, data: null }) }) };</script>';
-const SCRIPTS = ['dom-utils.js', 'shell-trail.js', 'craft-mode.js', 'welcome-boot.js', 'shell.js'] // dom-utils first, as on the real page (task 1004876)
+// The city's three painters draw the scene (task 1005308: the city in the clouds, not a painting).
+const PAINTERS = ['sky-time.js', 'city-draw.js', 'home-city-draw.js'];
+const SCRIPTS = ['dom-utils.js', ...PAINTERS, 'shell-trail.js', 'craft-mode.js', 'welcome-boot.js', 'shell.js'] // dom-utils first, as on the real page (task 1004876)
   .map((f) => `<script src="/builders/${f}"></script>`).join('');
 const PAGE = INDEX.replace('</body>', STUB + SCRIPTS + '</body>');
 
@@ -46,7 +48,7 @@ async function hall({ art = true, reducedMotion = 'no-preference', time = null }
     if (p === '/api/bongos/auth/web/start') return route.fulfill({ contentType: 'text/html', body: '<!doctype html><title>github</title><p id="auth">sign in</p>' });
     if (p === '/studio' || p === '/city') return route.fulfill({ contentType: 'text/html', body: '<!doctype html><title>room</title><p id="room">' + p + '</p>' });
     const ext = path.extname(p);
-    if (ext === '.webp' && !art) return route.fulfill({ status: 404, body: '' });
+    if (!art && PAINTERS.includes(path.basename(p))) return route.fulfill({ status: 404, body: '' });
     const f = path.join(HALL, p.replace(/^\/builders\//, ''));
     if (p.startsWith('/builders/') && TYPES[ext] && fs.existsSync(f)) return route.fulfill({ contentType: TYPES[ext], body: fs.readFileSync(f) });
     return route.fulfill({ status: 404, body: '' });
@@ -91,8 +93,8 @@ test('first visit of the day: the welcome, not the craft picker; Skip brings the
     'the welcome shows, the picker is marked asked and does not stack on it');
   assert.equal(await page.evaluate(() => document.querySelector('.wb__banner').tagName), 'DIV',
     'over a signed-in hall the shell keeps the one <header>; the banner is a plain block (task 1005080)');
-  // The painting loads and its motion is laid over it.
-  await page.waitForFunction(() => { const i = document.querySelector('#welcome-boot .wb__img'); return i && i.complete && i.naturalWidth === 1024; });
+  // The city in the clouds is drawn behind it (task 1005308).
+  await page.waitForSelector('#welcome-boot .cloud-scene .cloud-scene__svg path');
   assert.equal(await page.isVisible('[data-wb-skip]'), true);
   await page.click('[data-wb-skip]');
   await done(page);
@@ -227,17 +229,18 @@ test('roles: a seat holder sees Patron; Artisan stays on Home in Artisan', { ski
   await ctx.close();
 });
 
-test('no painting: the greeting and the choice still come up, over the sky colour', { skip }, async () => {
+test('no city painters: the greeting and the choice still come up, over the sky colour', { skip }, async () => {
   const ctx = await hall({ art: false });
   const { page } = await open(ctx);
   await signIn(page);
   await done(page);
   const s = await page.evaluate(() => ({
     bare: document.getElementById('welcome-boot').classList.contains('wb--bare'),
-    img: document.querySelector('#welcome-boot .wb__img').hidden,
+    city: !!document.querySelector('#welcome-boot .cloud-scene__svg'),
+    sky: !!document.querySelector('#welcome-boot .cloud-scene'),
     choices: document.querySelectorAll('.wb__choice').length,
   }));
-  assert.deepEqual(s, { bare: true, img: true, choices: 2 });
+  assert.deepEqual(s, { bare: true, city: false, sky: true, choices: 2 });
   await ctx.close();
 });
 
@@ -256,15 +259,16 @@ const look = (page) => page.evaluate(() => {
   return {
     day: r.classList.contains('wb--day'), night: r.classList.contains('wb--night'),
     veil: getComputedStyle(r.querySelector('.wb__veil')).backgroundColor,
-    art: r.querySelector('.wb__img').getAttribute('src'),
-    beacons: r.querySelectorAll('.wb-beacon').length,
+    city: !!r.querySelector('.cloud-scene__svg'),
+    hour: document.documentElement.getAttribute('data-sky-hour'),
+    img: r.querySelectorAll('img:not(.wb__logo)').length,
   };
 });
 
-test('by day the day painting opens from a white veil; by night the night one from black, with its lights', { skip }, async () => {
+test('by day the city opens from a white veil, by night from black, in the sky of that hour (task 1005308)', { skip }, async () => {
   for (const [time, want] of [
-    [new Date(2026, 9, 23, 10, 0), { day: true, night: false, veil: 'rgb(255, 255, 255)', art: '/builders/welcome-day.webp', beacons: 0 }],
-    [new Date(2026, 9, 23, 22, 0), { day: false, night: true, veil: 'rgb(0, 0, 0)', art: '/builders/welcome-night.webp', beacons: 0 }], // task 1005087 took the beacons out
+    [new Date(2026, 9, 23, 10, 0), { day: true, night: false, veil: 'rgb(255, 255, 255)', city: true, hour: '10', img: 0 }],
+    [new Date(2026, 9, 23, 22, 0), { day: false, night: true, veil: 'rgb(0, 0, 0)', city: true, hour: '22', img: 0 }],
   ]) {
     const ctx = await hall({ time });
     const { page } = await open(ctx);
@@ -305,19 +309,21 @@ test('the banner is the animated logo, the motion is laid on, and the drawn towe
   const ctx = await hall();
   const { page } = await open(ctx);
   await signIn(page);
-  await page.waitForSelector('#welcome-boot.wb--lit .wb-motion');
+  await page.waitForSelector('#welcome-boot.wb--lit .cloud-scene__svg');
   const s = await page.evaluate(() => ({
     banner: document.querySelector('.wb__banner').textContent,
     name: document.querySelector('.wb__banner .wb__name').textContent,
     mark: !!document.querySelector('.wb__banner svg.wb__mark .wb__moonlet'),
     ringAnim: getComputedStyle(document.querySelector('.wb__ring')).animationName,
-    pulses: document.querySelectorAll('#wb-fx .wb-pulse').length,
-    cars: document.querySelectorAll('#wb-fx .wb-car').length,
-    old: document.querySelectorAll('.wb-floor, .wb-bldg, .wb-person, #wb-scene, #wb-beam, #wb-city').length,
+    // anywhere on the page, under any container: the painting's lights must not come back
+    pulses: document.querySelectorAll('.wb-pulse, .wb-pulses').length,
+    cars: document.querySelectorAll('.wb-car').length,
+    // every earlier scene: the drawn tower and city, the painting and its light layer
+    old: document.querySelectorAll('.wb-floor, .wb-bldg, .wb-person, #wb-beam, #wb-city, #wb-fx, .wb-motion, .wb-moon, .wb-star, .wb__img').length,
   }));
   assert.doesNotMatch(s.banner, /Working on the core of/, 'task 1004953: the banner text is gone');
   assert.deepEqual({ name: s.name, mark: s.mark, ringAnim: s.ringAnim, pulses: s.pulses, cars: s.cars, old: s.old },
-    { name: 'Harbor', mark: true, ringAnim: 'wb-ring', pulses: 21, cars: 3, old: 0 });
+    { name: 'Harbor', mark: true, ringAnim: 'wb-ring', pulses: 0, cars: 0, old: 0 }, 'the painting\'s lights went with it (task 1005308)');
   await ctx.close();
 });