Flipper: il tabellone cambia illustrazione con la zona che la pallina attraversa (il Regolo coronato, la Fortezza, la Pieve, la Sieve, il Trebbio, i rioni) e il simbolo della zona sul campo (Codex, flipper-art.js); «TIENI PREMUTO QUI» per la molla solo col dito

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

tests/flipper.browser.mjs

@@ -51,8 +51,38 @@ try {
             assert.ok(w > viewport.width * 0.6, `sul telefono la scena del flipper è larga ${w} px`);
         }
         await page.screenshot({ path: `${out}/${name}-tavola.png` });
+        // «TIENI PREMUTO QUI» per la molla solo col dito (Andrea): sul computer la tavola non la dice.
+        assert.equal(await page.evaluate(() => !!game.closeup.touch), mobile, 'la scritta della molla solo sul telefono');
         const box = await page.locator('#scene').boundingBox(), P = (x, y) => [box.x + x / 640 * box.width, box.y + y / 360 * box.height];
         if (!mobile) await page.screenshot({ path: `${out}/desktop-dettaglio.png`, clip: { x: P(200, 0)[0], y: box.y, width: 248 / 640 * box.width, height: box.height } });
+        // Le apparizioni seguono zone vere del campo e cambiano effettivamente i pixel del backglass.
+        if (!mobile) {
+            await page.evaluate(() => {
+                window.artState = structuredClone(game.closeup); window.artUpdate = game.update;
+                game.update = () => {};
+            });
+            const pictures = new Set();
+            for (const [x, y, scene] of [[403, 70, 'regolo'], [290, 135, 'fortezza'], [416, 180, 'trebbio'], [220, 168, 'pieve'], [297, 90, 'rioni'], [320, 290, 'sieve']]) {
+                const result = await page.evaluate(async ({ x, y }) => {
+                    const { render } = await import('/src/engine/render.js');
+                    const { flipperScene } = await import('/src/engine/flipper-art.js');
+                    const c = game.closeup, ctx = document.querySelector('#scene').getContext('2d');
+                    Object.assign(c.ball, { x, y, waiting: false, releaseAt: 0, ramp: null });
+                    for (let i = 0; i < 4; i++) { c.visual.time += 0.4; render(ctx, game, { time: performance.now() }); }
+                    const pixels = ctx.getImageData(48, 476, 300, 176).data;
+                    let signature = 0;
+                    for (let i = 0; i < pixels.length; i++) signature = (Math.imul(signature, 31) + pixels[i]) | 0;
+                    return { scene: flipperScene(c), signature };
+                }, { x, y });
+                assert.equal(result.scene, scene); pictures.add(result.signature);
+                await page.screenshot({ path: `${out}/desktop-visione-${scene}.png` });
+            }
+            assert.equal(pictures.size, 6, 'sei illustrazioni diverse nel display');
+            await page.evaluate(() => {
+                Object.assign(game.closeup, window.artState); game.update = window.artUpdate;
+                delete window.artState; delete window.artUpdate;
+            });
+        }
         const cdp = mobile ? await page.context().newCDPSession(page) : null;
         const touch = (type, points) => cdp.send('Input.dispatchTouchEvent', { type, touchPoints: points.map(([x, y]) => ({ x, y })) });
         // La molla: tenendo premuto sulla scena, col mouse e col dito.