Biliardo più bello (Codex): tavolo in pixel art visto dall'alto con cornice a fasce e diamanti, sala in penombra e luce delle lampade sul panno, segnapunti a cifre rosse, steccata e birilli che cadono animati, biglie in pixel, l'Ing. Tozzi a bordo tavolo che dà il gesso, esulta o allarga le braccia. Più: scritte a 8 punti (a 6 la B sembrava una D) e la stecca che torna a seguire il mouse finché un clic non fissa la mira (Andrea: «non riesco più a girare la stecca»)

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018ks2K99uqCZjAxvy7Rdj1R

tests/biliardo.browser.mjs

@@ -1,7 +1,7 @@
 // Regressioni della mira con veri eventi browser, su desktop e touch.
 // npm run browser:biliardo — schermate in /tmp/regolo-biliardo.
 import { chromium } from 'playwright';
-import { mkdirSync } from 'node:fs';
+import { mkdirSync, writeFileSync } from 'node:fs';
 import assert from 'node:assert/strict';
 import { staticServer } from './helpers.mjs';
 
@@ -10,6 +10,59 @@ mkdirSync(out, { recursive: true });
 const server = await staticServer();
 let browser;
 const errors = [];
+
+// Fotogrammi ripetibili del renderer, oltre alle schermate dell'interfaccia reale.
+async function checkArtwork(page, name) {
+    const captures = await page.evaluate(async () => {
+        const { story } = await import('/src/story/story.js');
+        const { newBiliardo, shoot, update, LEN, WID, VIEW } = await import('/src/engine/biliardo.js');
+        const { drawBiliardo } = await import('/src/engine/biliardo-render.js');
+        const def = story.closeups.biliardo;
+        const load = async src => { const img = new Image(); img.src = src; await img.decode(); return img; };
+        const bg = await load('/' + def.picture);
+        const atlas = await (await fetch('/assets/characters/ing-tozzi.json')).json();
+        const sheet = { atlas, img: await load('/assets/characters/' + atlas.image) };
+        const canvas = document.createElement('canvas'); canvas.width = 640; canvas.height = 360;
+        const ctx = canvas.getContext('2d'), shots = [], used = [];
+        const drawImage = ctx.drawImage.bind(ctx);
+        ctx.drawImage = (image, ...args) => { used.push(image); drawImage(image, ...args); };
+        const c = newBiliardo(42);
+        const draw = label => {
+            const before = JSON.stringify(c);
+            drawBiliardo(ctx, c, def, bg, sheet);
+            if (before !== JSON.stringify(c)) throw new Error('Il renderer modifica la partita');
+            shots.push({ label, png: canvas.toDataURL('image/png').split(',')[1] });
+        };
+        c.step = 'settle'; draw('riposo');
+        if (!used.includes(bg) || !used.includes(sheet.img)) throw new Error('Tavolo o Ingegnere non disegnati');
+        const pixel = (x, y) => [...ctx.getImageData(x, y, 1, 1).data].slice(0, 3);
+        const bright = p => p.reduce((s, v) => s + v, 0);
+        if (bright(pixel(320, 180)) <= bright(pixel(85, 180))) throw new Error('Manca la luce centrale');
+        if (pixel(177, 22).join() !== '255,90,61') throw new Error('Cifra rossa a sette segmenti assente');
+        if (pixel(177, 30).join() !== '56,27,23') throw new Error('Lo zero accende il segmento centrale');
+        const b = c.balls.player, bx = VIEW.x + b.x * VIEW.k, by = VIEW.y + b.y * VIEW.k;
+        const colors = new Set();
+        for (let y = Math.ceil(by - 3); y <= by + 3; y++) for (let x = Math.ceil(bx - 3); x <= bx + 3; x++) colors.add(pixel(x, y).join());
+        if (colors.size > 4 || !colors.has('255,253,244')) throw new Error('Biglia senza palette ridotta o riflesso quadrato');
+        c.step = 'aim'; c.current = 'cpu'; draw('tozzi-chalk');
+        c.last = { shooter: 'cpu', to: 'cpu', points: 4, foul: null, age: 0 }; c.points.cpu = 4; draw('tozzi-cheer');
+        c.last = { shooter: 'cpu', to: 'player', points: 2, foul: 'miss', age: 0 }; draw('tozzi-shrug');
+        c.last = null; c.current = 'player'; c.points.cpu = 0;
+        shoot(c); update(c, 0.1); draw('stecca-arretrata'); update(c, 0.07); draw('stecca-avanti'); update(c, 0.08); draw('biglie-partite');
+        const pins = newBiliardo(9);
+        Object.assign(pins.balls.player, { x: LEN / 2 - 60, y: WID / 2 });
+        Object.assign(pins.balls.cpu, { x: LEN / 2 - 30, y: WID / 2 });
+        Object.assign(pins.balls.pallino, { x: 20, y: 20 });
+        pins.angle = 0; pins.power = 0.5; shoot(pins);
+        for (let n = 0; n < 1000 && !pins.pins.some(p => p.down); n++) update(pins, 1 / 240);
+        update(pins, 0.25); update(pins, 0.04);
+        drawBiliardo(ctx, pins, def, bg, sheet);
+        shots.push({ label: 'birilli-caduta', png: canvas.toDataURL('image/png').split(',')[1] });
+        return shots;
+    });
+    for (const { label, png } of captures) writeFileSync(`${out}/${name}-${label}.png`, Buffer.from(png, 'base64'));
+}
+
 try {
     browser = await chromium.launch({ args: ['--use-gl=angle', '--use-angle=swiftshader', '--enable-unsafe-swiftshader'] });
     for (const [name, mobile, viewport] of [
@@ -32,6 +85,10 @@ try {
             game.choose(game.options().findIndex(o => o.text.includes('una partita ai birilli'))); settle(game);
         });
         await page.waitForSelector('#bocce-controls:not([hidden])');
+        await page.waitForFunction(async () => {
+            const { hasBackground } = await import('/src/engine/render.js');
+            return hasBackground('assets/closeups/biliardo-tavolo.png');
+        });
         const canvas = await page.locator('#scene').boundingBox();
         for (const id of ['#sound', '#corner']) {
             const box = await page.locator(id).boundingBox();
@@ -55,6 +112,12 @@ try {
             return { x: r.x + x / 640 * r.width, y: r.y + y / 360 * r.height, r };
         };
         const target = await position();
+        if (!mobile) {
+            // Prima del clic la stecca segue il mouse (Andrea, 25 ottobre: «non riesco più a girare la stecca»).
+            const before = (await state()).angle;
+            await page.mouse.move(target.r.x + target.r.width * 0.5, target.r.y + target.r.height * 0.85, { steps: 4 });
+            assert.notEqual((await state()).angle, before, 'senza clic la stecca gira col mouse');
+        }
         if (mobile) await page.touchscreen.tap(target.x, target.y);
         else await page.mouse.click(target.x, target.y);
         assert.equal((await state()).step, 'aim', 'un tocco sceglie la mira senza tirare');
@@ -72,6 +135,7 @@ try {
         await page.locator('#bocce-power').fill('60');
         const prepared = await state();
         await page.screenshot({ path: `${out}/${name}-mira.png` });
+        await checkArtwork(page, name);
         const expected = await page.evaluate(async () => {
             const { simulate } = await import('/src/engine/biliardo.js');
             const c = game.closeup;