Mutualiser les panneaux de manche 2 et de finale entre spectateur et candidat #73

New issue

Open

opened 2026-07-02 06:25:09 +00:00 by Reliodas · 0 comments

Reliodas commented

2026-07-02 06:25:09 +00:00

Owner

Constat audit du 2 juillet 2026 : Spectator.vue ré-implémente les panneaux d'affichage des manches 2 et 3 (codebreaker, plateau des catégories, tableau de la finale, écrans de résultat) déjà présents dans PlayerRound2.vue/PlayerRound3.vue, et redéfinit localement les styles .round2-title et .sround2-panel alors que player-rounds.css porte les mêmes règles. Côté serveur, game.handler.ts duplique la logique « à qui le tour » des modules de manche avec deux gardes différentes (playOrder.length === 0 pour la finale, Math.max(playOrder.length, 1) pour la manche 2).

Objectif : réduire ces duplications résiduelles sans changement de comportement, dans la continuité du découpage des vues (#12) et du nettoyage (#58).

Tâches :

extraire des composants de scène partagés (codebreaker, sélection de catégorie, cellule de finale, écrans de fin) paramétrés par un mode lecture seule, utilisés par les vues candidat et spectateur ;
supprimer les styles scoped dupliqués de Spectator.vue au profit des classes de player-rounds.css / zones ;
déplacer la vérification du tour de sélection (player:select-category, player:select-cell) dans les modules round2/round3 avec une garde unique et testée ;
conserver la projection d'état par rôle : aucun champ caché ne doit devenir visible côté spectateur.

Critères d'acceptation :

aucun changement de comportement ni de contrat Socket.IO (refactor pur) ;
les tests existants (node:test, Vitest, Playwright) passent sans abaisser les seuils de couverture ;
les blocs manche 2 / finale du spectateur et du candidat partagent les mêmes composants ;
la garde du tour de sélection n'existe plus qu'à un seul endroit par manche, couverte par des tests de refus (mauvais joueur, mauvais statut).

Dépendances / limites : à faire de préférence avant #54 (responsive) pour ne pas retoucher deux fois les mêmes écrans ; ne couvre pas l'accessibilité (ticket dédié).

Constat audit du 2 juillet 2026 : `Spectator.vue` ré-implémente les panneaux d'affichage des manches 2 et 3 (codebreaker, plateau des catégories, tableau de la finale, écrans de résultat) déjà présents dans `PlayerRound2.vue`/`PlayerRound3.vue`, et redéfinit localement les styles `.round2-title` et `.sround2-panel` alors que `player-rounds.css` porte les mêmes règles. Côté serveur, `game.handler.ts` duplique la logique « à qui le tour » des modules de manche avec deux gardes différentes (`playOrder.length === 0` pour la finale, `Math.max(playOrder.length, 1)` pour la manche 2). Objectif : réduire ces duplications résiduelles sans changement de comportement, dans la continuité du découpage des vues (#12) et du nettoyage (#58). Tâches : - [ ] extraire des composants de scène partagés (codebreaker, sélection de catégorie, cellule de finale, écrans de fin) paramétrés par un mode lecture seule, utilisés par les vues candidat et spectateur ; - [ ] supprimer les styles scoped dupliqués de `Spectator.vue` au profit des classes de `player-rounds.css` / zones ; - [ ] déplacer la vérification du tour de sélection (`player:select-category`, `player:select-cell`) dans les modules `round2`/`round3` avec une garde unique et testée ; - [ ] conserver la projection d'état par rôle : aucun champ caché ne doit devenir visible côté spectateur. Critères d'acceptation : - aucun changement de comportement ni de contrat Socket.IO (refactor pur) ; - les tests existants (node:test, Vitest, Playwright) passent sans abaisser les seuils de couverture ; - les blocs manche 2 / finale du spectateur et du candidat partagent les mêmes composants ; - la garde du tour de sélection n'existe plus qu'à un seul endroit par manche, couverte par des tests de refus (mauvais joueur, mauvais statut). Dépendances / limites : à faire de préférence avant #54 (responsive) pour ne pas retoucher deux fois les mêmes écrans ; ne couvre pas l'accessibilité (ticket dédié).