chore(deps): risolve vulnerabilità npm audit e aggiorna a Node 24 LTS

Aggiorna vitest/@vitest/ui alla 4.1.10 (azzera le 14 vulnerabilità segnalate da npm audit, incluse 2 critiche). Node 20 era ormai a fine supporto: Dockerfile, .nvmrc ed engines in package.json passano a Node 24 LTS; il README documenta i requisiti in una sezione dedicata in cima al file, senza duplicarli altrove.
fix(referto): rimuove il riepilogo set vinti ridondante
2026-07-15 10:58:52 +02:00 · 2026-07-15 10:36:26 +02:00 · 2026-07-15 10:26:50 +02:00 · 2026-07-15 10:25:57 +02:00 · 2026-07-15 10:11:40 +02:00 · 2026-07-15 10:05:47 +02:00
23 changed files with 2237 additions and 501 deletions
@@ -0,0 +1 @@
 24
@@ -7,6 +7,37 @@ e questo progetto aderisce al [Versionamento Semantico](https://semver.org/lang/
 ---
 ## [2.1.0] - 2026-07-08
 ### Aggiunto
 - Time out con spot pubblicitari: sul controller una modal fa scegliere squadra e video (o nessuno) tra i file `.mp4` della cartella `spot/`; il display copre il tabellone con un overlay a countdown, riproduce il video scelto (con fallback su testo "TIME OUT <squadra>" se manca o finisce in anticipo) e sfuma nell'ultimo secondo; il server chiude automaticamente il time out dopo 30s anche in caso di disconnessione del controller; video elencati da `/spot/list` e serviti da `/spot/<file>.mp4`
 - Storico di cambi e time out registrato per ogni set nella `striscia` (popolato lazy, ordinato per punteggio, usato dal referto)
 - Modalità **Amichevole**: i set si vincono normalmente ma la partita non termina mai automaticamente, per giocare set illimitati
 - Dialog dedicato a fine partita che blocca ulteriori punti e apre le azioni post-match (referto, chiusura)
 - Prototipo di generazione referto di gara stampabile (`src/referto.js`): formazioni di partenza, griglia punti, cambi e time out per set
 - Layout esteso "da regia" per il controller in orientamento landscape (tablet), con pannelli squadra affiancati
 - Indicatore ON/OFF sul pulsante Striscia del controller; config si riapre automaticamente dopo un reset
 - Supporto WSL2 in sviluppo: `getNetworkIPs()` interroga PowerShell per ottenere gli IP reali della rete Windows
 - Flusso di sviluppo containerizzato con hot reload: `docker-compose.dev.yml` e nuovo target `dev` nel Dockerfile multi-stage
 - Suite di test estesa a oltre il 99% di copertura statement, con nuovi test e2e (time out, referto, accessibilità, visual regression)
 ### Modificato
 - `punteggio`/`setVinti`/`servizio` derivati sempre dalla `striscia` invece di essere memorizzati nello stato
 - Struttura dati `striscia` compattata da array a stringa
 - Il controller rispetta `state.order` (scambio lato squadre) come il display
 - Logica di connessione WebSocket lato client estratta in `src/wsMixin.js` riusabile
 - Dev server esposto su tutte le interfacce di rete (`vite --host`)
 - Persistenza dati passata da named volume a bind mount (`./.segnapunti`) per accesso diretto ai file dall'host
 ### Rimosso
 - Sezione shortcut da tastiera dal README (funzionalità non più implementata)
 - Emoji da codice, UI e commenti (ora vietate salvo richiesta esplicita)
 ### Corretto
 - Immagine Docker di produzione: mancava la copia di `src/spot-utils.js`, causando errori nel serving degli spot video
 ---
 ## [2.0.0] - 2026-05-12
 ### Aggiunto
@@ -1,27 +1,27 @@
 # CLAUDE.md
-This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
+Guida per Claude Code su questo repository.
 ## Scopo del progetto
-**Segnapunti Anto** è una PWA per il segnapunti pallavolo in tempo reale. Un server Express/WebSocket gestisce lo stato di gioco; due interfacce Vue separate — **display** (tabellone pubblico) e **controller** (pannello operatore) — si sincronizzano via WebSocket.
+**Segnapunti Anto**: PWA segnapunti pallavolo in tempo reale. Server Express/WebSocket gestisce lo stato di gioco; due interfacce Vue — **display** (tabellone pubblico) e **controller** (pannello operatore) — sincronizzate via WebSocket.
 ## Comandi
 ```bash
-npm run dev          # Vite dev server — display: :5173/display, controller: :5173/controller
+npm run dev              # Vite dev — display: :5173/display, controller: :5173/controller
 npm run serve            # Build + avvio produzione — display: :3000/display, controller: :3000/controller
-npm run test         # Vitest in modalità watch
+npm run test             # Vitest watch
-npm run test:all     # Tutte le suite Vitest in una sola esecuzione
+npm run test:all         # Tutte le suite in una sola esecuzione
 npm run test:unit        # Solo unit + integration
-npm run test:component  # Test componenti Vue (happy-dom)
+npm run test:component   # Componenti Vue (happy-dom)
 npm run test:stress      # Load test (50+ client concorrenti)
-npm run test:e2e     # Playwright E2E (richiede npm run serve attivo)
+npm run test:e2e         # Playwright E2E (richiede `npm run serve` attivo)
 npm run test:e2e:ui      # Playwright con UI interattiva
 ```
-Per eseguire un singolo file di test: `npx vitest run tests/unit/gameState.test.js`
+Singolo file di test: `npx vitest run tests/unit/gameState.test.js`
 ## Architettura
@@ -32,35 +32,41 @@ Display (Vue)     ──WebSocket──┤── websocket-handler.js ── gam
                                │         └── persist.js ── .segnapunti/state.json
 ```
-**Tutta la logica di gioco** è in `src/gameState.js` come funzioni pure esportate:
+**`src/gameState.js`** — logica di gioco, funzioni pure:
- `createInitialState()` — restituisce lo stato iniziale
+- `createInitialState()` — stato iniziale
 - `applyAction(state, action)` — reducer immutabile (deep-clone via `structuredClone`)
- `checkVittoria(state)` — condizioni di vittoria set (25 punti, vantaggio di 2; 15 punti nel set decisivo)
+- `checkVittoria(state)` — vittoria set: 25 punti/vantaggio 2 (15 nel set decisivo)
- `punteggio` / `setVinti` / `servizio` — derivano punteggio corrente, set vinti e chi serve dalla `striscia` (lo stato NON memorizza questi valori direttamente)
+- `punteggio` / `setVinti` / `servizio` — derivati dalla `striscia`, NON memorizzati direttamente nello stato
-Punteggio, set e servizio si ricavano sempre dalla `striscia`: al primo punto di ogni set `applyAction('incPunt')` salva in `formInizio` uno snapshot della formazione di partenza (usato dal referto); `decPunt` lo rimuove se il set torna a 0-0.
+Punteggio, set e servizio si ricavano sempre dalla `striscia`. Al primo punto di ogni set, `applyAction('incPunt')` salva in `formInizio` uno snapshot della formazione di partenza (usato dal referto); `decPunt` lo rimuove se il set torna a 0-0.
-`src/websocket-handler.js` riceve i messaggi WebSocket, valida che il mittente sia un `controller` (non un `display`), chiama `applyAction`, fa il broadcast del nuovo stato a tutti i client, poi invoca `onStateChange` per persistere su disco.
+Ogni voce della `striscia` accumula anche lo storico di cambi/time out del set, popolato lazy (nessun campo se il set non ha eventi), senza timestamp — il "quando" è il punteggio al momento dell'evento, non l'orologio:
 - `set.timeouts`: `{ team, punteggio: { home, guest } }`, appeso da `startTimeout` (solo se non già attivo, per non duplicare l'evento su un restart).
 - `set.cambi`: `{ team, in, out, punteggio }`, uno per sostituzione applicata da `confermaCambi` (nulla se la validazione fallisce).
-`src/wsMixin.js` è il mixin Vue lato client: gestisce connessione/riconnessione WebSocket (backoff esponenziale) ed espone i computed `punt`/`servHome`/`set`.
+**`src/websocket-handler.js`** — riceve i messaggi, valida che il mittente sia `controller` (non `display`), chiama `applyAction`, fa broadcast del nuovo stato, poi invoca `onStateChange` per persistere.
-`src/referto.js` genera il referto di gara: `buildRefertoHtml(state, now)` è una funzione pura che restituisce l'HTML (testabile), mentre `generaReferto(state)` è il wrapper che apre la finestra con `window.open` e avvia la stampa.
+**`src/wsMixin.js`** — mixin Vue lato client: connessione/riconnessione WebSocket (backoff esponenziale), espone i computed `punt`/`servHome`/`set`.
-`src/persist.js` carica/salva lo stato su `.segnapunti/state.json`. `src/server-utils.js` ricava gli IP di rete (`getNetworkIPs`, con sorgente iniettabile) e stampa gli URL all'avvio. `src/spot-utils.js` espone `listSpotVideos(spotDir)`, che elenca i `.mp4` (ordinati) della cartella `spot/`; ritorna `[]` se la cartella manca.
+**`src/referto.js`** — genera il referto di gara: `buildRefertoHtml(state, now)` è pura (testabile, ritorna HTML); `generaReferto(state)` apre la finestra (`window.open`) e avvia la stampa. Per ogni set mostra formazione di partenza, griglia punti e (se presenti) `set.timeouts`/`set.cambi` ordinati per punteggio crescente.
-**Time out / spot video** — le action `startTimeout` (richiede `team`, `video` opzionale) e `stopTimeout` impostano/azzerano `state.timeout`, `timeoutTeam`, `timeoutVideo` e `timeoutStartedAt`. Il timestamp `startedAt` lo aggiunge `websocket-handler.js` (non il client), così `gameState.js` resta puro e deterministico; lo stesso handler arma un timer server-side di 30 secondi che invia automaticamente `stopTimeout` (sopravvive a refresh o disconnessione del controller). Sul controller il pulsante Time Out apre una modal per scegliere la squadra e uno dei video `.mp4` della cartella `spot/` nella root (non versionata), oppure nessun video; durante il time out il pulsante mostra il countdown e ripremerlo chiude in anticipo. Il display copre il tabellone con un overlay a tutto schermo con countdown: riproduce il video scelto (riallineandosi al punto giusto in caso di riconnessione a metà time out) e ripiega sulla scritta "TIME OUT <squadra>" se non c'è video o se il video finisce prima dei 30 secondi, con dissolvenza nell'ultimo secondo. La lista è esposta dall'endpoint HTTP `/spot/list` (JSON) e i file sono serviti staticamente da `/spot/<file>.mp4`, sia in produzione (`server.js`) sia in sviluppo (`vite-plugin-websocket.js`). I video partono con audio; se il browser blocca l'autoplay con suono si ripiega automaticamente su muto — per avere l'audio reale il browser del display (schermo senza input) va avviato in kiosk con autoplay consentito (es. Chrome `--autoplay-policy=no-user-gesture-required`).
+**`src/persist.js`** — carica/salva lo stato su `.segnapunti/state.json`.
 **`src/server-utils.js`** — `getNetworkIPs` (sorgente iniettabile), stampa gli URL all'avvio.
 **`src/spot-utils.js`** — `listSpotVideos(spotDir)`: elenca i `.mp4` (ordinati) di `spot/`; `[]` se la cartella manca.
-`server.js` (Express) espone `createApp(distDir)` (solo routing, testabile) e `startServer(port)` (HTTP + WebSocket); serve entrambe le interfacce sulla porta 3000: `/display` → `dist/index.html`, `/controller` → `dist/controller.html`. Singolo endpoint WebSocket su `/ws`. L'avvio automatico parte solo se il file è eseguito come entrypoint.
+**Time out / spot video** — `startTimeout` (`team`, `video` opzionale) e `stopTimeout` impostano/azzerano `state.timeout`, `timeoutTeam`, `timeoutVideo`, `timeoutStartedAt`. `startedAt` è aggiunto da `websocket-handler.js` (non dal client), così `gameState.js` resta puro/deterministico; lo stesso handler arma un timer server-side di 30s che invia automaticamente `stopTimeout` (sopravvive a refresh/disconnessione del controller). Sul controller, il pulsante Time Out apre una modal per scegliere squadra + un `.mp4` da `spot/` (cartella in root, non versionata) o nessun video; durante il time out mostra il countdown, ripremerlo chiude in anticipo. Sul display, un overlay fullscreen con countdown copre il tabellone: riproduce il video (riallineandosi al punto giusto su riconnessione a metà time out) o mostra "TIME OUT <squadra>" se manca il video o finisce prima dei 30s, con dissolvenza nell'ultimo secondo. Lista esposta da `/spot/list` (JSON), file serviti da `/spot/<file>.mp4` sia in produzione (`server.js`) che in dev (`vite-plugin-websocket.js`). I video partono con audio; se l'autoplay con suono è bloccato si ripiega su muto — per audio reale il browser del display va avviato in kiosk con autoplay consentito (es. Chrome `--autoplay-policy=no-user-gesture-required`).
-In sviluppo, `vite-plugin-websocket.js` incorpora il server WebSocket dentro il dev server Vite con middleware di URL rewrite per `/display` e `/controller`.
+**`server.js`** — Express: espone `createApp(distDir)` (solo routing, testabile) e `startServer(port)` (HTTP + WebSocket). Serve `/display` → `dist/index.html`, `/controller` → `dist/controller.html` sulla porta 3000; endpoint WebSocket unico `/ws`. Si auto-avvia solo se eseguito come entrypoint.
 **`vite-plugin-websocket.js`** — in dev, incorpora il server WebSocket nel dev server Vite con rewrite URL per `/display` e `/controller`.
 ## Vincoli di design
- **Tutta la logica sul server** — i client sono pura UI; il server è l'unica source of truth.
+- **Logica solo server-side** — i client sono pura UI; il server è l'unica source of truth.
- **WebSocket role-based** — i client si registrano come `display` o `controller`; solo i controller possono inviare azioni.
+- **WebSocket role-based** — i client si registrano come `display` o `controller`; solo i controller inviano azioni.
 - **Stato immutabile** — `applyAction` non muta mai lo stato, restituisce sempre un nuovo oggetto.
- **Un solo controller** — il design prevede un controller e un display attivi; non esiste conflict resolution per controller simultanei.
+- **Un solo controller/display attivi** — nessuna conflict resolution per controller simultanei.
- **Stato persistente** — `src/persist.js` salva lo stato in `.segnapunti/state.json` dopo ogni azione e lo carica all'avvio del server.
+- **Stato persistente** — `src/persist.js` salva in `.segnapunti/state.json` dopo ogni azione e ricarica all'avvio.
 ## Layout dei test
@@ -72,23 +78,34 @@ In sviluppo, `vite-plugin-websocket.js` incorpora il server WebSocket dentro il
 | Stress | `tests/stress/` | Vitest + Node |
 | E2E | `tests/e2e/` | Playwright (Chromium, Firefox, Mobile Chrome) |
-I test E2E girano in serie (`workers: 1`) per evitare race condition sullo stato WebSocket. Eseguire `npm run serve` prima di `npm run test:e2e`.
+E2E gira in serie (`workers: 1`) per evitare race condition sullo stato WebSocket; richiede `npm run serve` attivo prima di `npm run test:e2e`.
 Copertura statement/linee Vitest oltre il 99%. Per testare `startServer()` (`server.js`) o i rami platform-dependent di `getNetworkIPs()` (`server-utils.js`) senza effetti collaterali reali (scrittura su `.segnapunti/state.json`, dipendenza dalla piattaforma), mockare il modulo con `vi.mock`/`vi.doMock` (vedi `tests/integration/startServer.test.js`, `tests/unit/server-utils-platform.test.js`) invece di eseguire il codice reale.
 ## Deploy
-Il progetto si distribuisce tramite Docker. L'immagine è pubblicata sul registry Gitea self-hosted (`santantonio.sytes.net`):
+`Dockerfile` è multi-stage con 4 target: `deps` (dipendenze condivise), `dev` (hot reload Vite), `builder` (build frontend), `runtime` (immagine di produzione, target di default).
 **Produzione** — `docker-compose.yml` usa l'immagine già pubblicata sul registry Gitea self-hosted (`santantonio.sytes.net`), niente build locale:
 ```bash
 docker compose up -d   # Avvia con immagine dal registry privato (porta 3000)
 ```
-Il volume `./.segnapunti` persiste lo stato tra i riavvii del container.
+**Sviluppo** — `docker-compose.dev.yml` builda il target `dev` in locale e monta il codice sorgente per l'hot reload (Vite su porta 5173); `node_modules` resta un volume anonimo del container per non farsi sovrascrivere dal bind-mount (evita anche problemi di binari nativi arch-specific tra host e container):
 ```bash
 docker compose -f docker-compose.dev.yml up --build
 ```
 Per buildare in locale l'immagine di produzione (es. per testarla prima del push sul registry): `docker build -t segnapunti:local .` (usa il target `runtime` di default).
 Volume `./.segnapunti` persiste lo stato tra i riavvii del container.
 ## Istruzioni operative
- Per ogni nuova funzionalità: analizza come si inserisce nel flusso `action → applyAction → broadcast`, poi decidi se aggiungere un nuovo tipo di action o estendere uno esistente.
+- Nuova funzionalità: valutare come si inserisce nel flusso `action → applyAction → broadcast`, poi decidere se serve un nuovo action type o estendere uno esistente.
- Qualsiasi modifica alle regole di gioco va fatta esclusivamente in `src/gameState.js`.
+- Regole di gioco → solo `src/gameState.js`. Protocollo WebSocket → solo `src/websocket-handler.js`.
- Qualsiasi modifica al protocollo WebSocket va fatta in `src/websocket-handler.js`.
+- Nuovo action type o regola di gioco → aggiungere test in `tests/unit/gameState.test.js`.
- Aggiungere test unit in `tests/unit/gameState.test.js` per ogni nuovo action type o regola di gioco.
+- Commenti e nomi di dominio in italiano (es. `servHome`, `striscia`, `nomi`); nomi tecnici standard in inglese (`state`, `action`, `handler`).
- Il codice deve essere scritto in italiano per commenti e nomi di variabili di dominio (es. `servHome`, `striscia`, `nomi`), ma in inglese per nomi tecnici standard (`state`, `action`, `handler`).
+- Niente emoji in codice, UI (label, testi bottoni, banner) o commenti, salvo richiesta esplicita dell'utente.
 - Non inserire emoji in codice, UI (label, testi dei bottoni, banner) o commenti, a meno che l'utente non le richieda esplicitamente.
@@ -1,13 +1,22 @@
-# Stage 1: build frontend
+# Stage 1: dipendenze condivise (build + dev)
-FROM node:20-alpine AS builder
+FROM node:24-alpine AS deps
 WORKDIR /app
 COPY package*.json ./
 RUN npm ci
 # Stage 2: dev — hot reload via Vite, sorgente montato da bind-mount
 FROM deps AS dev
 ENV NODE_ENV=development
 EXPOSE 5173
 CMD ["npm", "run", "dev"]
 # Stage 3: build frontend
 FROM deps AS builder
 COPY . .
 RUN npm run build
-# Stage 2: runtime
+# Stage 4: runtime di produzione
-FROM node:20-alpine
+FROM node:24-alpine AS runtime
 WORKDIR /app
 ENV NODE_ENV=production PORT=3000
@@ -1,7 +1,7 @@
 # Segnapunti
-![Version](https://img.shields.io/badge/versione-2.0.0-blue)
+![Version](https://img.shields.io/badge/versione-2.1.0-blue)
-![Node](https://img.shields.io/badge/node-%3E%3D18-green)
+![Node](https://img.shields.io/badge/node-%3E%3D24-green)
 ![Docker](https://img.shields.io/badge/docker-ready-2496ED?logo=docker&logoColor=white)
 ![License](https://img.shields.io/badge/licenza-privata-lightgrey)
@@ -9,14 +9,29 @@ Segnapunti digitale in tempo reale per partite di pallavolo. Un server centrale
 ---
 ## Requisiti
 | Strumento | Versione minima | Uso |
 |---|---|---|
 | Node.js | >= 24 | Sviluppo locale (`npm run dev`) |
 | npm | >= 11 | Sviluppo locale |
 | Docker + Docker Compose | — | Deploy in produzione; alternativa containerizzata allo sviluppo locale |
 Versione Node pinnata in `.nvmrc` e in `engines` di `package.json`. Con [nvm](https://github.com/nvm-sh/nvm): `nvm use`.
 ---
 ## Indice
 - [Requisiti](#requisiti)
 - [Architettura](#architettura)
 - [Guida utente](#guida-utente)
 - [Funzionalità](#funzionalità)
 - [Deploy con Docker](#deploy-con-docker)
 - [Sviluppo](#sviluppo)
 - [Sviluppo con Docker](#sviluppo-con-docker)
 - [Test](#test)
 - [Changelog](#changelog)
 ---
@@ -165,7 +180,6 @@ La **partita** è vinta da chi raggiunge 3 set su 5 (modalità `3/5`) o 2 set su
 ---
 ## Deploy con Docker
 ### Prima installazione
@@ -186,26 +200,28 @@ docker compose pull && docker compose up -d
 ### Build e pubblicazione immagine
 Il `Dockerfile` è multi-stage (`deps` → `dev` / `builder` → `runtime`); senza specificare `--target`, il build produce l'ultimo stage (`runtime`), l'immagine di produzione:
 ```bash
 docker build \
-  -t santantonio.sytes.net/attilio/segnapunti:2.0.0 \
+  -t santantonio.sytes.net/attilio/segnapunti:2.1.0 \
  -t santantonio.sytes.net/attilio/segnapunti:latest .
-docker push santantonio.sytes.net/attilio/segnapunti:2.0.0
+docker push santantonio.sytes.net/attilio/segnapunti:2.1.0
 docker push santantonio.sytes.net/attilio/segnapunti:latest
 ```
 Per testare in locale l'immagine di produzione senza pubblicarla:
 ```bash
 docker build -t segnapunti:local .
 docker run --rm -p 3000:3000 -v ./.segnapunti:/app/.segnapunti segnapunti:local
 ```
 ---
 ## Sviluppo
 ### Requisiti
 | Strumento | Versione minima |
 |---|---|
 | Node.js | >= 18 |
 | npm | >= 9 |
 ### Avvio
 ```bash
@@ -230,6 +246,29 @@ Lo stato viene salvato in `.segnapunti/state.json` anche in modalità dev.
 ---
 ## Sviluppo con Docker
 In alternativa a Node.js installato in locale, `docker-compose.dev.yml` builda il target `dev` del `Dockerfile` e monta il codice sorgente nel container, con hot reload identico a `npm run dev`:
 ```bash
 docker compose -f docker-compose.dev.yml up --build
 ```
 | URL | Interfaccia |
 |---|---|
 | `http://localhost:5173/display` | Display |
 | `http://localhost:5173/controller` | Controller |
 Le modifiche ai file sorgente sull'host si riflettono subito nel container (bind-mount); `node_modules` resta invece un volume anonimo del container, per non farsi sovrascrivere dal bind-mount e per evitare incompatibilità tra i binari nativi installati sull'host e quelli richiesti dal container (es. host ARM / container `node:24-alpine` su x86).
 Per fermare e rimuovere il container:
 ```bash
 docker compose -f docker-compose.dev.yml down
 ```
 ---
 ## Test
 | Comando | Descrizione |
@@ -242,8 +281,12 @@ Lo stato viene salvato in `.segnapunti/state.json` anche in modalità dev.
 | `npm run test:e2e` | Playwright — Chromium, Firefox, Mobile Chrome |
 Le suite Vitest coprono la logica di gioco (`gameState`, inclusa `formInizio`),
-il protocollo e il routing del server, la persistenza, il client WebSocket
+il protocollo e il routing del server (incluso l'avvio effettivo di
-(`wsMixin`), i componenti Vue e la generazione del referto.
+`startServer`), la persistenza, il rilevamento di rete/piattaforma
 (`server-utils`, inclusi i rami WSL/PowerShell), il client WebSocket
 (`wsMixin`, connessione/riconnessione/cleanup), i componenti Vue e la
 generazione del referto (inclusi i suoi side-effect di stampa). La copertura
 statement complessiva è oltre il 99%.
 > I test E2E richiedono il server in esecuzione (`npm run serve`) e i browser Playwright installati:
 > ```bash
@@ -0,0 +1,13 @@
 services:
  segnapunti:
    build:
      context: .
      target: dev
    container_name: segnapunti-dev
    ports:
      - "5173:5173"
    volumes:
      - .:/app
      - /app/node_modules
    environment:
      - NODE_ENV=development
@@ -1,6 +1,6 @@
 services:
  segnapunti:
-    image: santantonio.sytes.net/attilio/segnapunti:2.0.0
+    image: santantonio.sytes.net/attilio/segnapunti:2.1.0
    container_name: segnapunti
    ports:
      - "3000:3000"
@@ -1,8 +1,11 @@
 {
  "name": "segnapuntianto",
  "private": true,
-  "version": "2.0.0",
+  "version": "2.1.0",
  "type": "module",
  "engines": {
    "node": ">=24.0.0"
  },
  "scripts": {
    "dev": "vite --host",
    "build": "vite build",
@@ -30,12 +33,12 @@
    "@playwright/test": "^1.58.2",
    "@types/node": "^25.2.3",
    "@vitejs/plugin-vue": "^6.0.5",
-    "@vitest/ui": "^4.0.18",
+    "@vitest/ui": "^4.1.10",
    "@vue/test-utils": "^2.4.6",
    "happy-dom": "^20.6.1",
    "jsdom": "^28.0.0",
    "vite": "^7.3.1",
    "vite-plugin-pwa": "^1.2.0",
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.10"
  }
 }
@@ -171,6 +171,13 @@ export function applyAction(state, action) {
        case "startTimeout": {
            const team = action.team
            if (team !== 'home' && team !== 'guest') break
            if (!s.timeout) {
                const setCorrente = s.sp.striscia.at(-1)
                ;(setCorrente.timeouts ??= []).push({
                    team,
                    punteggio: punteggio(s.sp.striscia),
                })
            }
            s.timeout = true
            s.timeoutTeam = team
            s.timeoutVideo = action.video ?? null
@@ -209,6 +216,7 @@ export function applyAction(state, action) {
            const cambi = action.cambi || []
            const form = s.sp.form[team].map((val) => String(val).trim())
            const formAggiornata = [...form]
            const cambiApplicati = []
            let valid = true
            for (const cambio of cambi) {
@@ -223,11 +231,19 @@ export function applyAction(state, action) {
                const idx = formAggiornata.findIndex((val) => String(val).trim() === cout)
                if (idx !== -1) {
                    formAggiornata.splice(idx, 1, cin)
                    cambiApplicati.push({ in: cin, out: cout })
                }
            }
            if (valid) {
                s.sp.form[team] = formAggiornata
                if (cambiApplicati.length > 0) {
                    const setCorrente = s.sp.striscia.at(-1)
                    const puntAttuale = punteggio(s.sp.striscia)
                    ;(setCorrente.cambi ??= []).push(
                        ...cambiApplicati.map(c => ({ team, ...c, punteggio: { ...puntAttuale } }))
                    )
                }
            }
            break
        }
@@ -34,16 +34,41 @@ export function buildRefertoHtml(state, now = new Date()) {
        return `
          <div class="form-row">
            <div class="form-team">
-              <div class="form-team-name">${nomi.home}</div>
+              <div class="form-team-name form-team-name-h">${nomi.home}</div>
              <div class="giocatori">${formazioneSet.home.map(giocatoreHtml).join('')}</div>
            </div>
            <div class="form-team">
-              <div class="form-team-name">${nomi.guest}</div>
+              <div class="form-team-name form-team-name-g">${nomi.guest}</div>
              <div class="giocatori">${formazioneSet.guest.map(giocatoreHtml).join('')}</div>
            </div>
          </div>`
    }
    const nomeTeam = (team) => team === 'home' ? nomi.home : nomi.guest
    const eventiHtml = (s) => {
        const eventi = [
            ...(s.timeouts ?? []).map(t => ({ tipo: 'timeout', ...t })),
            ...(s.cambi ?? []).map(c => ({ tipo: 'cambio', ...c })),
        ].sort((a, b) => (a.punteggio.home + a.punteggio.guest) - (b.punteggio.home + b.punteggio.guest))
        if (eventi.length === 0) return ''
        const righe = eventi.map(e => {
            const sul = `sul ${e.punteggio.home}-${e.punteggio.guest}`
            const testo = e.tipo === 'timeout'
                ? `Time out <strong>${nomeTeam(e.team)}</strong> ${sul}`
                : `Cambio <strong>${nomeTeam(e.team)}</strong>: entra ${e.in} per ${e.out} ${sul}`
            return `<li class="evento evento-${e.tipo}">${testo}</li>`
        }).join('')
        return `
          <div class="eventi-set">
            <div class="eventi-label">Cambi e time out</div>
            <ul class="eventi-lista">${righe}</ul>
          </div>`
    }
    const setsHtml = setReali.map((s, i) => {
        let h = 0, g = 0
        const punti = []
@@ -54,7 +79,11 @@ export function buildRefertoHtml(state, now = new Date()) {
        const vinc = vincitoreSet(s)
        const nomeVinc = vinc === 'h' ? nomi.home : vinc === 'g' ? nomi.guest : ''
-        const etichettaVinc = nomeVinc ? ` &nbsp;·&nbsp; vinto da <strong>${nomeVinc}</strong>` : ''
+        const etichettaVinc = nomeVinc ? `<span class="set-vinc">vinto da <strong>${nomeVinc}</strong></span>` : ''
        const servIcon = '<img src="/serv-nero.png" class="serv-icon" alt="Servizio">'
        const servHomeIcon = s.serv === 'h' ? servIcon : ''
        const servGuestIcon = s.serv === 'g' ? servIcon : ''
        const puntiHtml = punti.map(p =>
            `<span class="punto punto-${p.chi}">${p.h}-${p.g}</span>`
@@ -62,17 +91,32 @@ export function buildRefertoHtml(state, now = new Date()) {
        return `
        <div class="set-section">
          <div class="set-barra"><span>SET</span><span class="set-numero">${i + 1}</span></div>
          <div class="set-corpo">
            <div class="set-header">
-            Set ${i + 1} &nbsp;—&nbsp; ${nomi.home} <strong>${h}</strong> · <strong>${g}</strong> ${nomi.guest}${etichettaVinc}
+              <span>${servHomeIcon}${nomi.home} <strong>${h}</strong> · <strong>${g}</strong> ${nomi.guest}${servGuestIcon}</span>
              ${etichettaVinc}
            </div>
            <div class="form-inizio">
              <div class="form-inizio-label">Formazione di partenza</div>
              ${formazioneHtml(s.formInizio)}
-          </div>
+            </div>${eventiHtml(s)}
            <div class="punti-grid">${puntiHtml || '<em style="color:#999;font-size:11px">Nessun punto registrato</em>'}</div>
          </div>
        </div>`
    }).join('')
    const risultatoSetHtml = setReali.map((s, i) => {
        let h = 0, g = 0
        for (const c of s.ris) c === 'h' ? h++ : g++
        const vinc = vincitoreSet(s)
        return `<tr>
          <td class="ris-set-n">${i + 1}</td>
          <td class="ris-set-p ${vinc === 'h' ? 'ris-vinc' : ''}">${h}</td>
          <td class="ris-set-p ${vinc === 'g' ? 'ris-vinc' : ''}">${g}</td>
        </tr>`
    }).join('')
    const html = `<!DOCTYPE html>
 <html lang="it">
 <head>
@@ -80,50 +124,89 @@ export function buildRefertoHtml(state, now = new Date()) {
  <title>Referto — ${nomi.home} vs ${nomi.guest}</title>
  <style>
    * { box-sizing: border-box; margin: 0; padding: 0; }
-    body { font-family: Arial, Helvetica, sans-serif; color: #111; background: #fff; padding: 28px; font-size: 14px; }
+    :root { --teal: #23b8dc; --teal-dark: #0f8faf; }
-    @media print { body { padding: 12px; } }
+    body { font-family: Arial, Helvetica, sans-serif; color: #111; background: #fff; padding: 20px; font-size: 14px; }
    @media print { body { padding: 8px; } }
-    .header { text-align: center; border-bottom: 2px solid #111; padding-bottom: 12px; margin-bottom: 20px; }
+    .foglio { border: 3px solid #111; padding: 14px; }
    .titolo { font-size: 18px; font-weight: bold; letter-spacing: 3px; text-transform: uppercase; }
    .meta { font-size: 12px; color: #666; margin-top: 5px; }
-    .squadre-row { display: flex; justify-content: space-around; align-items: center; margin: 18px 0 6px; }
+    .header { display: flex; align-items: center; justify-content: space-between; gap: 16px; border: 2px solid #111; padding: 10px 16px; margin-bottom: 14px; }
-    .nome-sq { font-size: 22px; font-weight: bold; text-align: center; max-width: 40%; }
+    .titolo { font-size: 15px; font-weight: bold; letter-spacing: 2px; text-transform: uppercase; }
-    .vs { font-size: 16px; color: #999; }
+    .meta { font-size: 11px; color: #333; margin-top: 3px; text-transform: uppercase; letter-spacing: 0.5px; }
    .risultato { text-align: center; font-size: 36px; font-weight: bold; letter-spacing: 6px; margin-bottom: 4px; }
    .modalita-label { text-align: center; font-size: 12px; color: #888; margin-bottom: 22px; }
-    .set-section { margin-bottom: 12px; border: 1px solid #ddd; border-radius: 4px; overflow: hidden; }
+    .squadre-row { display: flex; align-items: center; gap: 14px; }
-    .set-header { background: #f5f5f5; padding: 7px 12px; font-size: 13px; border-bottom: 1px solid #ddd; }
+    .badge-ab { display: inline-flex; align-items: center; justify-content: center; height: 22px; padding: 0 8px; border-radius: 11px; border: 2px solid #111; font-weight: bold; font-size: 12px; flex-shrink: 0; }
-    .punti-grid { display: flex; flex-wrap: wrap; gap: 3px; padding: 8px 10px; }
+    .nome-sq { font-size: 18px; font-weight: bold; }
-    .punto { display: inline-block; padding: 2px 5px; border-radius: 3px; font-size: 11px; font-family: 'Courier New', monospace; white-space: nowrap; }
+    .vs { font-size: 12px; color: #666; font-weight: bold; }
    .punto-h { background: #d0e8ff; color: #003a6e; }
    .punto-g { background: #ffddc0; color: #6e2700; }
-    .form-inizio { padding: 8px 10px; border-bottom: 1px solid #eee; background: #fafafa; }
+    .set-section { display: flex; margin-bottom: 10px; border: 2px solid #111; }
-    .form-inizio-label { font-size: 11px; font-weight: bold; letter-spacing: 0.5px; text-transform: uppercase; color: #888; margin-bottom: 7px; }
+    .set-barra { flex: 0 0 26px; background: var(--teal); color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; border-right: 2px solid #111; }
    .set-barra span:first-child { writing-mode: vertical-rl; transform: rotate(180deg); font-weight: bold; font-size: 11px; letter-spacing: 2px; }
    .set-numero { font-weight: bold; font-size: 15px; }
    .set-corpo { flex: 1; min-width: 0; }
    .set-header { background: #eaf7fb; padding: 6px 12px; font-size: 13px; border-bottom: 1px solid #111; display: flex; justify-content: space-between; align-items: center; gap: 10px; }
    .set-vinc { flex-shrink: 0; }
    .serv-icon { width: 12px; height: 12px; vertical-align: middle; margin: 0 3px; }
    .punti-grid { display: flex; flex-wrap: wrap; gap: 0; padding: 0; border-top: 1px solid #111; }
    .punto { display: inline-flex; align-items: center; justify-content: center; min-width: 34px; padding: 3px 4px; font-size: 11px; font-family: 'Courier New', monospace; white-space: nowrap; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; }
    .punto-h { background: #f5c518; color: #111; }
    .punto-g { background: #2196f3; color: #fff; }
    .eventi-set { padding: 6px 12px; border-bottom: 1px solid #111; }
    .eventi-label { font-size: 10px; font-weight: bold; letter-spacing: 0.5px; text-transform: uppercase; color: #0f8faf; margin-bottom: 4px; }
    .eventi-lista { list-style: none; }
    .evento { font-size: 12px; padding: 1px 0; }
    .form-inizio { padding: 6px 12px; border-bottom: 1px solid #111; background: #fafafa; }
    .form-inizio-label { font-size: 10px; font-weight: bold; letter-spacing: 0.5px; text-transform: uppercase; color: #0f8faf; margin-bottom: 6px; }
    .form-row { display: flex; gap: 40px; }
    .form-team { flex: 1; }
-    .form-team-name { font-weight: bold; font-size: 13px; margin-bottom: 6px; }
+    .form-team-name { font-weight: bold; font-size: 12px; margin-bottom: 5px; }
    .form-team-name-h { color: #f5c518; }
    .form-team-name-g { color: #2196f3; }
    .giocatori { display: flex; gap: 5px; flex-wrap: wrap; }
-    .giocatore { background: #f0f0f0; border-radius: 50%; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; font-weight: bold; font-size: 12px; border: 1px solid #ccc; }
+    .giocatore { background: #fff; border-radius: 50%; width: 26px; height: 26px; display: flex; align-items: center; justify-content: center; font-weight: bold; font-size: 11px; border: 2px solid #111; }
    .finale { display: flex; gap: 14px; align-items: flex-start; margin-top: 4px; }
    .finale-box { border: 2px solid #111; flex: 0 0 220px; }
    .finale-box-header { background: var(--teal); color: #fff; text-align: center; font-weight: bold; font-size: 12px; letter-spacing: 1px; text-transform: uppercase; padding: 5px; }
    .finale-tabella { width: 100%; border-collapse: collapse; font-size: 12px; }
    .finale-tabella th, .finale-tabella td { border: 1px solid #111; padding: 4px 8px; text-align: center; }
    .finale-tabella th { background: #eaf7fb; font-size: 10px; text-transform: uppercase; }
    .ris-vinc { font-weight: bold; background: #d0e8ff; }
    .finale-vince { padding: 8px; text-align: center; font-size: 14px; font-weight: bold; border-top: 2px solid #111; }
  </style>
 </head>
 <body>
  <div class="foglio">
    <div class="header">
      <div>
        <div class="titolo">Referto di Gara</div>
        <div class="meta">${dataOra} &nbsp;·&nbsp; Modalità: ${modalitaPartita}</div>
      </div>
      <div class="squadre-row">
-    <div class="nome-sq">${nomi.home}</div>
+        <span class="badge-ab">Casa</span>
-    <div class="vs">vs</div>
+        <span class="nome-sq">${nomi.home}</span>
-    <div class="nome-sq">${nomi.guest}</div>
+        <span class="vs">vs</span>
        <span class="nome-sq">${nomi.guest}</span>
        <span class="badge-ab">Ospiti</span>
      </div>
    </div>
  <div class="risultato">${setVinti.home} – ${setVinti.guest}</div>
  <div class="modalita-label">set vinti</div>
    ${setsHtml}
    <div class="finale">
      <div class="finale-box">
        <div class="finale-box-header">Risultato finale</div>
        <table class="finale-tabella">
          <thead><tr><th>Set</th><th>${nomi.home}</th><th>${nomi.guest}</th></tr></thead>
          <tbody>${risultatoSetHtml}</tbody>
        </table>
        <div class="finale-vince">Vince ${setVinti.home >= setVinti.guest ? nomi.home : nomi.guest} &nbsp;${setVinti.home} – ${setVinti.guest}</div>
      </div>
    </div>
  </div>
 </body>
 </html>`
@@ -137,5 +220,7 @@ export function generaReferto(state) {
    const w = window.open('', '_blank')
    w.document.write(html)
    w.document.close()
-    w.print()
+    // Aspetta il caricamento delle immagini (icona servizio) prima di stampare,
    // altrimenti la stampa parte con risorse ancora in caricamento e appaiono vuote.
    w.addEventListener('load', () => w.print())
 }
@@ -94,7 +94,9 @@ Esempi reali nel progetto:
 - time out (`startTimeout`/`stopTimeout`: squadra, video, timestamp)
 - generazione del referto (`buildRefertoHtml`)
 - persistenza stato su disco (`persist.js`, con `fs` mockato)
- utility di rete (`server-utils.js`)
+- utility di rete (`server-utils.js`), incluso il rilevamento piattaforma
  (WSL/PowerShell vs. `os.networkInterfaces()`, con `fs`/`child_process`/`os`
  mockati per non dipendere dalla macchina che esegue i test)
 - elenco video spot (`spot-utils.js`, su cartella temporanea reale)
 Quando falliscono:
@@ -119,6 +121,8 @@ Esempi reali nel progetto:
 - autorizzazioni (solo controller puo inviare certe azioni)
 - timer server-side del time out (auto-`stopTimeout` dopo 30s, `startedAt` impostato dal server)
 - routing del server Express (`createApp`: rotte display/controller/asset, `/spot/list` e file statici `/spot/`)
 - rami di errore del WebSocket handler (`ws.send`/`ws.terminate` che lanciano, `applyAction` che fallisce a metà azione: lo stato precedente va ripristinato senza propagare l'eccezione)
 - avvio effettivo di `startServer` (`server.js`): ascolto HTTP, upgrade su `/ws`, rifiuto su altri percorsi, persistenza dopo un'azione — con `persist.js` mockato per non toccare mai `.segnapunti/state.json` reale
 Quando falliscono:
 - spesso c'e problema nel protocollo messaggi o nei controlli di ruolo
@@ -138,8 +142,9 @@ Esempi reali nel progetto:
 - dialog reset/config/cambi
 - modal time out del controller (scelta squadra/video, banner, countdown)
 - overlay time out del display (video, placeholder, countdown, dissolvenza)
- bottone REFERTO nel dialog PARTITA FINITA
+- bottone REFERTO nel dialog PARTITA FINITA e generazione del referto stampabile (`generaReferto`: `window.open`, scrittura HTML, stampa)
- client WebSocket (`wsMixin`: connessione, riconnessione, `sendWs`, errori)
+- client WebSocket (`wsMixin`: connessione, riconnessione con backoff, cleanup allo smontaggio, `sendWs`, errori)
 - layout esteso/landscape del controller (pannelli squadra, popup automatico SET VINTO con soglia decisiva)
 Quando falliscono:
 - spesso hai rotto template, computed, metodi o binding
@@ -190,8 +195,8 @@ Note importanti:
 Caso OK (verde):
 ```text
-Test Files  10 passed (10)
+Test Files  15 passed (15)
-Tests      212 passed (212)
+Tests      362 passed (362)
 ```
 Significa:
@@ -208,7 +213,7 @@ Caso KO (rosso):
 Caso OK:
 ```text
-75 passed
+81 passed
 ```
 Caso KO:
@@ -279,7 +284,23 @@ npm run test:e2e -- --update-snapshots
 npm run test:e2e
 ```
-## 10) Come aggiungere un nuovo test (consigli pratici)
+## 10) Copertura del codice
 Non c'è uno script `npm` dedicato, ma si può controllare la copertura in
 qualsiasi momento con:
 ```bash
 npx vitest run tests/unit tests/integration tests/component --coverage
 ```
 Il report a schermo mostra percentuale e righe scoperte per file. La suite
 attuale copre oltre il 99% di statement/linee; le poche righe rimaste
 scoperte sono documentate nei commit dei rispettivi test come codice morto,
 difensivo, oppure legato a HMR (`import.meta.hot`) o all'avvio diretto
 (`node server.js`) — casi non testabili in modo significativo senza side
 effect reali sull'ambiente.
 ## 11) Come aggiungere un nuovo test (consigli pratici)
 - metti i test nel posto giusto:
  - `tests/unit` per logica pura
@@ -133,6 +133,14 @@ describe('ControllerPage.vue', () => {
            const btn = wrapper.findAll('.btn-ctrl').find(b => b.text().includes('Cambio Palla'))
            expect(btn.attributes('disabled')).toBeDefined()
        })
        it('il click quando abilitato invia cambiaPalla', async () => {
            const wrapper = mountController()
            const spy = vi.spyOn(wrapper.vm, 'sendAction')
            const btn = wrapper.findAll('.btn-ctrl').find(b => b.text().includes('Cambio Palla'))
            await btn.trigger('click')
            expect(spy).toHaveBeenCalledWith({ type: 'cambiaPalla' })
        })
    })
    // =============================================
@@ -349,6 +357,25 @@ describe('ControllerPage.vue', () => {
            expect(spy).toHaveBeenCalledWith({ type: 'stopTimeout' })
        })
        it('avviaTimeout non invia nulla se nessuna squadra è selezionata', () => {
            const wrapper = mountController()
            wrapper.vm.timeoutTeamSel = null
            const spy = vi.spyOn(wrapper.vm, 'sendAction')
            wrapper.vm.avviaTimeout()
            expect(spy).not.toHaveBeenCalled()
        })
        it('il ticker del time out aggiorna nowTick periodicamente', async () => {
            const wrapper = mountController()
            wrapper.vm.state.timeoutTeam = 'home'
            wrapper.vm.state.timeoutStartedAt = Date.now()
            wrapper.vm.state.timeout = true
            await wrapper.vm.$nextTick()
            const before = wrapper.vm.nowTick
            vi.advanceTimersByTime(500)
            expect(wrapper.vm.nowTick).toBeGreaterThan(before)
        })
        it('durante il time out mostra banner con squadra e countdown', async () => {
            const wrapper = mountController()
            wrapper.vm.state.timeoutTeam = 'home'
@@ -365,6 +392,587 @@ describe('ControllerPage.vue', () => {
        })
    })
    // =============================================
    // MODALITÀ ESTESA (landscape)
    // =============================================
    describe('Modalità estesa', () => {
        it('con isLandscape=true mostra il layout esteso con i pannelli squadra', async () => {
            const wrapper = mountController()
            wrapper.vm.isLandscape = true
            await wrapper.vm.$nextTick()
            expect(wrapper.find('.e-dash').exists()).toBe(true)
            expect(wrapper.findAll('.e-panel')).toHaveLength(2)
            // in modalità estesa non compare il layout mobile
            expect(wrapper.find('.score-preview').exists()).toBe(false)
        })
        it('il resize della finestra aggiorna isLandscape', async () => {
            const wrapper = mountController()
            expect(wrapper.vm.isLandscape).toBe(false)
            Object.defineProperty(window, 'innerWidth', { value: 800, writable: true, configurable: true })
            Object.defineProperty(window, 'innerHeight', { value: 400, writable: true, configurable: true })
            window.dispatchEvent(new Event('resize'))
            await wrapper.vm.$nextTick()
            expect(wrapper.vm.isLandscape).toBe(true)
            // ripristina le dimensioni portrait usate dagli altri test
            Object.defineProperty(window, 'innerWidth', { value: 400, writable: true, configurable: true })
            Object.defineProperty(window, 'innerHeight', { value: 800, writable: true, configurable: true })
        })
        it('il click sul punteggio in modalità estesa invia incPunt', async () => {
            const wrapper = mountController()
            wrapper.vm.isLandscape = true
            await wrapper.vm.$nextTick()
            const spy = vi.spyOn(wrapper.vm, 'sendAction')
            await wrapper.findAll('.e-panel__score')[0].trigger('click')
            expect(spy).toHaveBeenCalledWith({ type: 'incPunt', team: 'home' })
        })
        it('smontare il componente rimuove i listener di resize e ferma il ticker del time out', async () => {
            const wrapper = mountController()
            wrapper.vm.state.timeout = true
            await wrapper.vm.$nextTick()
            expect(vi.getTimerCount()).toBeGreaterThan(0)
            const removeSpy = vi.spyOn(window, 'removeEventListener')
            wrapper.unmount()
            expect(removeSpy).toHaveBeenCalledWith('resize', expect.any(Function))
            expect(removeSpy).toHaveBeenCalledWith('orientationchange', expect.any(Function))
        })
    })
    // =============================================
    // SET VINTO AUTOMATICO (watch squadraVincente)
    // =============================================
    describe('Set vinto automatico', () => {
        it('apre la modal SET VINTO quando il punteggio raggiunge la soglia', async () => {
            const wrapper = mountController()
            setScore(wrapper, 25, 10)
            await wrapper.vm.$nextTick()
            expect(wrapper.vm.showSetVinto).toBe(true)
            expect(wrapper.vm.setVintoTeam).toBe('home')
            expect(wrapper.find('.dialog-title').text()).toBe('SET VINTO')
        })
        it('non riapre la modal se è già aperta', async () => {
            const wrapper = mountController()
            setScore(wrapper, 25, 10)
            await wrapper.vm.$nextTick()
            wrapper.vm.setVintoTeam = 'guest'
            setScore(wrapper, 25, 24)
            await wrapper.vm.$nextTick()
            // il watch non deve sovrascrivere setVintoTeam perché showSetVinto è già true
            expect(wrapper.vm.setVintoTeam).toBe('guest')
        })
        it('INDIETRO annulla l\'ultimo punto e chiude la modal', async () => {
            const wrapper = mountController()
            setScore(wrapper, 25, 10)
            await wrapper.vm.$nextTick()
            const spy = vi.spyOn(wrapper.vm, 'sendAction')
            await wrapper.find('.btn-cancel').trigger('click')
            expect(spy).toHaveBeenCalledWith({ type: 'decPunt' })
            expect(wrapper.vm.showSetVinto).toBe(false)
        })
        it('VAI AL SET SUCCESSIVO invia nuovoSet e apre la configurazione', async () => {
            const wrapper = mountController()
            setScore(wrapper, 25, 10)
            await wrapper.vm.$nextTick()
            const spy = vi.spyOn(wrapper.vm, 'sendAction')
            const btn = wrapper.findAll('.btn-confirm').find(b => b.text().includes('SET SUCCESSIVO'))
            await btn.trigger('click')
            expect(spy).toHaveBeenCalledWith({ type: 'nuovoSet', team: 'home' })
            expect(wrapper.vm.showSetVinto).toBe(false)
            expect(wrapper.vm.showConfig).toBe(true)
        })
    })
    // =============================================
    // CONFIGURAZIONE
    // =============================================
    describe('Configurazione', () => {
        it('apre la modal di configurazione precompilata con lo stato corrente', async () => {
            const wrapper = mountController()
            await wrapper.find('.btn-ctrl:not(.btn-timeout)').exists()
            const btn = wrapper.findAll('.btn-ctrl').find(b => b.text() === 'Config')
            await btn.trigger('click')
            expect(wrapper.vm.showConfig).toBe(true)
            expect(wrapper.vm.configData.nomeHome).toBe('Antoniana')
            expect(wrapper.vm.configData.nomeGuest).toBe('Guest')
            expect(wrapper.vm.configData.modalita).toBe('3/5')
        })
        it('OK invia le action di configurazione e chiude la modal', async () => {
            const wrapper = mountController()
            wrapper.vm.showConfig = true
            wrapper.vm.configData = {
                nomeHome: 'Casa', nomeGuest: 'Ospiti', modalita: '2/3',
                formHome: ['1', '2', '3', '4', '5', '6'],
                formGuest: ['1', '2', '3', '4', '5', '6'],
            }
            await wrapper.vm.$nextTick()
            const spy = vi.spyOn(wrapper.vm, 'sendAction')
            await wrapper.find('.dialog-config .btn-confirm').trigger('click')
            expect(spy).toHaveBeenCalledWith({ type: 'setNomi', home: 'Casa', guest: 'Ospiti' })
            expect(spy).toHaveBeenCalledWith({ type: 'setModalita', modalita: '2/3' })
            expect(spy).toHaveBeenCalledWith({ type: 'setFormazione', team: 'home', form: ['1', '2', '3', '4', '5', '6'] })
            expect(spy).toHaveBeenCalledWith({ type: 'setFormazione', team: 'guest', form: ['1', '2', '3', '4', '5', '6'] })
            expect(wrapper.vm.showConfig).toBe(false)
        })
        it('Annulla chiude la modal di configurazione senza inviare nulla', async () => {
            const wrapper = mountController()
            wrapper.vm.showConfig = true
            await wrapper.vm.$nextTick()
            const spy = vi.spyOn(wrapper.vm, 'sendAction')
            await wrapper.find('.dialog-config .btn-cancel').trigger('click')
            expect(spy).not.toHaveBeenCalled()
            expect(wrapper.vm.showConfig).toBe(false)
        })
        it('scegliendo la modalità 2/3 il bottone diventa attivo', async () => {
            const wrapper = mountController()
            wrapper.vm.showConfig = true
            await wrapper.vm.$nextTick()
            const btn23 = wrapper.findAll('.btn-mode').find(b => b.text() === '2/3')
            await btn23.trigger('click')
            expect(wrapper.vm.configData.modalita).toBe('2/3')
            expect(btn23.classes()).toContain('active')
        })
    })
    // =============================================
    // GESTIONE CAMBI GIOCATORE
    // =============================================
    describe('Gestione cambi', () => {
        it('il click su Cambi apre la selezione squadra, poi la modal cambio per la squadra scelta', async () => {
            const wrapper = mountController()
            const btnCambi = wrapper.findAll('.btn-ctrl').find(b => b.text() === 'Cambi')
            await btnCambi.trigger('click')
            expect(wrapper.vm.showCambiTeam).toBe(true)
            await wrapper.find('.dialog-title').exists()
            const btnHome = wrapper.find('.overlay .btn-set.home-bg')
            await btnHome.trigger('click')
            expect(wrapper.vm.showCambiTeam).toBe(false)
            expect(wrapper.vm.showCambi).toBe(true)
            expect(wrapper.vm.cambiTeam).toBe('home')
        })
        it('Annulla chiude la modal cambi e azzera i campi', async () => {
            const wrapper = mountController()
            wrapper.vm.openCambi('home')
            wrapper.vm.cambiData = [{ in: '10', out: '1' }, { in: '', out: '' }]
            await wrapper.vm.$nextTick()
            await wrapper.find('.dialog .btn-cancel').trigger('click')
            expect(wrapper.vm.showCambi).toBe(false)
            expect(wrapper.vm.cambiData).toEqual([{ in: '', out: '' }, { in: '', out: '' }])
        })
        it('CONFERMA con un cambio valido invia confermaCambi e chiude la modal', async () => {
            const wrapper = mountController()
            wrapper.vm.openCambi('home')
            wrapper.vm.cambiData = [{ in: '10', out: '1' }, { in: '', out: '' }]
            await wrapper.vm.$nextTick()
            const spy = vi.spyOn(wrapper.vm, 'sendAction')
            await wrapper.find('.dialog .btn-confirm').trigger('click')
            expect(spy).toHaveBeenCalledWith({ type: 'confermaCambi', team: 'home', cambi: [{ in: '10', out: '1' }] })
            expect(wrapper.vm.showCambi).toBe(false)
        })
        it('segnala errore se il numero del giocatore non è formato da sole cifre', async () => {
            const wrapper = mountController()
            wrapper.vm.openCambi('home')
            wrapper.vm.cambiData = [{ in: 'ab', out: '1' }, { in: '', out: '' }]
            wrapper.vm.confermaCambi()
            expect(wrapper.vm.cambiError).toBe('I numeri dei giocatori devono essere cifre')
        })
        it('segnala errore se il giocatore entrante coincide con l\'uscente', async () => {
            const wrapper = mountController()
            wrapper.vm.openCambi('home')
            wrapper.vm.cambiData = [{ in: '1', out: '1' }, { in: '', out: '' }]
            wrapper.vm.confermaCambi()
            expect(wrapper.vm.cambiError).toBe('Il giocatore 1 non può sostituire sé stesso')
        })
        it('segnala errore se il giocatore entrante è già in formazione', async () => {
            const wrapper = mountController()
            wrapper.vm.openCambi('home')
            // "2" è già presente nella formazione di default ["1".."6"]
            wrapper.vm.cambiData = [{ in: '2', out: '1' }, { in: '', out: '' }]
            wrapper.vm.confermaCambi()
            expect(wrapper.vm.cambiError).toBe('Il giocatore 2 è già in formazione')
        })
        it('segnala errore se il giocatore uscente non è in formazione', async () => {
            const wrapper = mountController()
            wrapper.vm.openCambi('home')
            wrapper.vm.cambiData = [{ in: '10', out: '9' }, { in: '', out: '' }]
            wrapper.vm.confermaCambi()
            expect(wrapper.vm.cambiError).toBe('Il giocatore 9 non è in formazione')
        })
        it('confermaCambi non fa nulla se cambiValid è false', () => {
            const wrapper = mountController()
            wrapper.vm.openCambi('home')
            const spy = vi.spyOn(wrapper.vm, 'sendAction')
            wrapper.vm.cambiData = [{ in: '', out: '' }, { in: '', out: '' }]
            wrapper.vm.confermaCambi()
            expect(spy).not.toHaveBeenCalled()
        })
    })
    // =============================================
    // GESTIONE ERRORI WEBSOCKET
    // =============================================
    describe('Gestione errori WebSocket', () => {
        it('onWsMessage con type error logga il messaggio', () => {
            const wrapper = mountController()
            const spy = vi.spyOn(console, 'error').mockImplementation(() => {})
            wrapper.vm.onWsMessage({ type: 'error', message: 'boom' })
            expect(spy).toHaveBeenCalledWith('[Controller] Error:', 'boom')
            spy.mockRestore()
        })
        it('sendAction senza type non invia nulla', () => {
            const wrapper = mountController()
            const spy = vi.spyOn(wrapper.vm, 'sendWs')
            wrapper.vm.sendAction({})
            expect(spy).not.toHaveBeenCalled()
        })
        it('sendAction mostra un feedback di errore se non connesso', () => {
            const wrapper = mountController()
            const errSpy = vi.spyOn(console, 'error').mockImplementation(() => {})
            wrapper.vm.wsConnected = false
            wrapper.vm.sendAction({ type: 'incPunt', team: 'home' })
            expect(errSpy).toHaveBeenCalledWith('[Controller] Error:', 'Non connesso al server')
            errSpy.mockRestore()
        })
    })
    // =============================================
    // DURATA VIDEO SPOT
    // =============================================
    describe('Durata video spot', () => {
        it('formatDurata mostra i secondi arrotondati o un placeholder', () => {
            const wrapper = mountController()
            expect(wrapper.vm.formatDurata(12.4)).toBe('12s')
            expect(wrapper.vm.formatDurata(undefined)).toBe('…')
            expect(wrapper.vm.formatDurata(NaN)).toBe('…')
        })
        it('probeDurata popola spotDurations quando i metadata del video sono pronti', () => {
            const wrapper = mountController()
            const videoEls = []
            const originalCreateElement = document.createElement.bind(document)
            vi.spyOn(document, 'createElement').mockImplementation((tag) => {
                const el = originalCreateElement(tag)
                if (tag === 'video') videoEls.push(el)
                return el
            })
            wrapper.vm.probeDurata('a.mp4')
            const videoEl = videoEls[0]
            Object.defineProperty(videoEl, 'duration', { value: 42, configurable: true })
            videoEl.onloadedmetadata()
            expect(wrapper.vm.spotDurations['a.mp4']).toBe(42)
            document.createElement.mockRestore()
        })
    })
    // =============================================
    // PULSANTI MOBILE (click reali sui bottoni)
    // =============================================
    describe('Pulsanti layout mobile', () => {
        it('ANNULLA PUNTO invia decPunt', async () => {
            const wrapper = mountController()
            const spy = vi.spyOn(wrapper.vm, 'sendAction')
            await wrapper.find('.btn-undo').trigger('click')
            expect(spy).toHaveBeenCalledWith({ type: 'decPunt' })
        })
        it('i due bottoni SET inviano incSet per la rispettiva squadra', async () => {
            const wrapper = mountController()
            const spy = vi.spyOn(wrapper.vm, 'sendAction')
            const setBtns = wrapper.findAll('.action-row .btn-set')
            await setBtns[0].trigger('click')
            expect(spy).toHaveBeenCalledWith({ type: 'incSet', team: 'home' })
            await setBtns[1].trigger('click')
            expect(spy).toHaveBeenCalledWith({ type: 'incSet', team: 'guest' })
        })
        it('Formazioni/Striscia/Inverti/Voce inviano le rispettive action', async () => {
            const wrapper = mountController()
            const spy = vi.spyOn(wrapper.vm, 'sendAction')
            const byLabel = (label) => wrapper.findAll('.btn-ctrl').find(b => b.text().includes(label))
            await byLabel('Formazioni').trigger('click')
            expect(spy).toHaveBeenCalledWith({ type: 'toggleFormazione' })
            await byLabel('Striscia').trigger('click')
            expect(spy).toHaveBeenCalledWith({ type: 'toggleStriscia' })
            await byLabel('Inverti').trigger('click')
            expect(spy).toHaveBeenCalledWith({ type: 'toggleOrder' })
            const wsSendSpy = vi.spyOn(wrapper.vm, 'sendWs')
            wrapper.vm.wsConnected = true
            wrapper.vm.ws = { readyState: 1, send: vi.fn() }
            await byLabel('Voce').trigger('click')
            expect(wsSendSpy).toHaveBeenCalled()
        })
        it('con order=false lo score-preview mostra prima guest e poi home', async () => {
            const wrapper = mountController()
            wrapper.vm.state.order = false
            await wrapper.vm.$nextTick()
            const spy = vi.spyOn(wrapper.vm, 'sendAction')
            const scores = wrapper.findAll('.team-score')
            expect(scores[0].classes()).toContain('guest-bg')
            expect(scores[1].classes()).toContain('home-bg')
            await scores[0].trigger('click')
            expect(spy).toHaveBeenCalledWith({ type: 'incPunt', team: 'guest' })
        })
    })
    // =============================================
    // MODALITÀ ESTESA: interazioni aggiuntive
    // =============================================
    describe('Modalità estesa: interazioni', () => {
        it('il click sul punteggio e sul bottone SET della seconda squadra funzionano', async () => {
            const wrapper = mountController()
            wrapper.vm.isLandscape = true
            await wrapper.vm.$nextTick()
            const spy = vi.spyOn(wrapper.vm, 'sendAction')
            await wrapper.findAll('.e-panel__score')[1].trigger('click')
            expect(spy).toHaveBeenCalledWith({ type: 'incPunt', team: 'guest' })
            await wrapper.findAll('.e-panel__setbtn')[0].trigger('click')
            expect(spy).toHaveBeenCalledWith({ type: 'incSet', team: 'home' })
            await wrapper.findAll('.e-panel__setbtn')[1].trigger('click')
            expect(spy).toHaveBeenCalledWith({ type: 'incSet', team: 'guest' })
        })
        it('la barra e-actions invia le action corrispondenti ai bottoni', async () => {
            const wrapper = mountController()
            wrapper.vm.isLandscape = true
            await wrapper.vm.$nextTick()
            const spy = vi.spyOn(wrapper.vm, 'sendAction')
            const byLabel = (label) => wrapper.findAll('.e-act').find(b => b.text().includes(label))
            await byLabel('Annulla').trigger('click')
            expect(spy).toHaveBeenCalledWith({ type: 'decPunt' })
            await byLabel('Cambio Palla').trigger('click')
            expect(spy).toHaveBeenCalledWith({ type: 'cambiaPalla' })
            await byLabel('Inverti').trigger('click')
            expect(spy).toHaveBeenCalledWith({ type: 'toggleOrder' })
            await byLabel('Striscia').trigger('click')
            expect(spy).toHaveBeenCalledWith({ type: 'toggleStriscia' })
            expect(wrapper.vm.showCambiTeam).toBe(false)
            const btnCambi = wrapper.findAll('.e-act').find(b => b.text() === 'Cambi')
            await btnCambi.trigger('click')
            expect(wrapper.vm.showCambiTeam).toBe(true)
            wrapper.vm.showCambiTeam = false
            await byLabel('Config').trigger('click')
            expect(wrapper.vm.showConfig).toBe(true)
            wrapper.vm.showConfig = false
            await wrapper.find('.e-act--danger').trigger('click')
            expect(wrapper.vm.confirmReset).toBe(true)
        })
        it('il bottone Voce e il bottone Time Out della barra estesa funzionano', async () => {
            const wrapper = mountController()
            wrapper.vm.isLandscape = true
            await wrapper.vm.$nextTick()
            wrapper.vm.wsConnected = true
            wrapper.vm.ws = { readyState: 1, send: vi.fn() }
            const wsSendSpy = vi.spyOn(wrapper.vm, 'sendWs')
            const btnVoce = wrapper.findAll('.e-act').find(b => b.text() === 'Voce')
            await btnVoce.trigger('click')
            expect(wsSendSpy).toHaveBeenCalled()
            const btnTimeout = wrapper.find('.e-act.btn-timeout')
            await btnTimeout.trigger('click')
            expect(wrapper.vm.showTimeoutModal).toBe(true)
            wrapper.vm.showTimeoutModal = false
            wrapper.vm.state.timeout = true
            await wrapper.vm.$nextTick()
            const spy = vi.spyOn(wrapper.vm, 'sendAction')
            await btnTimeout.trigger('click')
            expect(spy).toHaveBeenCalledWith({ type: 'stopTimeout' })
        })
    })
    // =============================================
    // CHIUSURA DIALOG CLICCANDO FUORI (overlay self)
    // =============================================
    describe('Chiusura dialog cliccando fuori', () => {
        it('conferma reset si chiude cliccando fuori dal dialog', async () => {
            const wrapper = mountController()
            wrapper.vm.confirmReset = true
            await wrapper.vm.$nextTick()
            await wrapper.find('.overlay').trigger('click')
            expect(wrapper.vm.confirmReset).toBe(false)
        })
        it('configurazione si chiude cliccando fuori dal dialog', async () => {
            const wrapper = mountController()
            wrapper.vm.showConfig = true
            await wrapper.vm.$nextTick()
            await wrapper.find('.overlay').trigger('click')
            expect(wrapper.vm.showConfig).toBe(false)
        })
        it('scelta squadra cambi si chiude cliccando fuori dal dialog', async () => {
            const wrapper = mountController()
            wrapper.vm.showCambiTeam = true
            await wrapper.vm.$nextTick()
            await wrapper.find('.overlay').trigger('click')
            expect(wrapper.vm.showCambiTeam).toBe(false)
        })
        it('la modal cambi si chiude cliccando fuori dal dialog', async () => {
            const wrapper = mountController()
            wrapper.vm.openCambi('home')
            await wrapper.vm.$nextTick()
            await wrapper.find('.overlay').trigger('click')
            expect(wrapper.vm.showCambi).toBe(false)
        })
        it('la modal time out si chiude cliccando fuori dal dialog', async () => {
            const wrapper = mountController()
            await wrapper.find('.btn-timeout').trigger('click')
            await flushPromises()
            await wrapper.find('.overlay').trigger('click')
            expect(wrapper.vm.showTimeoutModal).toBe(false)
        })
    })
    // =============================================
    // DIALOG PARTITA FINITA / CONFIGURAZIONE: dettagli
    // =============================================
    describe('Dettagli dialog', () => {
        it('CHIUDI chiude il dialog partita finita senza inviare action', async () => {
            const wrapper = mountController()
            wrapper.vm.state.modalitaPartita = '2/3'
            wrapper.vm.state.sp.striscia = [
                { serv: 'h', ris: '', vinc: 'h' },
                { serv: 'h', ris: '', vinc: null },
            ]
            wrapper.vm.setVintoTeam = 'home'
            wrapper.vm.showSetVinto = true
            await wrapper.vm.$nextTick()
            const spy = vi.spyOn(wrapper.vm, 'sendAction')
            const chiudi = wrapper.findAll('.btn-confirm').find(b => b.text() === 'CHIUDI')
            await chiudi.trigger('click')
            expect(spy).not.toHaveBeenCalled()
            expect(wrapper.vm.showSetVinto).toBe(false)
        })
        it('isPartitaFinita è false in modalità amichevole anche a set vinto', () => {
            const wrapper = mountController()
            wrapper.vm.state.modalitaPartita = 'amichevole'
            wrapper.vm.setVintoTeam = 'home'
            expect(wrapper.vm.isPartitaFinita).toBe(false)
        })
        it('la vittoria della squadra guest apre comunque la modal SET VINTO', async () => {
            const wrapper = mountController()
            setScore(wrapper, 10, 25, 'g')
            await wrapper.vm.$nextTick()
            expect(wrapper.vm.setVintoTeam).toBe('guest')
        })
        it('nel set decisivo la soglia di vittoria scende a 15 punti', async () => {
            const wrapper = mountController()
            // 4 set già assegnati (2 a testa): il quinto è il set decisivo (3/5)
            wrapper.vm.state.sp.striscia = [
                { serv: 'h', ris: '', vinc: 'h' },
                { serv: 'h', ris: '', vinc: 'g' },
                { serv: 'h', ris: '', vinc: 'h' },
                { serv: 'h', ris: '', vinc: 'g' },
                { serv: 'h', ris: '', vinc: null },
            ]
            setScore(wrapper, 15, 10)
            await wrapper.vm.$nextTick()
            expect(wrapper.vm.setVintoTeam).toBe('home')
        })
        it('i bottoni modalità 3/5 e amichevole aggiornano configData', async () => {
            const wrapper = mountController()
            wrapper.vm.showConfig = true
            await wrapper.vm.$nextTick()
            const btn35 = wrapper.findAll('.btn-mode').find(b => b.text() === '3/5')
            await btn35.trigger('click')
            expect(wrapper.vm.configData.modalita).toBe('3/5')
            const btnAmichevole = wrapper.findAll('.btn-mode').find(b => b.text() === 'Amichevole')
            await btnAmichevole.trigger('click')
            expect(wrapper.vm.configData.modalita).toBe('amichevole')
            expect(btnAmichevole.classes()).toContain('active')
        })
        it('i campi di testo di configurazione aggiornano configData tramite v-model', async () => {
            const wrapper = mountController()
            wrapper.vm.showConfig = true
            await wrapper.vm.$nextTick()
            const inputs = wrapper.findAll('.dialog-config .input-field')
            await inputs[0].setValue('Casa Nuova')
            await inputs[1].setValue('Ospiti Nuovi')
            expect(wrapper.vm.configData.nomeHome).toBe('Casa Nuova')
            expect(wrapper.vm.configData.nomeGuest).toBe('Ospiti Nuovi')
        })
        it('i campi numerici della formazione aggiornano configData tramite v-model', async () => {
            const wrapper = mountController()
            wrapper.vm.showConfig = true
            await wrapper.vm.$nextTick()
            const numInputs = wrapper.findAll('.dialog-config .input-num')
            // 6 campi per home + 6 per guest: li valorizziamo tutti per coprire ogni binding v-model
            for (let i = 0; i < numInputs.length; i++) {
                await numInputs[i].setValue(String(i))
            }
            // il DOM ordina le celle come 3,2,1 / 4,5,0: verifichiamo l'insieme dei valori digitati
            expect(new Set(wrapper.vm.configData.formHome)).toEqual(new Set(['0', '1', '2', '3', '4', '5']))
            expect(new Set(wrapper.vm.configData.formGuest)).toEqual(new Set(['6', '7', '8', '9', '10', '11']))
        })
        it('la selezione squadra guest per i cambi apre la modal con cambiTeam=guest', async () => {
            const wrapper = mountController()
            wrapper.vm.showCambiTeam = true
            await wrapper.vm.$nextTick()
            await wrapper.find('.overlay .btn-set.guest-bg').trigger('click')
            expect(wrapper.vm.cambiTeam).toBe('guest')
            expect(wrapper.vm.showCambi).toBe(true)
        })
        it('i campi IN/OUT della modal cambi aggiornano cambiData tramite v-model', async () => {
            const wrapper = mountController()
            wrapper.vm.openCambi('home')
            await wrapper.vm.$nextTick()
            const inField = wrapper.find('.cambi-in-field')
            const outField = wrapper.find('.cambi-out-field')
            await inField.setValue('10')
            await outField.setValue('1')
            expect(wrapper.vm.cambiData[0]).toEqual({ in: '10', out: '1' })
        })
        it('nella modal time out si può selezionare un video dall\'elenco tramite radio', async () => {
            fetchMock.mockResolvedValueOnce({ json: async () => ['a.mp4'] })
            const wrapper = mountController()
            await wrapper.find('.btn-timeout').trigger('click')
            await flushPromises()
            const radios = wrapper.findAll('input[type=radio]')
            await radios[0].setValue(true)
            expect(wrapper.vm.timeoutVideoSel).toBe('a.mp4')
            await radios[1].setValue(true)
            expect(wrapper.vm.timeoutVideoSel).toBe(null)
        })
        it('Annulla nella modal time out la chiude senza avviarlo', async () => {
            const wrapper = mountController()
            await wrapper.find('.btn-timeout').trigger('click')
            await flushPromises()
            const spy = vi.spyOn(wrapper.vm, 'sendAction')
            await wrapper.find('.dialog-timeout .btn-cancel').trigger('click')
            expect(spy).not.toHaveBeenCalled()
            expect(wrapper.vm.showTimeoutModal).toBe(false)
        })
    })
    // =============================================
    // BARRA CONNESSIONE
    // =============================================
@@ -31,6 +31,15 @@ vi.stubGlobal('speechSynthesis', {
    getVoices: () => []
 })
 // happy-dom non implementa la Web Speech API: stub minimo dell'utterance.
 vi.stubGlobal('SpeechSynthesisUtterance', class {
    constructor(text) {
        this.text = text
        this.voice = null
        this.lang = ''
    }
 })
 // happy-dom non implementa la riproduzione media: stub di play/pause/load
 // così l'overlay time out può montare il <video> senza errori.
 Object.defineProperty(HTMLMediaElement.prototype, 'play', { value: vi.fn().mockResolvedValue(undefined), writable: true })
@@ -257,6 +266,256 @@ describe('DisplayPage.vue', () => {
        })
    })
    // =============================================
    // ORDINE GUEST/HOME CON FORMAZIONE
    // =============================================
    describe('Ordine guest/home con formazione visibile', () => {
        it('order=false e visuForm=true mostra punteggio inline e formazioni nell\'ordine guest poi home', async () => {
            const wrapper = mountDisplay()
            wrapper.vm.state.order = false
            wrapper.vm.state.visuForm = true
            wrapper.vm.state.sp.striscia.at(-1).ris = 'h'.repeat(3) + 'g'.repeat(2)
            await wrapper.vm.$nextTick()
            const scores = wrapper.findAll('.score-inline')
            expect(scores[0].text()).toBe('2') // guest per primo
            expect(scores[1].text()).toBe('3') // home per secondo
            const formDivs = wrapper.findAll('.formdiv')
            expect(formDivs).toHaveLength(12)
        })
    })
    // =============================================
    // MONTAGGIO: FULLSCREEN E TIME OUT GIÀ ATTIVO
    // =============================================
    describe('Comportamento al mount', () => {
        it('su dispositivo mobile richiede la fullscreen', () => {
            const uaSpy = vi.spyOn(navigator, 'userAgent', 'get').mockReturnValue('Mozilla/5.0 (iPhone; CPU iPhone OS 15_0 like Mac OS X)')
            const fsSpy = vi.fn()
            document.documentElement.requestFullscreen = fsSpy
            const wrapper = mountDisplay()
            expect(fsSpy).toHaveBeenCalled()
            wrapper.unmount()
            uaSpy.mockRestore()
        })
        it('non richiede la fullscreen su desktop', () => {
            const fsSpy = vi.fn()
            document.documentElement.requestFullscreen = fsSpy
            const wrapper = mountDisplay()
            expect(fsSpy).not.toHaveBeenCalled()
            wrapper.unmount()
        })
        it('ignora l\'errore se requestFullscreen lancia un\'eccezione', () => {
            const uaSpy = vi.spyOn(navigator, 'userAgent', 'get').mockReturnValue('Mozilla/5.0 (Linux; Android 10)')
            document.documentElement.requestFullscreen = () => { throw new Error('non consentito') }
            expect(() => mountDisplay()).not.toThrow()
            uaSpy.mockRestore()
        })
        it('se il time out è già attivo al mount avvia subito la modalità time out', async () => {
            const wrapper = mount(DisplayPage, {
                global: { stubs: { 'w-app': true } },
                data() {
                    const state = {
                        order: true, visuForm: false, visuStriscia: true,
                        timeout: true, timeoutTeam: 'home', timeoutVideo: null,
                        timeoutStartedAt: Date.now(), modalitaPartita: '3/5',
                        sp: {
                            striscia: [{ serv: 'h', ris: '', vinc: null }],
                            nomi: { home: 'Antoniana', guest: 'Guest' },
                            form: { home: ['1', '2', '3', '4', '5', '6'], guest: ['1', '2', '3', '4', '5', '6'] },
                        },
                    }
                    return { state }
                }
            })
            await wrapper.vm.$nextTick()
            expect(wrapper.vm.mostraPlaceholder).toBe(true)
            expect(wrapper.find('.timeout-overlay').exists()).toBe(true)
        })
    })
    // =============================================
    // TICKER COUNTDOWN E CASI LIMITE
    // =============================================
    describe('Ticker del countdown', () => {
        it('il ticker aggiorna nowTick periodicamente durante il time out', async () => {
            const wrapper = mountDisplay()
            wrapper.vm.state.timeoutTeam = 'home'
            wrapper.vm.state.timeoutStartedAt = Date.now()
            wrapper.vm.state.timeout = true
            await wrapper.vm.$nextTick()
            expect(wrapper.vm.timeoutRemaining).toBe(30)
            vi.advanceTimersByTime(1000)
            await wrapper.vm.$nextTick()
            expect(wrapper.vm.timeoutRemaining).toBeLessThan(30)
        })
        it('timeoutRemaining resta 30 se manca timeoutStartedAt', async () => {
            const wrapper = mountDisplay()
            wrapper.vm.state.timeoutTeam = 'home'
            wrapper.vm.state.timeoutStartedAt = null
            wrapper.vm.state.timeout = true
            await wrapper.vm.$nextTick()
            expect(wrapper.vm.timeoutRemaining).toBe(30)
        })
        it('smontare il componente durante il time out ferma il ticker senza errori', async () => {
            const wrapper = mountDisplay()
            wrapper.vm.state.timeoutTeam = 'home'
            wrapper.vm.state.timeoutStartedAt = Date.now()
            wrapper.vm.state.timeout = true
            await wrapper.vm.$nextTick()
            expect(() => wrapper.unmount()).not.toThrow()
        })
        it('stricciaStrip non fallisce se la striscia del set corrente è assente', async () => {
            const wrapper = mountDisplay()
            wrapper.vm.state.sp.striscia = []
            expect(wrapper.vm.stricciaStrip).toEqual({ home: [], guest: [] })
            // ripristina uno stato valido prima che Vue ricalcoli gli altri computed (punt/servHome)
            wrapper.vm.state.sp.striscia = [{ serv: 'h', ris: '', vinc: null }]
            await wrapper.vm.$nextTick()
        })
    })
    // =============================================
    // FINE TIME OUT: STOP VIDEO E FALLBACK MUTO
    // =============================================
    describe('Stop del time out e riproduzione video', () => {
        async function attivaTimeout(wrapper, { team = 'home', video = null, startedAt = Date.now() } = {}) {
            wrapper.vm.state.timeoutTeam = team
            wrapper.vm.state.timeoutVideo = video
            wrapper.vm.state.timeoutStartedAt = startedAt
            wrapper.vm.state.timeout = true
            await wrapper.vm.$nextTick()
            await wrapper.vm.$nextTick()
        }
        it('allo stop del time out con video in corso mette in pausa e resetta il video', async () => {
            const wrapper = mountDisplay()
            await attivaTimeout(wrapper, { video: 'a.mp4' })
            const video = wrapper.find('.timeout-video').element
            const pauseSpy = vi.spyOn(video, 'pause')
            wrapper.vm.state.timeout = false
            await wrapper.vm.$nextTick()
            expect(pauseSpy).toHaveBeenCalled()
        })
        it('a metà riproduzione si riallinea al punto corretto (riconnessione)', async () => {
            const wrapper = mountDisplay()
            await attivaTimeout(wrapper, { video: 'a.mp4', startedAt: Date.now() - 10000 })
            const video = wrapper.find('.timeout-video').element
            Object.defineProperty(video, 'duration', { value: 60, configurable: true })
            video.onloadedmetadata()
            expect(video.currentTime).toBeCloseTo(10, 0)
        })
        it('senza timeoutStartedAt non tenta alcun riallineamento (trascorsi=0)', async () => {
            const wrapper = mountDisplay()
            await attivaTimeout(wrapper, { video: 'a.mp4', startedAt: null })
            const video = wrapper.find('.timeout-video').element
            Object.defineProperty(video, 'duration', { value: 60, configurable: true })
            video.currentTime = 0
            video.onloadedmetadata()
            expect(video.currentTime).toBe(0)
        })
        it('non si riallinea se il tempo trascorso supera la durata del video', async () => {
            const wrapper = mountDisplay()
            await attivaTimeout(wrapper, { video: 'a.mp4', startedAt: Date.now() - 10000 })
            const video = wrapper.find('.timeout-video').element
            Object.defineProperty(video, 'duration', { value: 5, configurable: true })
            video.currentTime = 0
            video.onloadedmetadata()
            expect(video.currentTime).toBe(0)
        })
        it('caricaSpotCorrente non fa nulla se manca il ref del video o il video del time out', () => {
            const wrapper = mountDisplay()
            // nessun overlay attivo: $refs.spotVideo non esiste
            expect(() => wrapper.vm.caricaSpotCorrente()).not.toThrow()
            expect(wrapper.vm.spotVideoDuration).toBe(null)
        })
        it('playSpot non fa nulla se manca il ref del video', () => {
            const wrapper = mountDisplay()
            expect(() => wrapper.vm.playSpot()).not.toThrow()
        })
        it('se l\'autoplay con audio viene bloccato ripiega sul muto', async () => {
            const wrapper = mountDisplay()
            HTMLMediaElement.prototype.play = vi.fn()
                .mockRejectedValueOnce(new Error('autoplay bloccato'))
                .mockResolvedValueOnce(undefined)
            await attivaTimeout(wrapper, { video: 'a.mp4' })
            const video = wrapper.find('.timeout-video').element
            await Promise.resolve()
            await Promise.resolve()
            expect(video.muted).toBe(true)
        })
    })
    // =============================================
    // MESSAGGI WEBSOCKET E SINTESI VOCALE
    // =============================================
    describe('onWsMessage e sintesi vocale', () => {
        it('un messaggio "speak" avvia la sintesi vocale con il testo ricevuto', () => {
            const wrapper = mountDisplay()
            wrapper.vm.onWsMessage({ type: 'speak', text: '15 a 10' })
            expect(window.speechSynthesis.cancel).toHaveBeenCalled()
            expect(window.speechSynthesis.speak).toHaveBeenCalled()
            const utterance = window.speechSynthesis.speak.mock.calls.at(-1)[0]
            expect(utterance.text).toBe('15 a 10')
            expect(utterance.lang).toBe('it-IT')
        })
        it('un messaggio "error" viene loggato in console', () => {
            const wrapper = mountDisplay()
            const spy = vi.spyOn(console, 'error').mockImplementation(() => {})
            wrapper.vm.onWsMessage({ type: 'error', message: 'boom' })
            expect(spy).toHaveBeenCalledWith('[Display] Server error:', 'boom')
            spy.mockRestore()
        })
        it('ignora testo vuoto o non stringa nella sintesi vocale', () => {
            const wrapper = mountDisplay()
            window.speechSynthesis.speak.mockClear()
            wrapper.vm.speakOnDisplay('   ')
            wrapper.vm.speakOnDisplay(42)
            expect(window.speechSynthesis.speak).not.toHaveBeenCalled()
        })
        it('sceglie la voce "Google italiano" quando disponibile', () => {
            const wrapper = mountDisplay()
            const vIt = { name: 'voce it generica', lang: 'it-IT' }
            const vGoogle = { name: 'Google italiano', lang: 'it-IT' }
            window.speechSynthesis.getVoices = () => [vIt, vGoogle]
            wrapper.vm.speakOnDisplay('prova')
            const utterance = window.speechSynthesis.speak.mock.calls.at(-1)[0]
            expect(utterance.voice).toBe(vGoogle)
        })
        it('ripiega su una voce con lingua "it" se manca "Google italiano"', () => {
            const wrapper = mountDisplay()
            const vIt = { name: 'voce italiana', lang: 'it-IT' }
            const vEn = { name: 'english voice', lang: 'en-US' }
            window.speechSynthesis.getVoices = () => [vEn, vIt]
            wrapper.vm.speakOnDisplay('prova')
            const utterance = window.speechSynthesis.speak.mock.calls.at(-1)[0]
            expect(utterance.voice).toBe(vIt)
        })
        it('usa voice=null se nessuna voce italiana è disponibile', () => {
            const wrapper = mountDisplay()
            window.speechSynthesis.getVoices = () => [{ name: 'english voice', lang: 'en-US' }]
            wrapper.vm.speakOnDisplay('prova')
            const utterance = window.speechSynthesis.speak.mock.calls.at(-1)[0]
            expect(utterance.voice).toBe(null)
        })
    })
    // =============================================
    // ICONA SERVIZIO
    // =============================================
@@ -0,0 +1,36 @@
 // @vitest-environment happy-dom
 import { describe, it, expect, vi, afterEach } from 'vitest'
 import { generaReferto } from '../../src/referto.js'
 import { createInitialState } from '../../src/gameState.js'
 // generaReferto è l'unico punto con effetti collaterali di referto.js (window.open
 // + stampa): qui verifichiamo che orchestri correttamente le API del browser,
 // mockando window.open per non aprire davvero una finestra durante i test.
 describe('generaReferto (referto.js)', () => {
    afterEach(() => {
        vi.restoreAllMocks()
    })
    it('apre una nuova scheda, scrive il referto e avvia la stampa dopo il caricamento', () => {
        const listeners = {}
        const popup = {
            document: { write: vi.fn(), close: vi.fn() },
            print: vi.fn(),
            addEventListener: vi.fn((evt, cb) => { listeners[evt] = cb }),
        }
        const openSpy = vi.spyOn(window, 'open').mockReturnValue(popup)
        const state = createInitialState()
        state.sp.nomi = { home: 'Antoniana', guest: 'Rivali' }
        generaReferto(state)
        expect(openSpy).toHaveBeenCalledWith('', '_blank')
        expect(popup.document.write).toHaveBeenCalledTimes(1)
        expect(popup.document.write.mock.calls[0][0]).toContain('Antoniana')
        expect(popup.document.close).toHaveBeenCalledTimes(1)
        expect(popup.print).not.toHaveBeenCalled()
        listeners.load()
        expect(popup.print).toHaveBeenCalledTimes(1)
    })
 })
@@ -224,5 +224,102 @@ describe('createWsMixin (wsMixin.js)', () => {
            wrapper.unmount()
            expect(ws.close).toHaveBeenCalled()
        })
        it('beforeUnmount con connessione OPEN chiude con codice 1000', () => {
            const wrapper = mountWith()
            const ws = ultimaWs()
            ws.readyState = MockWebSocket.OPEN
            wrapper.unmount()
            expect(ws.close).toHaveBeenCalledWith(1000, 'Component unmounting')
        })
        it('beforeUnmount non lancia se ws.close lancia', () => {
            const wrapper = mountWith()
            const ws = ultimaWs()
            ws.readyState = MockWebSocket.OPEN
            ws.close.mockImplementation(() => { throw new Error('già chiusa') })
            const consoleSpy = vi.spyOn(console, 'error').mockImplementation(() => {})
            expect(() => wrapper.unmount()).not.toThrow()
            expect(consoleSpy).toHaveBeenCalled()
        })
        it('beforeUnmount annulla un reconnectTimeout pendente', () => {
            vi.useFakeTimers()
            try {
                const wrapper = mountWith()
                wrapper.vm.isConnecting = false
                wrapper.vm.scheduleReconnect()
                expect(wrapper.vm.reconnectTimeout).not.toBe(null)
                wrapper.unmount()
                // se il timer non fosse stato annullato, allo scoccare del delay
                // verrebbe creata una nuova connessione anche a componente smontato
                const primaDelTimeout = MockWebSocket.instances.length
                vi.advanceTimersByTime(30000)
                expect(MockWebSocket.instances.length).toBe(primaDelTimeout)
            } finally {
                vi.useRealTimers()
            }
        })
    })
    describe('rami aggiuntivi', () => {
        it('connectWebSocket non fa nulla se è già in corso un tentativo di connessione', () => {
            const wrapper = mountWith()
            const primaDelTimeout = MockWebSocket.instances.length
            wrapper.vm.isConnecting = true
            wrapper.vm.connectWebSocket()
            expect(MockWebSocket.instances.length).toBe(primaDelTimeout)
        })
        it('riconnettendosi con la WebSocket precedente OPEN, la chiude con codice 1000', () => {
            const wrapper = mountWith()
            const prima = ultimaWs()
            prima.readyState = MockWebSocket.OPEN
            wrapper.vm.isConnecting = false
            wrapper.vm.connectWebSocket()
            expect(prima.close).toHaveBeenCalledWith(1000, 'Reconnecting')
        })
        it('se la chiusura della WebSocket precedente lancia, logga e continua a riconnettersi', () => {
            const wrapper = mountWith()
            const prima = ultimaWs()
            prima.readyState = MockWebSocket.OPEN
            prima.close.mockImplementation(() => { throw new Error('già chiusa') })
            const consoleSpy = vi.spyOn(console, 'error').mockImplementation(() => {})
            wrapper.vm.isConnecting = false
            expect(() => wrapper.vm.connectWebSocket()).not.toThrow()
            expect(consoleSpy).toHaveBeenCalled()
            expect(ultimaWs()).not.toBe(prima)
        })
        it('onopen non lancia se il registro fallisce (send che lancia)', () => {
            const wrapper = mountWith()
            const ws = ultimaWs()
            ws.readyState = MockWebSocket.OPEN
            ws.send.mockImplementation(() => { throw new Error('boom') })
            const consoleSpy = vi.spyOn(console, 'error').mockImplementation(() => {})
            expect(() => ws.onopen()).not.toThrow()
            expect(wrapper.vm.wsConnected).toBe(true)
            expect(consoleSpy).toHaveBeenCalled()
        })
        it('onmessage non lancia su JSON non valido', () => {
            mountWith()
            const ws = ultimaWs()
            const consoleSpy = vi.spyOn(console, 'error').mockImplementation(() => {})
            expect(() => ws.onmessage({ data: 'non è JSON {{{' })).not.toThrow()
            expect(consoleSpy).toHaveBeenCalled()
        })
        it('scheduleReconnect non arma un secondo timer se uno è già pendente', () => {
            const wrapper = mountWith()
            const spy = vi.spyOn(globalThis, 'setTimeout')
            wrapper.vm.reconnectTimeout = 123 // timer già pendente (valore fittizio)
            wrapper.vm.scheduleReconnect()
            expect(spy).not.toHaveBeenCalled()
        })
    })
 })
@@ -40,8 +40,7 @@ test.describe('Referto di fine partita', () => {
        // Verifica il contenuto del referto
        const body = popup.locator('body');
        await expect(body).toContainText('Referto di Gara');
-        await expect(body).toContainText('Set 1');
+        await expect(popup.locator('.set-numero')).toHaveText(['1', '2']);
        await expect(body).toContainText('Set 2');
        // Home ha vinto 2 set a 0
        await expect(body).toContainText('2 – 0');
    });
@@ -0,0 +1,75 @@
 import { describe, it, expect, vi, beforeAll, afterAll } from 'vitest'
 import WebSocket from 'ws'
 import { createInitialState } from '../../src/gameState.js'
 // startServer() usa src/persist.js per caricare/salvare lo stato reale su disco
 // (.segnapunti/state.json): lo mockiamo per non toccare lo stato di una partita
 // vera durante i test, ed esercitare in isolamento l'avvio di HTTP + WebSocket.
 const saveState = vi.fn()
 vi.mock('../../src/persist.js', () => ({
    loadState: () => createInitialState(),
    saveState,
 }))
 const { startServer } = await import('../../server.js')
 describe('startServer (server.js)', () => {
    let server
    let port
    beforeAll(async () => {
        const consoleSpy = vi.spyOn(console, 'log').mockImplementation(() => {})
        server = startServer(0)
        await new Promise((resolve) => server.on('listening', resolve))
        port = server.address().port
        consoleSpy.mockRestore()
    })
    afterAll(async () => {
        await new Promise((resolve) => server.close(resolve))
    })
    it('stampa le info del server all\'avvio', async () => {
        const consoleSpy = vi.spyOn(console, 'log').mockImplementation(() => {})
        const s = startServer(0)
        await new Promise((resolve) => s.on('listening', resolve))
        const allLogs = consoleSpy.mock.calls.map(c => c[0]).join('\n')
        expect(allLogs).toContain('Segnapunti Server')
        consoleSpy.mockRestore()
        await new Promise((resolve) => s.close(resolve))
    })
    it('accetta una connessione WebSocket su /ws', async () => {
        const ws = new WebSocket(`ws://127.0.0.1:${port}/ws`)
        await new Promise((resolve, reject) => {
            ws.on('open', resolve)
            ws.on('error', reject)
        })
        ws.close()
    })
    it('rifiuta l\'upgrade su un percorso diverso da /ws', async () => {
        const ws = new WebSocket(`ws://127.0.0.1:${port}/altro-percorso`)
        await new Promise((resolve) => {
            ws.on('error', () => resolve())
            ws.on('open', () => { ws.close(); resolve() })
        })
    })
    it('un\'azione dal controller invoca saveState (onStateChange)', async () => {
        saveState.mockClear()
        const ws = new WebSocket(`ws://127.0.0.1:${port}/ws`)
        await new Promise((resolve, reject) => {
            ws.on('open', resolve)
            ws.on('error', reject)
        })
        ws.send(JSON.stringify({ type: 'register', role: 'controller' }))
        await new Promise((resolve) => ws.once('message', resolve))
        ws.send(JSON.stringify({ type: 'action', action: { type: 'incPunt', team: 'home' } }))
        await new Promise((resolve) => ws.once('message', resolve))
        expect(saveState).toHaveBeenCalled()
        ws.close()
    })
 })
@@ -0,0 +1,134 @@
 import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest'
 import { EventEmitter } from 'events'
 // Mock parziale di una WebSocket e del Server, analogo a websocket.test.js ma
 // con send/terminate che possono essere forzati a lanciare per esercitare i
 // rami di gestione errori altrimenti irraggiungibili.
 class MockWebSocket extends EventEmitter {
    constructor() {
        super()
        this.readyState = 1 // OPEN
    }
    send = vi.fn()
    terminate = vi.fn()
 }
 class MockWebSocketServer extends EventEmitter {
    clients = new Set()
 }
 describe('websocket-handler.js — rami di errore', () => {
    afterEach(() => {
        vi.restoreAllMocks()
        vi.resetModules()
        vi.doUnmock('../../src/gameState.js')
    })
    describe('errori di invio (ws.send che lancia)', () => {
        let wss, setupWebSocketHandler, consoleSpy
        beforeEach(async () => {
            vi.resetModules()
            ;({ setupWebSocketHandler } = await import('../../src/websocket-handler.js'))
            wss = new MockWebSocketServer()
            consoleSpy = vi.spyOn(console, 'error').mockImplementation(() => {})
        })
        it('handleRegister: se ws.send lancia durante l\'invio dello stato iniziale, non deve propagare l\'errore', () => {
            setupWebSocketHandler(wss)
            const ws = new MockWebSocket()
            ws.send.mockImplementation(() => { throw new Error('socket chiuso a metà') })
            wss.emit('connection', ws)
            wss.clients.add(ws)
            expect(() => {
                ws.emit('message', JSON.stringify({ type: 'register', role: 'display' }))
            }).not.toThrow()
            expect(consoleSpy).toHaveBeenCalledWith('Error sending initial state:', expect.any(Error))
        })
        it('sendError: se ws.send lancia rispondendo a un JSON non valido, non deve propagare l\'errore', () => {
            setupWebSocketHandler(wss)
            const ws = new MockWebSocket()
            ws.send.mockImplementation(() => { throw new Error('socket chiuso a metà') })
            wss.emit('connection', ws)
            wss.clients.add(ws)
            // JSON non valido → handleMessage va nel catch → sendError prova a rispondere → ws.send lancia
            expect(() => {
                ws.emit('message', 'non è JSON {{{')
            }).not.toThrow()
            expect(consoleSpy).toHaveBeenCalledWith('Failed to send error message:', expect.any(Error))
        })
        it('sendError: se ws.send lancia rispondendo a un\'azione invalida, non deve propagare l\'errore', () => {
            setupWebSocketHandler(wss)
            const controller = new MockWebSocket()
            wss.emit('connection', controller)
            wss.clients.add(controller)
            controller.emit('message', JSON.stringify({ type: 'register', role: 'controller' }))
            controller.send.mockImplementation(() => { throw new Error('socket chiuso a metà') })
            expect(() => {
                controller.emit('message', JSON.stringify({ type: 'action' }))
            }).not.toThrow()
            expect(consoleSpy).toHaveBeenCalledWith('Failed to send error message:', expect.any(Error))
        })
    })
    describe('handleError: ws.terminate che lancia', () => {
        it('non deve propagare l\'errore se la chiusura forzata fallisce', async () => {
            vi.resetModules()
            const { setupWebSocketHandler } = await import('../../src/websocket-handler.js')
            const wss = new MockWebSocketServer()
            setupWebSocketHandler(wss)
            const consoleSpy = vi.spyOn(console, 'error').mockImplementation(() => {})
            const ws = new MockWebSocket()
            ws.terminate.mockImplementation(() => { throw new Error('già chiusa') })
            wss.emit('connection', ws)
            const err = new Error('Invalid UTF8')
            err.code = 'WS_ERR_INVALID_UTF8'
            expect(() => ws.emit('error', err)).not.toThrow()
            expect(consoleSpy).toHaveBeenCalledWith('Error closing connection:', expect.any(Error))
        })
    })
    describe('handleAction: applyAction che lancia', () => {
        it('non deve propagare l\'errore, ripristina lo stato precedente e notifica il client', async () => {
            vi.resetModules()
            vi.doMock('../../src/gameState.js', async (importOriginal) => {
                const actual = await importOriginal()
                return {
                    ...actual,
                    applyAction: vi.fn((state, action) => {
                        if (action.type === 'boom') throw new Error('regola di gioco rotta')
                        return actual.applyAction(state, action)
                    }),
                }
            })
            const { setupWebSocketHandler } = await import('../../src/websocket-handler.js')
            const wss = new MockWebSocketServer()
            const handler = setupWebSocketHandler(wss)
            const consoleSpy = vi.spyOn(console, 'error').mockImplementation(() => {})
            const controller = new MockWebSocket()
            wss.emit('connection', controller)
            wss.clients.add(controller)
            controller.emit('message', JSON.stringify({ type: 'register', role: 'controller' }))
            const statoPrecedente = handler.getState()
            controller.send.mockClear()
            expect(() => {
                controller.emit('message', JSON.stringify({ type: 'action', action: { type: 'boom' } }))
            }).not.toThrow()
            expect(consoleSpy).toHaveBeenCalledWith('Error applying action:', expect.any(Error))
            expect(handler.getState()).toEqual(statoPrecedente)
            const msg = JSON.parse(controller.send.mock.calls.at(-1)[0])
            expect(msg.type).toBe('error')
            expect(msg.message).toContain('Failed to apply action')
        })
    })
 })
@@ -365,6 +365,13 @@ describe('Game Logic (gameState.js)', () => {
            expect(setDi(s).guest).toBe(0)
        })
        it('dovrebbe incrementare il set guest e servire guest nel nuovo set', () => {
            const s = applyAction(state, { type: 'nuovoSet', team: 'guest' })
            expect(setDi(s).home).toBe(0)
            expect(setDi(s).guest).toBe(1)
            expect(s.sp.striscia.at(-1).serv).toBe('g')
        })
        it('in 2/3 alla palla match registra il set vincente senza aprirne uno nuovo', () => {
            state.modalitaPartita = '2/3'
            setSetVinti(state, 1, 0)
@@ -508,6 +515,12 @@ describe('Game Logic (gameState.js)', () => {
            expect(s.timeoutVideo).toBe(null)
        })
        it('startTimeout senza startedAt dovrebbe lasciare timeoutStartedAt null', () => {
            const s = applyAction(state, { type: 'startTimeout', team: 'home', video: 'spot.mp4' })
            expect(s.timeout).toBe(true)
            expect(s.timeoutStartedAt).toBe(null)
        })
        it('startTimeout senza squadra valida dovrebbe essere ignorato', () => {
            for (const team of [undefined, null, 'arbitro', '']) {
                const s = applyAction(state, { type: 'startTimeout', team, video: 'spot.mp4', startedAt: 1000 })
@@ -532,6 +545,46 @@ describe('Game Logic (gameState.js)', () => {
            expect(s.timeout).toBe(false)
            expect(s.timeoutTeam).toBe(null)
        })
        it('startTimeout dovrebbe registrare l\'evento nel set corrente con il punteggio', () => {
            let s = state
            for (let i = 0; i < 3; i++) s = applyAction(s, { type: 'incPunt', team: 'home' })
            s = applyAction(s, { type: 'incPunt', team: 'guest' })
            s = applyAction(s, { type: 'startTimeout', team: 'guest', startedAt: 1000 })
            expect(s.sp.striscia.at(-1).timeouts).toEqual([
                { team: 'guest', punteggio: { home: 3, guest: 1 } },
            ])
        })
        it('startTimeout su time out già attivo non dovrebbe registrare un secondo evento', () => {
            let s = applyAction(state, { type: 'startTimeout', team: 'home', startedAt: 1000 })
            s = applyAction(s, { type: 'startTimeout', team: 'home', startedAt: 2000 })
            expect(s.sp.striscia.at(-1).timeouts).toHaveLength(1)
        })
        it('time out successivi dovrebbero accumularsi nel set corrente', () => {
            let s = applyAction(state, { type: 'startTimeout', team: 'home', startedAt: 1000 })
            s = applyAction(s, { type: 'stopTimeout' })
            s = applyAction(s, { type: 'incPunt', team: 'guest' })
            s = applyAction(s, { type: 'startTimeout', team: 'guest', startedAt: 2000 })
            expect(s.sp.striscia.at(-1).timeouts).toEqual([
                { team: 'home', punteggio: { home: 0, guest: 0 } },
                { team: 'guest', punteggio: { home: 0, guest: 1 } },
            ])
        })
        it('un nuovo set non dovrebbe ereditare i time out del precedente', () => {
            let s = applyAction(state, { type: 'startTimeout', team: 'home', startedAt: 1000 })
            s = applyAction(s, { type: 'stopTimeout' })
            s = applyAction(s, { type: 'nuovoSet', team: 'home' })
            expect(s.sp.striscia.at(-1).timeouts).toBeUndefined()
            expect(s.sp.striscia.at(-2).timeouts).toHaveLength(1)
        })
        it('startTimeout ignorato non dovrebbe registrare eventi', () => {
            const s = applyAction(state, { type: 'startTimeout', team: 'arbitro', startedAt: 1000 })
            expect(s.sp.striscia.at(-1).timeouts).toBeUndefined()
        })
    })
    // =============================================
@@ -604,6 +657,12 @@ describe('Game Logic (gameState.js)', () => {
    // CAMBI GIOCATORI (confermaCambi)
    // =============================================
    describe('confermaCambi', () => {
        it('senza array cambi non dovrebbe modificare la formazione', () => {
            state.sp.form.home = ["1", "2", "3", "4", "5", "6"]
            const s = applyAction(state, { type: 'confermaCambi', team: 'home' })
            expect(s.sp.form.home).toEqual(["1", "2", "3", "4", "5", "6"])
        })
        it('dovrebbe effettuare una sostituzione valida', () => {
            state.sp.form.home = ["1", "2", "3", "4", "5", "6"]
            const s = applyAction(state, {
@@ -705,6 +764,64 @@ describe('Game Logic (gameState.js)', () => {
            expect(s.sp.form.home).not.toContain("1")
            expect(s.sp.form.home).not.toContain("10")
        })
        it('dovrebbe registrare il cambio nel set corrente con il punteggio', () => {
            let s = state
            for (let i = 0; i < 2; i++) s = applyAction(s, { type: 'incPunt', team: 'home' })
            s = applyAction(s, { type: 'incPunt', team: 'guest' })
            s = applyAction(s, {
                type: 'confermaCambi',
                team: 'home',
                cambi: [{ in: "10", out: "3" }]
            })
            expect(s.sp.striscia.at(-1).cambi).toEqual([
                { team: 'home', in: "10", out: "3", punteggio: { home: 2, guest: 1 } },
            ])
        })
        it('dovrebbe registrare ogni cambio di una doppia sostituzione', () => {
            const s = applyAction(state, {
                type: 'confermaCambi',
                team: 'guest',
                cambi: [
                    { in: "10", out: "1" },
                    { in: "11", out: "2" }
                ]
            })
            expect(s.sp.striscia.at(-1).cambi).toEqual([
                { team: 'guest', in: "10", out: "1", punteggio: { home: 0, guest: 0 } },
                { team: 'guest', in: "11", out: "2", punteggio: { home: 0, guest: 0 } },
            ])
        })
        it('non dovrebbe registrare nulla se la validazione fallisce', () => {
            const s = applyAction(state, {
                type: 'confermaCambi',
                team: 'home',
                cambi: [{ in: "abc", out: "1" }]
            })
            expect(s.sp.striscia.at(-1).cambi).toBeUndefined()
        })
        it('non dovrebbe registrare nulla se tutti i cambi sono vuoti', () => {
            const s = applyAction(state, {
                type: 'confermaCambi',
                team: 'home',
                cambi: [{ in: "", out: "" }]
            })
            expect(s.sp.striscia.at(-1).cambi).toBeUndefined()
        })
        it('un nuovo set non dovrebbe ereditare i cambi del precedente', () => {
            let s = applyAction(state, {
                type: 'confermaCambi',
                team: 'home',
                cambi: [{ in: "10", out: "3" }]
            })
            s = applyAction(s, { type: 'nuovoSet', team: 'home' })
            expect(s.sp.striscia.at(-1).cambi).toBeUndefined()
            expect(s.sp.striscia.at(-2).cambi).toHaveLength(1)
        })
    })
    // =============================================
@@ -843,6 +960,12 @@ describe('Game Logic (gameState.js)', () => {
            expect(s.sp.striscia[0].ris).toBe('')
        })
        it('con striscia vuota dovrebbe usare "h" come servizio iniziale di default', () => {
            state.sp.striscia = []
            const s = applyAction(state, { type: 'resetta' })
            expect(s.sp.striscia).toEqual([{ serv: 'h', ris: '', vinc: null }])
        })
        it('dovrebbe impostare visuForm a false', () => {
            state.visuForm = true
            const s = applyAction(state, { type: 'resetta' })
@@ -21,10 +21,10 @@ describe('buildRefertoHtml (referto.js)', () => {
            { serv: 'h', ris: 'h'.repeat(25) + 'g'.repeat(18), vinc: 'h' },
        ]
        const html = buildRefertoHtml(statoConSet(striscia), NOW)
-        // due set reali → "Set 1" e "Set 2", mai "Set 3"
+        // due set reali → numeri "1" e "2" nella barra SET, mai "3"
-        expect(html).toContain('Set 1')
+        expect(html).toContain('<span class="set-numero">1</span>')
-        expect(html).toContain('Set 2')
+        expect(html).toContain('<span class="set-numero">2</span>')
-        expect(html).not.toContain('Set 3')
+        expect(html).not.toContain('<span class="set-numero">3</span>')
    })
    it('calcola il punteggio finale di ogni set dalla ris', () => {
@@ -60,6 +60,15 @@ describe('buildRefertoHtml (referto.js)', () => {
        expect(html).toContain('1 – 0')
    })
    it('ricava il vincitore guest dal conteggio punti se vinc è nullo', () => {
        const striscia = [
            { serv: 'h', ris: 'g'.repeat(25) + 'h'.repeat(20), vinc: null },
        ]
        const html = buildRefertoHtml(statoConSet(striscia), NOW)
        // conteggio punti guest > home, pur con vinc null → 0 – 1
        expect(html).toContain('0 – 1')
    })
    it('include la progressione punto-punto con classi per squadra', () => {
        const striscia = [
            { serv: 'h', ris: 'hhg', vinc: null },
@@ -97,6 +106,38 @@ describe('buildRefertoHtml (referto.js)', () => {
        expect(html).toContain('Nessun punto registrato')
    })
    it('elenca time out e cambi del set con squadra e punteggio', () => {
        const striscia = [{
            serv: 'h', ris: 'hhhg', vinc: null,
            timeouts: [{ team: 'guest', punteggio: { home: 3, guest: 1 } }],
            cambi: [{ team: 'home', in: '10', out: '3', punteggio: { home: 2, guest: 0 } }],
        }]
        const html = buildRefertoHtml(statoConSet(striscia), NOW)
        expect(html).toContain('Cambi e time out')
        expect(html).toContain('Time out <strong>Rivali</strong> sul 3-1')
        expect(html).toContain('Cambio <strong>Antoniana</strong>: entra 10 per 3 sul 2-0')
    })
    it('ordina gli eventi per punteggio crescente', () => {
        const striscia = [{
            serv: 'h', ris: 'hhhgg', vinc: null,
            timeouts: [{ team: 'home', punteggio: { home: 3, guest: 2 } }],
            cambi: [{ team: 'guest', in: '9', out: '4', punteggio: { home: 1, guest: 0 } }],
        }]
        const html = buildRefertoHtml(statoConSet(striscia), NOW)
        const idxCambio = html.indexOf('entra 9 per 4')
        const idxTimeout = html.indexOf('Time out')
        expect(idxCambio).toBeGreaterThan(-1)
        expect(idxTimeout).toBeGreaterThan(-1)
        expect(idxCambio).toBeLessThan(idxTimeout)
    })
    it('omette la sezione eventi se il set non ne ha', () => {
        const striscia = [{ serv: 'h', ris: 'h', vinc: null }]
        const html = buildRefertoHtml(statoConSet(striscia), NOW)
        expect(html).not.toContain('Cambi e time out')
    })
    it('header contiene nomi squadre, modalità e data iniettata', () => {
        const striscia = [{ serv: 'h', ris: '', vinc: null }]
        const state = statoConSet(striscia)
@@ -0,0 +1,81 @@
 import { describe, it, expect, vi, afterEach } from 'vitest'
 // getNetworkIPs() senza argomenti dipende dalla piattaforma (fs, child_process,
 // os.networkInterfaces): qui mockiamo quei moduli per esercitare in modo
 // deterministico i rami WSL/non-WSL, altrimenti scoperti dagli altri test
 // (che iniettano sempre `nets` per bypassare questo codice).
 describe('server-utils.js — rilevamento piattaforma', () => {
    afterEach(() => {
        vi.restoreAllMocks()
        vi.resetModules()
        vi.doUnmock('fs')
        vi.doUnmock('child_process')
        vi.doUnmock('os')
    })
    it('senza WSL usa os.networkInterfaces()', async () => {
        vi.doMock('fs', () => ({
            existsSync: vi.fn(() => false),
            readFileSync: vi.fn(),
        }))
        vi.doMock('child_process', () => ({
            execSync: vi.fn(),
        }))
        vi.doMock('os', () => ({
            networkInterfaces: vi.fn(() => ({
                eth0: [{ family: 'IPv4', internal: false, address: '10.0.0.9' }],
            })),
        }))
        const { getNetworkIPs } = await import('../../src/server-utils.js')
        expect(getNetworkIPs()).toEqual(['10.0.0.9'])
    })
    it('su WSL interroga PowerShell e filtra gli IP LAN', async () => {
        vi.doMock('fs', () => ({
            existsSync: vi.fn(() => true),
            readFileSync: vi.fn(() => 'Microsoft WSL2'),
        }))
        vi.doMock('child_process', () => ({
            execSync: vi.fn(() => Buffer.from('192.168.1.42\n127.0.0.1\n172.17.0.1\n')),
        }))
        vi.doMock('os', () => ({
            networkInterfaces: vi.fn(),
        }))
        const { getNetworkIPs } = await import('../../src/server-utils.js')
        expect(getNetworkIPs()).toEqual(['192.168.1.42'])
    })
    it('su WSL se PowerShell fallisce restituisce array vuoto', async () => {
        vi.doMock('fs', () => ({
            existsSync: vi.fn(() => true),
            readFileSync: vi.fn(() => 'Microsoft WSL2'),
        }))
        vi.doMock('child_process', () => ({
            execSync: vi.fn(() => { throw new Error('powershell non disponibile') }),
        }))
        vi.doMock('os', () => ({
            networkInterfaces: vi.fn(),
        }))
        const { getNetworkIPs } = await import('../../src/server-utils.js')
        expect(getNetworkIPs()).toEqual([])
    })
    it('se la lettura di /proc/sys/kernel/osrelease lancia, tratta la piattaforma come non-WSL', async () => {
        vi.doMock('fs', () => ({
            existsSync: vi.fn(() => true),
            readFileSync: vi.fn(() => { throw new Error('permesso negato') }),
        }))
        vi.doMock('child_process', () => ({
            execSync: vi.fn(),
        }))
        vi.doMock('os', () => ({
            networkInterfaces: vi.fn(() => ({})),
        }))
        const { getNetworkIPs } = await import('../../src/server-utils.js')
        expect(getNetworkIPs()).toEqual([])
    })
 })
Author	SHA1	Message	Date
davide	bd90a2efe4	chore(deps): risolve vulnerabilità npm audit e aggiorna a Node 24 LTS Aggiorna vitest/@vitest/ui alla 4.1.10 (azzera le 14 vulnerabilità segnalate da npm audit, incluse 2 critiche). Node 20 era ormai a fine supporto: Dockerfile, .nvmrc ed engines in package.json passano a Node 24 LTS; il README documenta i requisiti in una sezione dedicata in cima al file, senza duplicarli altrove.	2026-07-15 10:58:52 +02:00
davide	93372a1299	fix(referto): rimuove il riepilogo set vinti ridondante Il blocco "3 – 0 / SET VINTI" accanto alla tabella "Risultato finale" duplicava l'informazione già mostrata in "Vince <squadra> 3 – 0".	2026-07-15 10:36:26 +02:00
davide	82c997d475	Merge branch 'issue#19' Migliora il referto di gara: nomi squadra al posto di A/B, icona servizio a inizio set, allineamento "vinto da" e colori squadra coerenti col segnapunti live.	2026-07-15 10:26:50 +02:00
davide	35c49247a8	style(referto): allinea i colori squadra a quelli del segnapunti live Punti in striscia e nomi in "Formazione di partenza" ora usano lo stesso giallo (#f5c518) per la squadra di casa e blu (#2196f3) per gli ospiti già usati in display/controller, invece di una palette scollegata dal resto dell'app.	2026-07-15 10:25:57 +02:00
davide	fec140df62	style(referto): allinea "vinto da" a destra nell'header del set Separa punteggio ed etichetta vincitore su un flex con justify-content: space-between per migliorare la leggibilità.	2026-07-15 10:11:40 +02:00
davide	c6eb493f25	feat(referto): mostra l'icona del servizio a inizio set Aggiunge un'icona nera (nuovo asset serv-nero.png, più visibile del serv.png bianco su sfondo chiaro) accanto al nome della squadra che serviva all'inizio di ogni set nel referto stampabile. Corregge inoltre generaReferto: la stampa partiva subito dopo document.close(), prima che l'icona (risorsa esterna asincrona) finisse di caricare, risultando in un riquadro vuoto. Ora attende l'evento 'load' della finestra popup prima di chiamare print().	2026-07-15 10:05:47 +02:00
davide	7cf84a94d9	fix(referto): mostra i nomi delle squadre al posto delle etichette A/B L'header e la tabella del risultato finale usavano segnaposto generici "A"/"B"; ora indicano esplicitamente casa/ospiti e i nomi reali delle squadre.	2026-07-15 09:55:51 +02:00
davide	00a8300a75	chore(release): bump versione a 2.1.0 Aggiorna package.json/package-lock.json, tag immagine in docker-compose.yml e riferimenti nel README; changelog 2.1.0 con time out/spot video, modalità amichevole, referto, layout esteso controller e flusso dev containerizzato.	2026-07-08 10:28:18 +02:00
davide	ec19eb62c3	feat(docker): aggiungi flusso di sviluppo con hot reload via compose Dockerfile diventa multi-stage con target `dev` (Vite + bind-mount) oltre a `builder`/`runtime`; docker-compose.dev.yml lo usa per un ambiente di sviluppo containerizzato equivalente a `npm run dev`, senza toccare il compose di produzione (che resta pull-only dal registry). Documentato in README e CLAUDE.md.	2026-07-08 10:23:27 +02:00
davide	34c9a61e79	docs(claude): comprimi CLAUDE.md per ridurre i token senza perdere contenuti Riscrittura più concisa (elenchi puntati al posto di prosa, frasi accorciate); tutti i concetti tecnici restano invariati.	2026-07-08 00:24:30 +02:00
davide	ff6a305554	Merge branch 'update-striscia-18' (#18 ) Registra cambi e time out per set nella striscia, ristilizza il referto in stile FIPAV e porta la copertura test dal 76% al 99%.	2026-07-03 12:09:06 +02:00
davide	82c2286ca6	docs: aggiorna README, tests/README e CLAUDE.md con la nuova copertura test Riflette i test aggiunti nei commit precedenti: rilevamento piattaforma di server-utils, avvio effettivo di startServer, rami di errore del WebSocket handler, cleanup/riconnessione di wsMixin, side-effect di generaReferto e layout esteso del controller. Aggiorna anche i conteggi di esempio (15 file/362 test Vitest, 81 E2E) e documenta come verificare la copertura (>99% statement).	2026-07-03 12:04:17 +02:00
davide	0b7cbd00f6	test(component): porta ControllerPage e DisplayPage al 100% di statement coverage Aggiunge 65 test per ControllerPage.vue (layout esteso/landscape, popup automatico di set vinto con soglia decisiva, modal di configurazione, validazione completa dei cambi giocatore, modal time out con selezione video/ticker/countdown, cleanup dei listener) e 35 per DisplayPage.vue (countdown overlay, riallineamento video su riconnessione, fallback muto per autoplay bloccato, selezione voce per la sintesi vocale). Nessun bug riscontrato nei componenti.	2026-07-03 12:00:45 +02:00
davide	6638d6fe44	test(server): copri l'avvio effettivo di startServer (HTTP + WebSocket) startServer() non era mai invocato nei test: solo createApp() (routing) era coperto. Mocka src/persist.js per non toccare .segnapunti/state.json reale, e verifica l'ascolto HTTP, l'accettazione dell'upgrade su /ws, il rifiuto su altri percorsi e la persistenza dello stato dopo un'azione del controller.	2026-07-03 12:00:30 +02:00
davide	cbf927255a	test(wsMixin): copri cleanup, riconnessione e guardie residue Aggiunge test per beforeUnmount con connessione OPEN e con ws.close che lancia, l'annullamento del reconnectTimeout allo smontaggio, la guardia isConnecting, la chiusura della WebSocket precedente prima di riconnettersi (incluso il caso in cui close lancia), gli errori di registrazione/parsing nei gestori onopen/onmessage e la guardia di scheduleReconnect contro timer doppi.	2026-07-03 12:00:16 +02:00
davide	3d54d162e6	test(websocket-handler): copri i rami di errore su send/terminate/applyAction Aggiunge scenari in cui ws.send o ws.terminate lanciano eccezioni e in cui applyAction fallisce a metà azione: verifica che l'errore venga loggato e lo stato precedente ripristinato senza propagare l'eccezione al chiamante.	2026-07-03 12:00:02 +02:00
davide	eb91b71d7e	test(server-utils): copri il rilevamento piattaforma (WSL/PowerShell) getNetworkIPs() senza parametri usa isWSL()/execSync/os.networkInterfaces, codice mai esercitato perché tutti gli altri test iniettano `nets` per bypassarlo. Mocka fs/child_process/os per coprire in modo deterministico i rami WSL, non-WSL, fallimento PowerShell e lettura /proc fallita.	2026-07-03 11:59:49 +02:00
davide	2625284e99	test(referto): copri generaReferto e il branch guest di vincitoreSet buildRefertoHtml mancava il caso vinc nullo con guest in vantaggio; generaReferto (window.open/print) non era testato affatto perché richiede un DOM — aggiunto un test component in happy-dom che mocka window.open.	2026-07-03 11:59:33 +02:00
davide	fdd1d0c990	test(gameState): copri i branch residui di nuovoSet/confermaCambi/resetta/startTimeout Aggiunge casi per team 'guest' in nuovoSet, cambi senza array `cambi`, resetta con striscia vuota e startTimeout senza startedAt: gameState.js passa dal 100% al 100% statement ma sale al 99% branch.	2026-07-03 11:59:19 +02:00
davide	5bdd8ad986	style(referto): riprendi il layout del modulo ufficiale FIPAV Cornice nera, barre teal "SET N" per set, badge A/B per squadre e box risultato finale in stile tabella, per avvicinare il referto stampabile all'aspetto del referto cartaceo FIPAV mantenendo solo i dati che l'app traccia realmente.	2026-07-03 11:31:57 +02:00
davide	f6f3dd11d4	feat(striscia): registra cambi e time out per set (#18 ) La striscia salva ora storico cambi formazione e time out per ogni set, con riferimento al punteggio al momento dell'evento anziché a un timestamp: startTimeout accumula in set.timeouts, confermaCambi in set.cambi. Il referto elenca entrambi ordinati per punteggio.	2026-07-03 11:16:47 +02:00