Plan de la nouvelle partie directe clos : résultat dans la description de la MR

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

app/src/domain/game/advice.ts

@@ -10,7 +10,7 @@
 // stockage, dans le journal (events.ts, champ advice). Le format est
 // durable (ADR 0007) : chaque conseil porte sa version (ADVICE_VERSION).
 
-import type { CubeAction, CubeEquities, Ply, Skill } from "./engine.js";
+import type { CubeAction, CubeEquities, MoveNotation, Ply, Skill } from "./engine.js";
 import type { HalfMove, PositionId } from "./position.js";
 import type { Roll } from "./roll.js";
 
@@ -29,7 +29,7 @@ export type Advice = MoveAdvice | CubeAdvice;
 /** Un coup, tel que le conseil le retient. */
 export interface AdvisedMove {
     /** Notation de gnubg, par exemple « 8/5 6/5 ». */
-    readonly notation: string;
+    readonly notation: MoveNotation;
     readonly halfMoves: readonly HalfMove[];
     /** Équité (avec videau) du point de vue du joueur, et le niveau auquel
      * le moteur l'a évaluée. */

app/src/domain/game/engine.ts

@@ -281,6 +281,15 @@ export interface EngineMatchAfter {
     readonly crawford: boolean;
 }
 
+/**
+ * Un coup écrit dans la notation de gnubg : « 8/5 6/5 », « 24/22* »,
+ * « 6/off », « bar/22 », « 8/4(2) ». Le moteur l'écrit ; l'application ne
+ * fait que l'afficher.
+ *
+ * Glossaire : docs/glossaire/notation-des-coups.md
+ */
+export type MoveNotation = string;
+
 /**
  * Un coup légal complet.
  *
@@ -288,7 +297,7 @@ export interface EngineMatchAfter {
  */
 export interface Move {
     /** Notation de gnubg, par exemple « 8/5 6/5 ». */
-    readonly notation: string;
+    readonly notation: MoveNotation;
     /** Ses demi-coups, dans un ordre jouable. */
     readonly halfMoves: readonly HalfMove[];
     /** La position après le coup, vue du joueur qui vient de jouer. */

app/src/domain/game/game.ts

@@ -12,7 +12,15 @@
 import type { Advice } from "./advice.js";
 import { type Branch, branches, switchToBranch } from "./branches.js";
 import { CENTERED_CUBE, type Cube } from "./cube.js";
-import type { BoardSide, Engine, EngineCube, Level, Ply, ResultKind } from "./engine.js";
+import type {
+    BoardSide,
+    Engine,
+    EngineCube,
+    Level,
+    MoveNotation,
+    Ply,
+    ResultKind,
+} from "./engine.js";
 import {
     appendEvent,
     currentLine,
@@ -27,7 +35,14 @@ import {
     withAnalysesOf,
 } from "./events.js";
 import { firstGameOf, type Match, nextGameOf } from "./match.js";
-import { BAR, type HalfMove, OFF, type PositionId, START_POSITION } from "./position.js";
+import {
+    BAR,
+    formatHalfMoves,
+    type HalfMove,
+    OFF,
+    type PositionId,
+    START_POSITION,
+} from "./position.js";
 import { type DiceSource, type Roll, randomDice, rollDice } from "./roll.js";
 import { otherSide, type Side } from "./side.js";
 import { type GameState, replay } from "./state.js";
@@ -186,8 +201,11 @@ export class Game {
     }
 
     /** Les demi-coups saisis forment un coup complet (le moteur le dit) : il
-     * n'attend plus que d'être validé (confirmMove) ou défait
-     * (undoLastHalfMove). */
+     * peut être validé (confirmMove) ou défait (undoLastHalfMove). La saisie
+     * n'est pas close pour autant : en sortie, un coup complet peut encore
+     * se prolonger en un autre coup légal (avec 6-1 et des pions sur 6 et 1,
+     * 6/off seul mène à la même position que 6/5/off, et 1/off reste
+     * possible) ; nextHalfMoves dit lesquels, selon le moteur. */
     get moveComplete(): boolean {
         return this.#pending.at(-1)?.complete === true;
     }
@@ -273,6 +291,29 @@ export class Game {
         return { side, halfMoves, boards, hits };
     }
 
+    /**
+     * Le coup joué à l'événement eventId (un MovePlayed), dans la notation
+     * du moteur : celle du coup légal de gnubg qui mène à la même position
+     * (« 6/off » et non « 6/5 5/off »), comme dans l'analyse et le bilan.
+     * À défaut (aucun coup légal ne correspond), les demi-coups ; chaîne
+     * vide si l'événement n'est pas un coup ou si aucun pion n'a bougé.
+     */
+    async moveNotation(eventId: string): Promise<MoveNotation> {
+        const line = currentLine({ ...this.#journal, head: eventId });
+        const event = line.at(-1);
+        if (event?.type !== "MovePlayed" || event.halfMoves.length === 0) {
+            return "";
+        }
+        const before = replay(line.slice(0, -1));
+        const roll = rollToPlay(before);
+        const [check, legal] = await Promise.all([
+            this.#engine.checkHalfMoves(before.position, roll, event.halfMoves),
+            this.#engine.legalMoves(before.position, roll),
+        ]);
+        const move = legal.find((m) => m.position === check.position);
+        return move?.notation ?? formatHalfMoves(event.halfMoves);
+    }
+
     /** Les conseils du maître déjà rattachés aux décisions du joueur, par
      * identifiant d'événement. */
     get advice(): Readonly<Record<string, Advice>> {
@@ -296,11 +337,14 @@ export class Game {
      * déjà saisis (liste vide hors de son tour de jeu). Chaque candidat
      * déplace un de ses pions de la valeur d'un dé (vers la sortie si le dé
      * dépasse la case 1) ; seuls restent ceux que le moteur déclare menant à
-     * un coup légal. Aucune règle n'est jugée ici.
+     * un coup légal. Aucune règle n'est jugée ici : même après un coup
+     * complet, c'est le moteur qui dit si un dé reste à jouer. Seule
+     * exception : une fois tous les dés utilisés (diceLeft), rien n'est
+     * demandé, le moteur n'acceptant pas plus de demi-coups que de dés.
      */
     async nextHalfMoves(): Promise<HalfMove[]> {
         const state = this.state;
-        if (state.turn !== "player" || state.phase !== "moving" || this.moveComplete) {
+        if (state.turn !== "player" || state.phase !== "moving" || !this.#diceLeft(state)) {
             return [];
         }
         const roll = rollToPlay(state);
@@ -370,13 +414,13 @@ export class Game {
 
     /**
      * Le joueur déplace un pion (un dé). Renvoie false si ce demi-coup ne
-     * mène à aucun coup légal (ou si le coup est déjà complet) : il est
-     * refusé et rien ne change. Le coup n'est pas joué pour autant : une fois
-     * complet (moveComplete), il attend d'être validé (confirmMove).
+     * mène à aucun coup légal : il est refusé et rien ne change. Le coup
+     * n'est pas joué pour autant : une fois complet (moveComplete), il attend
+     * d'être validé (confirmMove), ou prolongé si le moteur le permet.
      */
     async playHalfMove(halfMove: HalfMove): Promise<boolean> {
         const state = this.#expect("player", "moving");
-        if (this.moveComplete) {
+        if (!this.#diceLeft(state)) {
             return false;
         }
         const check = await this.#engine.checkHalfMoves(state.position, rollToPlay(state), [
@@ -393,6 +437,13 @@ export class Game {
         return true;
     }
 
+    /** Il reste un dé à jouer : moins de demi-coups saisis que de dés
+     * (quatre pour un double). */
+    #diceLeft(state: GameState): boolean {
+        const roll = rollToPlay(state);
+        return this.#pending.length < (roll[0] === roll[1] ? 4 : 2);
+    }
+
     /** Défait le dernier demi-coup saisi du coup en cours (rien s'il n'y en a
      * pas) : il n'a jamais été dans le journal. */
     undoLastHalfMove(): void {

app/src/domain/learning/tutorial.ts

@@ -209,10 +209,14 @@ export class MovePractice {
         if (!(await this.#game.playHalfMove(halfMove))) {
             return "wrong";
         }
-        if (this.#game.moveComplete) {
-            const position = this.#game.displayedPosition;
-            return this.#expected.some((m) => m.position === position) ? "right" : "wrong";
+        if (
+            this.#game.moveComplete &&
+            this.#expected.some((m) => m.position === this.#game.displayedPosition)
+        ) {
+            return "right";
         }
+        // Un coup complet peut encore se prolonger (en sortie) : il n'est
+        // refusé que s'il ne peut plus mener à un coup attendu.
         return canStillLeadTo(this.#game.pendingHalfMoves, this.#expected) ? "continue" : "wrong";
     }
 

app/src/ui/advice-view.ts

@@ -19,6 +19,7 @@ import type { Game } from "../domain/game/game.js";
 import { ADVICE_TEXTS, CUBE_GLOSSARY, formatEquity } from "./advice-texts.js";
 import { type IconName, icon } from "./icons.js";
 import { boardSvg, createMovePlayer, drawSteps, type MovePlayer } from "./move-board.js";
+import { showWithNotation } from "./notation.js";
 import { routeHash } from "./router.js";
 
 /** Préfixe des identifiants du plateau de la feuille. */
@@ -190,8 +191,9 @@ export function createAdviceView(options: AdviceViewOptions): AdviceView {
         const svg = sheetBoard(boardBox);
         if (best === null) {
             svg.dataset.move = "mine";
-            svg.setAttribute("aria-label", ADVICE_TEXTS.legendSame(advice.played.notation));
-            legend.textContent = ADVICE_TEXTS.legendSame(advice.played.notation);
+            const text = ADVICE_TEXTS.legendSame(advice.played.notation);
+            svg.setAttribute("aria-label", text);
+            showWithNotation(legend, text, advice.played.notation);
             void player?.play(mine);
             return;
         }
@@ -220,7 +222,7 @@ export function createAdviceView(options: AdviceViewOptions): AdviceView {
                 shown === "mine"
                     ? ADVICE_TEXTS.legendMine(notation)
                     : ADVICE_TEXTS.legendBest(notation);
-            legend.textContent = text;
+            showWithNotation(legend, text, notation);
             svg.setAttribute("aria-label", text);
             svg.dataset.move = shown;
             void player?.play(shown === "mine" ? mine : best);

app/src/ui/app.ts

@@ -30,9 +30,10 @@ import {
 } from "../domain/analysis/phrases.js";
 import type { Advice } from "../domain/game/advice.js";
 import type { Cube } from "../domain/game/cube.js";
+import type { MoveNotation } from "../domain/game/engine.js";
 import type { GameJournal } from "../domain/game/events.js";
 import type { Game, MoveSteps, NewGame, SideBoards } from "../domain/game/game.js";
-import { formatHalfMoves, type HalfMove } from "../domain/game/position.js";
+import type { HalfMove } from "../domain/game/position.js";
 import { type PositionLink, type SharedPosition, setupOf } from "../domain/game/position-link.js";
 import type { SavedGameSummary } from "../domain/game/saved-game.js";
 import { otherSide, type Side } from "../domain/game/side.js";
@@ -76,6 +77,7 @@ import { installPlatform, startInstaller } from "./install.js";
 import { MATCH_TEXTS } from "./match-texts.js";
 import { replacingLink, startNavigation } from "./navigation.js";
 import { createNewGameView } from "./new-game-view.js";
+import { showWithNotation } from "./notation.js";
 import { createReviewRunner, type RunAnalysis } from "./review-runner.js";
 import { isHelpScreen, type Route, routeHash } from "./router.js";
 import {
@@ -424,6 +426,10 @@ export function startApp(options: AppOptions): void {
     let stuck = false;
     let busy = true;
     let info: string = TEXTS.loading;
+    // La dernière ligne « L'ordinateur a joué … » et le coup qu'elle cite :
+    // tant qu'elle est la ligne d'information, ce coup mène à la fiche
+    // « Notation des coups ».
+    let computerLine: ComputerTurnLine | null = null;
     let engineFailed = false;
     // Le dernier coup de l'ordinateur, montré (traces, « Revoir ») jusqu'à
     // la prochaine action du joueur ; null : rien à montrer.
@@ -627,7 +633,11 @@ export function startApp(options: AppOptions): void {
         } else if (computerCouldNotMove(game)) {
             ui.info.textContent = TEXTS.computerCannotMove(rollBefore(game));
         } else {
-            ui.info.textContent = info;
+            showWithNotation(
+                ui.info,
+                info,
+                computerLine?.text === info ? computerLine.notation : null,
+            );
         }
         ui.prompt.textContent = panelShown
             ? ""
@@ -1018,7 +1028,8 @@ export function startApp(options: AppOptions): void {
         while (game !== null && game.state.turn === "computer" && isPlaying(game)) {
             await refresh();
             await game.playComputerTurn();
-            info = describeComputerTurn(game);
+            computerLine = await describeComputerTurn(game);
+            info = computerLine.text;
             save();
             played = true;
         }
@@ -1400,25 +1411,37 @@ export function startApp(options: AppOptions): void {
      * La partie à l'écran vient de finir : son analyse part en
      * arrière-plan, et le bilan remplace le panneau de fin de partie dès
      * qu'il est prêt (charte 1e), si le panneau est toujours là.
+     *
+     * Le bilan s'ouvre un peu plus tard (microtâche) : seulement si cette
+     * partie finie est encore celle de l'écran. Sinon, « Commencer » de
+     * l'écran « Nouvelle partie » ouvrait le bilan de l'ancienne partie
+     * par-dessus la nouvelle, qui venait de commencer entre-temps (défaut
+     * signalé le 2026-11-11).
      */
     function reviewFinishedGame(): void {
         const id = options.games.shownId();
-        if (game === null || id === null || busy || game.state.phase !== "over") {
+        const finished = game;
+        if (finished === null || id === null || busy || finished.state.phase !== "over") {
             return;
         }
         // L'analyse d'une autre partie, regardée, passe d'abord.
         const running = reviewRunner.running;
         if (running === null || running === id) {
-            review(id, game.journal);
+            review(id, finished.journal);
         }
         if (
             navigation.route.screen === "game" &&
             !panelDismissed &&
             phrases !== null &&
-            readyForSummary(game.journal)
+            readyForSummary(finished.journal)
         ) {
             queueMicrotask(() => {
-                if (navigation.route.screen === "game" && !panelDismissed) {
+                if (
+                    game === finished &&
+                    options.games.shownId() === id &&
+                    navigation.route.screen === "game" &&
+                    !panelDismissed
+                ) {
                     navigation.go(routeHash({ screen: "summary", game: id }));
                 }
             });
@@ -1866,8 +1889,10 @@ export function startApp(options: AppOptions): void {
         welcomed: () => saveSettings(welcomed()),
     });
 
-    // L'écran « Nouvelle partie » : « Commencer » remplace son adresse par
-    // celle de la partie (le retour du téléphone ne le rouvre pas).
+    // L'écran « Nouvelle partie » : « Commencer » lance la partie, puis
+    // remplace son adresse par celle de la partie (le retour du téléphone
+    // ne le rouvre pas). Dans cet ordre : l'écran de jeu ne se redessine
+    // jamais avec l'ancienne partie, finie, et son panneau de fin.
     const newGameView = createNewGameView({
         section: ui.newGameSection,
         settings: () => settings,
@@ -1876,8 +1901,8 @@ export function startApp(options: AppOptions): void {
             if (busy || game === null) {
                 return;
             }
-            navigation.replace("#/");
             newGame(chosenGame(settings));
+            navigation.replace("#/");
         },
     });
     leavingLink(newGameView.closeLink, (route) => route.screen === "newGame");
@@ -2500,21 +2525,30 @@ async function computerMoveToShow(game: Game): Promise<MoveSteps | null> {
     return game.lastMoveSteps();
 }
 
-/** Ce qu'a fait l'ordinateur pendant son tour (sans durée de calcul). */
-function describeComputerTurn(game: Game): string {
+/** La ligne d'information après le tour de l'ordinateur, et le coup
+ * qu'elle cite (null s'il n'a pas joué de coup). */
+interface ComputerTurnLine {
+    readonly text: string;
+    readonly notation: MoveNotation | null;
+}
+
+/** Ce qu'a fait l'ordinateur pendant son tour (sans durée de calcul). Son
+ * coup s'écrit dans la notation du moteur, comme dans l'analyse. */
+async function describeComputerTurn(game: Game): Promise<ComputerTurnLine> {
     const last = game.events.at(-1);
     if (last?.type === "CubeOffered") {
-        return "";
+        return { text: "", notation: null };
     }
     const played = game.events.findLast((e) => e.type === "MovePlayed");
     if (played?.type !== "MovePlayed") {
-        return "";
+        return { text: "", notation: null };
     }
     const dice = rollBefore(game);
     if (played.halfMoves.length === 0) {
-        return TEXTS.computerCannotMove(dice);
+        return { text: TEXTS.computerCannotMove(dice), notation: null };
     }
-    return TEXTS.computerMoved(dice, formatHalfMoves(played.halfMoves));
+    const notation = await game.moveNotation(played.id);
+    return { text: TEXTS.computerMoved(dice, notation), notation };
 }
 
 /** Le résultat d'une partie finie, en deux parties : le titre du panneau

app/src/ui/match-texts.ts

@@ -57,7 +57,7 @@ export const MATCH_TEXTS = {
     advice: "Conseil du maître",
     adviceDetail: "Une ligne après chacun de vos coups",
     startGame: "Commencer la partie",
-    startMatch: (n: number) => `Commencer le match en ${n} points`,
+    startMatch: "Commencer le match",
     kept: "Vos choix sont gardés pour la prochaine fois.",
 
     // Score du match sur l'écran de jeu

app/src/ui/new-game-view.ts

@@ -200,9 +200,7 @@ export function createNewGameView(options: NewGameViewOptions): NewGameView {
             levelName.textContent = MATCH_TEXTS.levels[s.level].name;
             levelText.textContent = MATCH_TEXTS.levels[s.level].text;
             advice.setAttribute("aria-checked", String(s.masterAdvice));
-            start.textContent = isMatch
-                ? MATCH_TEXTS.startMatch(s.matchLength)
-                : MATCH_TEXTS.startGame;
+            start.textContent = isMatch ? MATCH_TEXTS.startMatch : MATCH_TEXTS.startGame;
             start.disabled = busy;
         },
         focus() {

app/src/ui/notation.ts

@@ -0,0 +1,34 @@
+// Un coup écrit dans la notation du moteur (« 24/22* 6/1 », « 8/4(2) »),
+// touchable vers sa fiche du glossaire : un débutant y apprend ce que
+// veulent dire l'étoile, « off », « bar » et « (2) ».
+//
+// Copyright (C) 2026 les auteurs d'Ustagammon.
+// Licence : GPLv3 ou ultérieure (voir LICENSE).
+
+import type { MoveNotation } from "../domain/game/engine.js";
+import { routeHash } from "./router.js";
+
+/** La fiche du glossaire de la notation (docs/glossaire/, sans .md). */
+export const NOTATION_TERM = "notation-des-coups";
+
+/**
+ * Remplace le contenu de parent par text, où la première occurrence de
+ * notation devient un lien vers la fiche « Notation des coups ». Sans
+ * notation dans le texte, le texte seul.
+ */
+export function showWithNotation(
+    parent: HTMLElement,
+    text: string,
+    notation: MoveNotation | null,
+): void {
+    const at = notation === null || notation === "" ? -1 : text.indexOf(notation);
+    if (notation === null || at < 0) {
+        parent.textContent = text;
+        return;
+    }
+    const link = document.createElement("a");
+    link.className = "notation";
+    link.href = routeHash({ screen: "glossary", term: NOTATION_TERM });
+    link.textContent = notation;
+    parent.replaceChildren(text.slice(0, at), link, text.slice(at + notation.length));
+}

app/tests/bear-off-input.test.ts

@@ -0,0 +1,230 @@
+// Saisie d'un coup de sortie demi-coup par demi-coup, sur le vrai moteur
+// WebAssembly : tout ordre de saisie que le moteur accepte doit être accepté
+// par la partie, même quand un début de coup forme déjà un coup complet.
+//
+// Défaut corrigé (2026-11-10) : avec 6-1 et des pions sur 6 et 1, 6/off
+// mène à la même position que le coup légal « 6/5/off » ; la partie le
+// tenait pour complet et refusait ensuite 1/off, alors que 1/off puis 6/off
+// passait.
+//
+// Copyright (C) 2026 les auteurs d'Ustagammon.
+// Licence : GPLv3 ou ultérieure (voir LICENSE).
+
+import assert from "node:assert/strict";
+import { test } from "node:test";
+import type { Engine } from "../src/domain/game/engine.js";
+import { Game } from "../src/domain/game/game.js";
+import { formatHalfMoves, type HalfMove } from "../src/domain/game/position.js";
+import { fixedDice, type Roll } from "../src/domain/game/roll.js";
+import { loadNodeEngine } from "./support/node-engine.js";
+
+// Le joueur, au trait, a un pion sur sa case 6 et un sur sa case 1 ;
+// l'ordinateur un sur sa case 1 et un sur sa case 2. Le cas signalé par
+// Pierre (#/position/BQAACAIAAAAAAA, « Jouer à partir d'ici »).
+const SIX_AND_ONE = "BQAACAIAAAAAAA";
+
+/**
+ * Position ID (format de gnubg) d'une fin de partie : les pions du joueur au
+ * trait sur ses cases 1 à 6 (player[i] : nombre de pions sur la case i + 1),
+ * l'ordinateur avec un pion sur sa case 1 et un sur sa case 2 ; les autres
+ * pions sont sortis. Outil de test seulement : chaque position produite est
+ * relue par le moteur, qui doit y retrouver ces pions.
+ */
+function bearOffPosition(player: readonly number[]): string {
+    const bits: number[] = [];
+    const side = (counts: readonly number[]) => {
+        for (let point = 0; point < 25; point++) {
+            for (let k = 0; k < (counts[point] ?? 0); k++) {
+                bits.push(1);
+            }
+            bits.push(0);
+        }
+    };
+    side([1, 1]); // l'adversaire d'abord, comme dans gnubg
+    side(player);
+    const bytes = new Uint8Array(10);
+    bits.forEach((bit, i) => {
+        if (bit === 1) {
+            bytes[i >> 3] = (bytes[i >> 3] ?? 0) | (1 << (i & 7));
+        }
+    });
+    return Buffer.from(bytes).toString("base64").slice(0, 14);
+}
+
+/** Une partie où le joueur, au trait dans position, vient de lancer roll. */
+async function rolled(engine: Engine, position: string, roll: Roll): Promise<Game> {
+    const game = Game.start(engine, {
+        dice: fixedDice(roll),
+        setup: { position, firstTurn: "player" },
+    });
+    await game.roll();
+    return game;
+}
+
+/** Toutes les permutations distinctes des demi-coups. */
+function orders(halfMoves: readonly HalfMove[]): HalfMove[][] {
+    if (halfMoves.length <= 1) {
+        return [[...halfMoves]];
+    }
+    const seen = new Set<string>();
+    const result: HalfMove[][] = [];
+    halfMoves.forEach((h, i) => {
+        const rest = [...halfMoves.slice(0, i), ...halfMoves.slice(i + 1)];
+        for (const tail of orders(rest)) {
+            const order = [h, ...tail];
+            const key = formatHalfMoves(order);
+            if (!seen.has(key)) {
+                seen.add(key);
+                result.push(order);
+            }
+        }
+    });
+    return result;
+}
+
+test("le cas signalé est bien celui que décrit le test", async () => {
+    const engine = await loadNodeEngine();
+    assert.equal(bearOffPosition([1, 0, 0, 0, 0, 1]), SIX_AND_ONE);
+    const board = await engine.board(SIX_AND_ONE, { value: 1, owner: "centered" });
+    assert.deepEqual(board.onRoll.points.slice(0, 6), [1, 0, 0, 0, 0, 1]);
+});
+
+test("6-1 en sortie : 6/off puis 1/off, comme 1/off puis 6/off", async () => {
+    const engine = await loadNodeEngine();
+    const allOff = (await engine.legalMoves(SIX_AND_ONE, [6, 1])).find(
+        (m) => m.notation === "6/off 1/off",
+    );
+    assert.ok(allOff, "le moteur propose 6/off 1/off");
+
+    // 6/off d'abord : la position est déjà celle d'un coup légal (6/5/off),
+    // mais le 1 reste jouable et le moteur l'accepte.
+    const six = await rolled(engine, SIX_AND_ONE, [6, 1]);
+    assert.equal(await six.playHalfMove({ from: 6, to: 0 }), true);
+    assert.equal(six.moveComplete, true);
+    assert.deepEqual(await six.nextHalfMoves(), [{ from: 1, to: 0 }]);
+    assert.equal(await six.playHalfMove({ from: 1, to: 0 }), true);
+    assert.equal(six.moveComplete, true);
+    assert.equal(six.displayedPosition, allOff.position);
+    assert.deepEqual(
+        six.diceToPlay.map((d) => d.used),
+        [true, true],
+    );
+    await six.confirmMove();
+    assert.equal(six.state.phase, "over");
+
+    // 1/off d'abord : pas encore complet, puis 6/off.
+    const one = await rolled(engine, SIX_AND_ONE, [6, 1]);
+    assert.equal(await one.playHalfMove({ from: 1, to: 0 }), true);
+    assert.equal(one.moveComplete, false);
+    assert.equal(await one.playHalfMove({ from: 6, to: 0 }), true);
+    assert.equal(one.displayedPosition, allOff.position);
+
+    // Et le coup 6/off seul (6/5/off) se valide toujours tel quel.
+    const alone = await rolled(engine, SIX_AND_ONE, [6, 1]);
+    assert.equal(await alone.playHalfMove({ from: 6, to: 0 }), true);
+    await alone.confirmMove();
+    assert.equal(alone.state.turn, "computer");
+});
+
+test("tous les dés joués, le moteur n'est plus interrogé", async () => {
+    // Le moteur de la page refuse plus de quatre demi-coups (erreur de la
+    // ligne de commande) : la partie ne doit pas en demander un cinquième
+    // après un double, ni un troisième après un jet simple.
+    const real = await loadNodeEngine();
+    const engine: Engine = {
+        ...real,
+        checkHalfMoves: (position, roll, halfMoves) => {
+            const dice = roll[0] === roll[1] ? 4 : 2;
+            if (halfMoves.length > dice) {
+                throw new Error(`${halfMoves.length} demi-coups pour ${dice} dés`);
+            }
+            return real.checkHalfMoves(position, roll, halfMoves);
+        },
+    };
+    const double = await rolled(engine, bearOffPosition([0, 0, 2, 2, 0, 0]), [2, 2]);
+    for (const h of [
+        { from: 4, to: 2 },
+        { from: 4, to: 2 },
+        { from: 3, to: 1 },
+        { from: 3, to: 1 },
+    ]) {
+        assert.equal(await double.playHalfMove(h), true);
+    }
+    assert.equal(double.moveComplete, true);
+    assert.deepEqual(await double.nextHalfMoves(), []);
+    assert.equal(await double.playHalfMove({ from: 2, to: 0 }), false);
+
+    const simple = await rolled(engine, SIX_AND_ONE, [6, 1]);
+    assert.equal(await simple.playHalfMove({ from: 1, to: 0 }), true);
+    assert.equal(await simple.playHalfMove({ from: 6, to: 0 }), true);
+    assert.deepEqual(await simple.nextHalfMoves(), []);
+});
+
+test("en sortie, tout ordre accepté par le moteur l'est par la partie", async () => {
+    const engine = await loadNodeEngine();
+    // Toutes les fins de partie d'un à trois pions dans le jan intérieur,
+    // et quelques-unes à quatre (doubles), avec les 21 jets.
+    const positions: number[][] = [];
+    for (let a = 0; a < 6; a++) {
+        positions.push([a]);
+        for (let b = a; b < 6; b++) {
+            positions.push([a, b]);
+            for (let c = b; c < 6; c++) {
+                positions.push([a, b, c]);
+            }
+        }
+    }
+    positions.push([0, 0, 0, 0], [1, 2, 3, 4], [5, 5, 4, 4], [0, 2, 4, 5], [3, 3, 3, 3]);
+    const rolls: Roll[] = [];
+    for (let a = 1; a <= 6; a++) {
+        for (let b = 1; b <= a; b++) {
+            rolls.push([a, b]);
+        }
+    }
+    const failures: string[] = [];
+    let checked = 0;
+    for (const pips of positions) {
+        const counts = [0, 0, 0, 0, 0, 0];
+        for (const p of pips) {
+            counts[p] = (counts[p] ?? 0) + 1;
+        }
+        const position = bearOffPosition(counts);
+        for (const roll of rolls) {
+            const moves = await engine.legalMoves(position, roll);
+            const game = await rolled(engine, position, roll);
+            for (const move of moves) {
+                for (const order of orders(move.halfMoves)) {
+                    // Le moteur doit accepter chaque début de cet ordre…
+                    let accepted = true;
+                    for (let i = 1; i <= order.length && accepted; i++) {
+                        accepted = (await engine.checkHalfMoves(position, roll, order.slice(0, i)))
+                            .valid;
+                    }
+                    if (!accepted) {
+                        continue;
+                    }
+                    // … et alors la partie aussi, jusqu'au coup complet.
+                    game.cancelHalfMoves();
+                    checked++;
+                    const label = `${position} ${roll.join("-")} ${formatHalfMoves(order)}`;
+                    for (const h of order) {
+                        const offered = (await game.nextHalfMoves()).some(
+                            (n) => n.from === h.from && n.to === h.to,
+                        );
+                        if (!offered || !(await game.playHalfMove(h))) {
+                            failures.push(`${label} : ${formatHalfMoves([h])} refusé`);
+                            break;
+                        }
+                    }
+                    if (game.pendingHalfMoves.length === order.length) {
+                        if (!game.moveComplete || game.displayedPosition !== move.position) {
+                            failures.push(`${label} : coup incomplet ou position différente`);
+                        }
+                    }
+                }
+            }
+        }
+    }
+    assert.ok(checked > 1000, `${checked} ordres vérifiés`);
+    assert.deepEqual(failures, []);
+});

app/tests/game-analysis.test.ts

@@ -30,7 +30,7 @@ import {
     withAnalysesOf,
 } from "../src/domain/game/events.js";
 import { Game } from "../src/domain/game/game.js";
-import { START_POSITION } from "../src/domain/game/position.js";
+import { formatHalfMoves, START_POSITION } from "../src/domain/game/position.js";
 import { emptyReview, REVIEW_VERSION } from "../src/domain/game/review.js";
 import { loadNodeEngine } from "./support/node-engine.js";
 import { playToTheEnd, seededDice } from "./support/play.js";
@@ -315,4 +315,30 @@ test("une partie complète analysée par le moteur, comme une partie d'avant 1d"
     // Le journal analysé se reprend : l'analyse fait partie du format.
     const resumed = Game.resume(engine, JSON.parse(JSON.stringify(analysed)));
     assert.deepEqual(resumed.journal.review, analysed.review);
+    // Chaque coup s'écrit pareil sur l'écran de jeu (« L'ordinateur a
+    // joué … », moveNotation) et dans l'analyse : la notation du moteur.
+    let compared = 0;
+    let rewritten = 0;
+    for (const move of moves) {
+        if (move.type !== "MovePlayed" || move.halfMoves.length === 0) {
+            continue;
+        }
+        const advice =
+            move.side === "computer"
+                ? analysed.review?.computer[move.id]
+                : analysed.advice?.[move.id];
+        if (advice?.kind !== "move") {
+            continue;
+        }
+        const notation = await resumed.moveNotation(move.id);
+        assert.equal(notation, advice.played.notation, `coup ${move.id}`);
+        compared++;
+        if (notation !== formatHalfMoves(move.halfMoves)) {
+            rewritten++;
+        }
+    }
+    assert.ok(compared > 5, `${compared} coups comparés`);
+    // La course finit en sortie : au moins un coup s'écrit autrement que
+    // ses demi-coups (« 6/off » pour « 6/2 2/off »…).
+    assert.ok(rewritten > 0, "aucun coup réécrit par le moteur");
 });

app/tests/steps/jouer-une-partie.steps.ts

@@ -476,6 +476,36 @@ Given("un joueur a sorti tous ses pions", async () => {
     assert.equal(await playAndConfirm("6/off 5/off"), true);
 });
 
+// ------------------------------------------------- Sortir dans tout ordre
+
+// Le joueur, au trait : un pion sur sa case 6, un sur sa case 1 ;
+// l'ordinateur un pion sur sa case 1 et un sur sa case 2.
+const SIX_AND_ONE = "BQAACAIAAAAAAA";
+
+Given("vous avez un pion sur la flèche 6 et un sur la flèche 1, avec le jet 6-1", async () => {
+    game = Game.start(engine, {
+        setup: { position: SIX_AND_ONE, firstTurn: "player" },
+        dice: fixedDice([6, 1]),
+    });
+    await game.roll();
+});
+
+Then(/^vous pouvez valider ou jouer encore (.+)$/, async (text: string) => {
+    assert.equal(accepted, true);
+    // 6/off seul mène à la même position que 6/5/off, un coup légal.
+    assert.equal(game.moveComplete, true);
+    assert.deepEqual(await game.nextHalfMoves(), parseHalfMoves(text));
+});
+
+Then("vos deux pions sont sortis", async () => {
+    assert.equal(accepted, true);
+    assert.equal(game.moveComplete, true);
+    const board = await game.displayedBoard();
+    assert.equal(board.player.off, 15);
+    await game.confirmMove();
+    assert.equal(game.state.phase, "over");
+});
+
 Then("le résultat indique le gagnant et les points gagnés", () => {
     // Gammon (l'ordinateur n'a sorti aucun pion), mais 1 point seulement :
     // règle Jacoby, le videau n'a pas bougé.

app/tests/tutorial.test.ts

@@ -174,6 +174,21 @@ test("le joueur peut revenir en arrière après un coup refusé", async () => {
     assert.equal(await practice.play({ from: 6, to: 5 }), "right");
 });
 
+test("en sortie, un coup déjà complet peut encore mener au coup attendu", async () => {
+    // Pions sur 6 et 1, jet 6-1 : 6/off seul est déjà un coup complet (même
+    // position que 6/5/off), mais le coup attendu sort les deux pions.
+    const engine = await loadNodeEngine();
+    const first = await MovePractice.start(engine, "BQAACAIAAAAAAA", [6, 1], ["6/off 1/off"]);
+    assert.equal(await first.play({ from: 6, to: 0 }), "continue");
+    assert.equal(await first.play({ from: 1, to: 0 }), "right");
+    const other = await MovePractice.start(engine, "BQAACAIAAAAAAA", [6, 1], ["6/off 1/off"]);
+    assert.equal(await other.play({ from: 1, to: 0 }), "continue");
+    assert.equal(await other.play({ from: 6, to: 0 }), "right");
+    // 6/5 puis 5/off : complet, mais ce n'est pas le coup attendu.
+    const wrong = await MovePractice.start(engine, "BQAACAIAAAAAAA", [6, 1], ["6/off 1/off"]);
+    assert.equal(await wrong.play({ from: 6, to: 5 }), "wrong");
+});
+
 test("la réponse au double de l'étape 8 est celle du moteur", async () => {
     const engine = await loadNodeEngine();
     for (const [name, screen] of screens()) {

docs/glossaire/README.md

@@ -59,6 +59,7 @@ exportée. `make test` vérifie le lien dans les deux sens : chaque fiche avec
 | [Match](match.md) | Match |
 | [Moteur](moteur.md) | Engine |
 | [Niveau de jeu](niveau-de-jeu.md) | Level |
+| [Notation des coups](notation-des-coups.md) | Move notation |
 | [Partie](partie.md) | Game |
 | [Partie enregistrée](partie-enregistree.md) | Saved game |
 | [Passer](passer.md) | Drop |

docs/glossaire/notation-des-coups.md

@@ -0,0 +1,27 @@
+---
+term: Notation des coups
+english: Move notation
+code: MoveNotation
+---
+# Notation des coups
+
+**En bref** : un coup s'écrit case de départ/case d'arrivée pour chaque pion, comme 13/7 ; une étoile signale un pion adverse frappé (24/22*), « off » un pion sorti (6/off), « bar » un pion qui rentre depuis la barre (bar/22), et (2) un déplacement fait deux fois avec un double (8/4(2)).
+
+Ustagammon écrit les coups comme GNU Backgammon, le moteur qui les calcule.
+Chaque joueur numérote les cases de son propre point de vue, de 1 (la case la
+plus proche de sa sortie) à 24 :
+
+- `13/7` : un pion part de la case 13 et arrive sur la case 7. Un coup de deux
+  dés compte en général deux déplacements, séparés par une espace :
+  `13/7 8/7`.
+- `24/22*` : l'étoile dit que le pion arrivé sur la 22 y a frappé un pion
+  seul de l'adversaire, qui part sur la barre.
+- `6/off` : le pion de la case 6 sort du plateau.
+- `bar/22` : un pion qui était sur la barre rentre sur la case 22.
+- `8/4(2)` : le même déplacement, fait deux fois. Avec un double, on joue
+  quatre fois le dé : `8/4(2) 6/2(2)` déplace deux pions de 8 à 4 et deux de
+  6 à 2.
+- `13/1*` : un seul pion qui avance avec ses deux dés s'écrit d'un trait,
+  de sa case de départ à sa case d'arrivée.
+
+Voir aussi : [Coup](coup.md), [Demi-coup](demi-coup.md), [Barre](barre.md), [Sortie](sortie.md), [Blot](blot.md)

docs/identite/charte/ecrans-etape-1.md

@@ -38,8 +38,8 @@ Ouvert depuis le menu, l'accueil et la fin de partie. Une seule page, sans
 3. **Pendant la partie** : interrupteur « Conseil du maître », sous-titre
    « Une ligne après chacun de vos coups ».
 4. **Barre d'action collée en bas** : un seul bouton principal, qui dit ce
-   qu'il lance (« Commencer la partie » ou « Commencer le match en 5
-   points »), et la mention « Vos choix sont gardés pour la prochaine fois. ».
+   qu'il lance (« Commencer la partie » ou « Commencer le match » ; choix
+   de Pierre du 2026-11-11, la longueur se lit déjà sur le bouton choisi), et la mention « Vos choix sont gardés pour la prochaine fois. ».
 
 Par défaut : partie libre, Intermédiaire, conseil activé. Fermer (croix en
 haut à gauche, ou retour du téléphone) ne change rien à la partie en cours.

docs/scenarios/jouer-un-match.feature

@@ -4,7 +4,9 @@ Fonctionnalité: Choisir sa partie et jouer un match
   L'écran « Nouvelle partie » s'ouvre depuis le menu, l'accueil et, à la
   fin d'une partie, par « Changer les réglages ». Vous y choisissez une partie libre ou un match en 3, 5, 7
   ou 11 points, le niveau de l'ordinateur, et si le maître commente vos
-  coups. Vos choix sont gardés pour la prochaine fois.
+  coups. Vos choix sont gardés pour la prochaine fois. « Commencer la
+  partie » (ou « Commencer le match ») lance aussitôt la partie, sur le
+  plateau, même juste après le bilan d'une partie finie.
 
   Scénario: Comment choisir le niveau de l'ordinateur ?
     Six niveaux, du Débutant, qui laisse passer des occasions, au Champion,

docs/scenarios/jouer-une-partie.feature

@@ -142,6 +142,24 @@ Fonctionnalité: Jouer une partie contre l'ordinateur
     Alors la partie s'arrête
     Et vous perdez la partie à sa valeur d'avant le double
 
+  @position:BQAACAIAAAAAAA
+  Scénario: Sortir ses pions dans l'ordre de son choix
+    Une fois tous vos pions dans les six dernières flèches, vous les
+    sortez dans l'ordre que vous voulez. Avec 6-1, un pion sur la flèche 6
+    et un sur la flèche 1 : sortez l'un puis l'autre, ou l'inverse. Si vous
+    ne sortez que le pion de la 6, « Jouer ce coup » apparaît déjà, car ce
+    pion a pu utiliser vos deux dés (6/5, puis 5/off). Touchez l'autre pion
+    pour le sortir aussi.
+
+    Étant donné que vous avez un pion sur la flèche 6 et un sur la flèche 1, avec le jet 6-1
+    Quand vous jouez 6/off
+    Alors vous pouvez valider ou jouer encore 1/off
+    Quand vous jouez 1/off
+    Alors vos deux pions sont sortis
+    Étant donné que vous avez un pion sur la flèche 6 et un sur la flèche 1, avec le jet 6-1
+    Quand vous jouez 1/off 6/off
+    Alors vos deux pions sont sortis
+
   Scénario: Comment se termine une partie ?
     La partie s'arrête dès qu'un joueur a sorti tous ses pions. Le panneau de
     fin dit qui gagne, et combien de points : la valeur du videau, doublée

tests/browser.sh

@@ -11,9 +11,12 @@
 # Le conseil du maître (tests/browser/maitre.mjs), captures dans
 # build/browser-shots/maitre/. Le bilan de fin de partie et l'écran
 # d'analyse (tests/browser/bilan.mjs), captures dans
-# build/browser-shots/bilan/.
+# build/browser-shots/bilan/. « Nouvelle partie » après une partie finie et
+# son bilan, par chaque entrée (tests/browser/nouvelle-partie.mjs), captures
+# dans build/browser-shots/nouvelle-partie/.
 #
-# BROWSERS=chromium et SCRIPTS=accueil (ou play, match, maitre, bilan)
+# BROWSERS=chromium et SCRIPTS=accueil (ou play, match, maitre, bilan,
+# nouvelle-partie)
 # restreignent le test.
 #
 # Outils : l'image de Playwright (navigateurs) et le paquet playwright,
@@ -27,7 +30,7 @@ cd "$(dirname "$0")/.."
 image="${PLAYWRIGHT_IMAGE:?lancer via make test-browser}"
 browsers="${BROWSERS:-chromium firefox}"
 # Les scripts à lancer (tests/browser/<nom>.mjs), tous par défaut.
-scripts="${SCRIPTS:-play accueil match maitre bilan}"
+scripts="${SCRIPTS:-play accueil match maitre bilan nouvelle-partie}"
 
 unset MAKEFLAGS MFLAGS MAKELEVEL
 make -s package >/dev/null
@@ -65,7 +68,7 @@ update_port="$(docker port "$update_container" 80/tcp | head -n1 | sed 's/.*://'
 rm -rf build/browser-shots
 mkdir -p build/browser-shots
 cp tests/browser/play.mjs tests/browser/accueil.mjs tests/browser/match.mjs tests/browser/recette.mjs \
-	tests/browser/maitre.mjs tests/browser/bilan.mjs "$tools/"
+	tests/browser/maitre.mjs tests/browser/bilan.mjs tests/browser/nouvelle-partie.mjs "$tools/"
 status=0
 for browser in $browsers; do
 	# Réseau de l'hôte : le site est sur 127.0.0.1. Le service worker
@@ -105,5 +108,13 @@ for browser in $browsers; do
 			-v "$PWD/$tools:/tools" -v "$PWD/build/browser-shots:/shots" -w /tools "$image" \
 			node bilan.mjs "http://localhost:$port/" "$browser" /shots || status=1
 	fi
+	if [[ " $scripts " == *" nouvelle-partie "* ]]; then
+		# « Nouvelle partie » après une partie finie et son bilan : la
+		# nouvelle partie tout de suite ; captures dans
+		# build/browser-shots/nouvelle-partie/.
+		docker run --rm --init --ipc=host --network host --user "$(id -u):$(id -g)" -e HOME=/tmp \
+			-v "$PWD/$tools:/tools" -v "$PWD/build/browser-shots:/shots" -w /tools "$image" \
+			node nouvelle-partie.mjs "http://localhost:$port/" "$browser" /shots || status=1
+	fi
 done
 exit "$status"

tests/browser/accueil.mjs

@@ -16,7 +16,7 @@
 
 import { readFileSync, writeFileSync, mkdirSync } from "node:fs";
 import { chromium, firefox } from "playwright";
-import { hiddenUnderActionBar } from "./recette.mjs";
+import { hiddenUnderActionBar, tutorialWidthProblems, tutorialWidths } from "./recette.mjs";
 
 const [base, browserName, shots, updateBase, updateDir] = process.argv.slice(2);
 const browserType = { chromium, firefox }[browserName];
@@ -171,6 +171,7 @@ async function checkTutorialView(page, name) {
                 return b.scrollHeight - b.clientHeight;
             })(),
             height: innerHeight,
+            width: innerWidth,
             buttons,
         };
     });
@@ -189,8 +190,13 @@ async function checkTutorialView(page, name) {
     }
     tutorialViews++;
     tutorialMinNumber = Math.min(tutorialMinNumber, view.minNumber);
+    // Largeurs du plateau et du texte, comparées d'une étape à l'autre à la
+    // fin du tutoriel (tutorialWidthProblems).
+    const widths = await tutorialWidths(page);
+    tutorialWidthViews.push({ name, size: `${view.width}x${view.height}`, ...widths });
 }
 let tutorialViews = 0;
+const tutorialWidthViews = [];
 let tutorialBodyScroll = { px: 0, where: "" };
 let tutorialMinNumber = Infinity;
 
@@ -331,6 +337,18 @@ async function playTouches(page, touches) {
     await until(page, "fin", () => location.hash === "#/tutoriel/fin");
     await page.click("#tutorial-next");
     await until(page, "première partie", () => location.hash === "#/" && window.__shown("game"));
+    if (full) {
+        // Les mesures, écran par écran, à côté des captures.
+        writeFileSync(`${dir}/tutoriel-largeurs.txt`, tutorialWidthViews.map((v) =>
+            `${v.size}\t${v.name}\tplateau ${v.board.toFixed(1)}\ttexte ${v.text.toFixed(1)}\tpage ${v.page}`)
+            .join("\n") + "\n");
+        const widthProblems = tutorialWidthProblems(tutorialWidthViews);
+        check(widthProblems.length === 0, `largeurs du tutoriel :\n  ${widthProblems.join("\n  ")}`);
+        const sizes = [...new Set(tutorialWidthViews.map((v) => v.size))];
+        log(`tutoriel : plateau de même largeur à chaque étape (${sizes.map((s) =>
+            `${s} : ${tutorialWidthViews.find((v) => v.size === s).board.toFixed(1)} px`).join(", ")}), ` +
+            "aucune page plus large que l'écran");
+    }
     log(`tutoriel : ${screens} écrans, gestes refusés puis justes sur les 4 écrans « à vous », fin` +
         (full ? ` ; recette sur ${tutorialViews} vues, numéros de ${tutorialMinNumber.toFixed(1)} px au moins, ` +
             `texte défilant au plus de ${tutorialBodyScroll.px} px${tutorialBodyScroll.px > 0 ? ` (${tutorialBodyScroll.where})` : ""}` : ""));

tests/browser/bilan.mjs

@@ -184,6 +184,15 @@ await until("feuille du maître", () => document.getElementById("explain-mine")
 await page.click("#explain-mine");
 const sheetLegend = await page.textContent("#explain-legend");
 check(sheetLegend.includes(" 6/off,"), `feuille du maître : ${sheetLegend}`);
+// Le coup y est un lien vers la fiche « Notation des coups ».
+const notationLink = await page.evaluate(() => {
+    const a = document.querySelector("#explain-legend a.notation");
+    return a === null ? null : { text: a.textContent, href: a.getAttribute("href") };
+});
+check(
+    notationLink?.text === "6/off" && notationLink.href === "#/glossaire/notation-des-coups",
+    `feuille du maître, lien de la notation : ${JSON.stringify(notationLink)}`,
+);
 await page.click("#explain-done");
 await until("feuille fermée", () => document.getElementById("explain-veil").hidden);
 // Le joueur passe.

tests/browser/match.mjs

@@ -194,7 +194,7 @@ await page.click("#new-game-match");
 await page.click("#new-game-length-3");
 await page.click("#new-game-level-beginner");
 s = await screen();
-check(s.match === "true" && s.lengthsShown && !s.jacobyShown && s.start === "Commencer le match en 3 points",
+check(s.match === "true" && s.lengthsShown && !s.jacobyShown && s.start === "Commencer le match",
     `match en 3 points : ${JSON.stringify(s)}`);
 check(s.level === "beginner" && s.reached === 1 && s.name === "Débutant", `Débutant : ${JSON.stringify(s)}`);
 check((await page.getAttribute("#new-game-crawford a", "href")) === "#/glossaire/regle-de-crawford",
@@ -254,7 +254,7 @@ await page.click("#menu-new-game");
 await until("écran « Nouvelle partie »", () => location.hash === "#/nouvelle-partie" &&
     !document.getElementById("new-game").hidden);
 s = await screen();
-check(s.match === "true" && s.level === "beginner" && s.start === "Commencer le match en 3 points",
+check(s.match === "true" && s.level === "beginner" && s.start === "Commencer le match",
     `choix retrouvés : ${JSON.stringify(s)}`);
 await page.click("#new-game-start");
 await until("match commencé", () => location.hash === "#/" && !document.body.classList.contains("busy"));

tests/browser/nouvelle-partie.mjs

@@ -0,0 +1,321 @@
+// nouvelle-partie.mjs -- après une partie finie et son bilan, « Nouvelle
+// partie » mène tout droit à la nouvelle partie, sur le plateau, avec les
+// réglages choisis, par chaque entrée vers #/nouvelle-partie : l'accueil
+// (l'application rouverte), le menu, « Changer les réglages » du bilan.
+// Dans un vrai navigateur sans écran (Playwright), sur le site servi par
+// l'image de production.
+//
+// Copyright (C) 2026 les auteurs d'Ustagammon.
+// Licence : GPLv3 ou ultérieure (voir LICENSE).
+//
+// Usage : node nouvelle-partie.mjs <adresse du site> <chromium|firefox> <dossier des captures>
+// Lancé par tests/browser.sh. Défaut signalé par un joueur : « tu fais
+// nouvelle partie […] tu te retrouves sur le résultat du match précédent et
+// tu dois cliquer à nouveau sur nouvelle partie ». Chaque partie finie est
+// une fin de course courte, partie d'un lien de position avec des dés
+// imposés, comme dans bilan.mjs. Vérifie aussi le libellé du bouton
+// (« Commencer la partie », « Commencer le match ») et que le coup de
+// l'ordinateur, sur la ligne d'information, mène à la fiche « Notation des
+// coups ». Captures (Chromium) dans <dossier des captures>/nouvelle-partie/,
+// en 412×915 et 915×412.
+
+import { mkdirSync } from "node:fs";
+import { chromium, firefox } from "playwright";
+import { hiddenUnderActionBar } from "./recette.mjs";
+
+const [base, browserName, shots] = process.argv.slice(2);
+const browserType = { chromium, firefox }[browserName];
+if (!base || !browserType || !shots) {
+    console.error("usage : node nouvelle-partie.mjs <adresse> <chromium|firefox> <dossier des captures>");
+    process.exit(2);
+}
+const full = browserName === "chromium";
+const dir = `${shots}/nouvelle-partie`;
+mkdirSync(dir, { recursive: true });
+const PORTRAIT = { width: 412, height: 915 };
+const LANDSCAPE = { width: 915, height: 412 };
+// Le joueur au trait : un pion sur 6, un sur 1 ; l'ordinateur : un sur 1,
+// un sur 2. Le joueur joue 6/5/off, l'ordinateur double, le joueur passe.
+const BEAROFF = "BQAACAIAAAAAAA";
+
+const problems = [];
+const log = (text) => console.log(`[${browserName}] ${text}`);
+const sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
+let captures = 0;
+
+function check(condition, message) {
+    if (!condition) {
+        throw new Error(message);
+    }
+}
+
+const browser = await browserType.launch();
+const context = await browser.newContext({
+    viewport: PORTRAIT,
+    deviceScaleFactor: 1,
+    locale: "fr-FR",
+    reducedMotion: "reduce",
+});
+await context.addInitScript(() => {
+    // Les dés imposés d'abord (un dé par valeur), puis une graine fixe.
+    window.__dice = [];
+    let state = 7;
+    Math.random = () => {
+        const die = window.__dice.shift();
+        if (die !== undefined) {
+            return (die - 0.5) / 6;
+        }
+        state = (state * 1103515245 + 12345) % 2147483648;
+        return state / 2147483648;
+    };
+    window.__csp = [];
+    document.addEventListener("securitypolicyviolation", (e) =>
+        window.__csp.push(`${e.effectiveDirective} ${e.blockedURI}`),
+    );
+});
+const page = await context.newPage();
+page.on("pageerror", (error) => problems.push(`erreur de la page : ${error.message}`));
+page.on("console", (message) => {
+    if (message.type() === "error") {
+        problems.push(`console : ${message.text()}`);
+    }
+});
+
+/** Attend une condition dans la page (sans page.waitForFunction, qui passe
+ * par eval, interdit par la politique de sécurité du site). */
+async function until(what, fn, arg, ms = 120_000) {
+    for (let waited = 0; waited < ms; waited += 100) {
+        if (await page.evaluate(fn, arg)) {
+            return;
+        }
+        await sleep(100);
+    }
+    await page.screenshot({ path: `${dir}/${browserName}-bloque.png` }).catch(() => {});
+    throw new Error(`attente trop longue : ${what} (adresse ${await page.evaluate(() => location.hash)})`);
+}
+
+const idle = () => until("écran libre", () => !document.body.classList.contains("busy"));
+
+/** Une capture en portrait et en paysage (Chromium seulement), après la
+ * règle de la recette : rien d'interactif sous une barre d'action. */
+async function capture(name) {
+    if (!full) {
+        return;
+    }
+    for (const size of [PORTRAIT, LANDSCAPE]) {
+        await page.setViewportSize(size);
+        await sleep(300);
+        const hidden = await hiddenUnderActionBar(page);
+        check(
+            hidden.length === 0,
+            `${name} ${size.width}x${size.height} : caché sous la barre d'action : ${hidden.join(", ")}`,
+        );
+        await page.screenshot({ path: `${dir}/${name}-${size.width}x${size.height}.png` });
+        captures++;
+    }
+    await page.setViewportSize(PORTRAIT);
+    await sleep(300);
+}
+
+/** Une partie finie et son bilan à l'écran : une fin de course depuis un
+ * lien de position, 6/5/off, puis le double de l'ordinateur passé. Renvoie
+ * l'identifiant de la partie. */
+async function finishedGameWithSummary() {
+    await page.goto(`${base}#/position/${encodeURIComponent(BEAROFF)}`);
+    await until("position lue", () => {
+        const play = document.getElementById("position-play");
+        return !play.hidden && !play.disabled;
+    });
+    await page.click("#position-play");
+    await until(
+        "partie commencée",
+        () =>
+            location.hash === "#/" &&
+            !document.body.classList.contains("busy") &&
+            !document.getElementById("roll").hidden,
+    );
+    await page.evaluate(() => window.__dice.push(6, 1));
+    await page.click("#roll");
+    await idle();
+    for (const [from, to] of [
+        ["p6", "p5"],
+        ["p5", "off-player"],
+    ]) {
+        await page.click(`#board .hit[data-place="${from}"]`);
+        await idle();
+        const land = page.locator(`#board .hit.can-land[data-place="${to}"]`);
+        if ((await land.count()) > 0) {
+            await land.click();
+            await idle();
+        }
+    }
+    await page.click("#confirm");
+    await until("double de l'ordinateur", () => !document.getElementById("drop").hidden);
+    await page.click("#drop");
+    await until(
+        "bilan de la partie finie",
+        () =>
+            /^#\/parties\/[a-z0-9-]+\/bilan$/.test(location.hash) &&
+            document.getElementById("summary")?.dataset.ready === "true",
+    );
+    return page.evaluate(() => location.hash.split("/")[2]);
+}
+
+/** Choisit les réglages sur l'écran « Nouvelle partie », vérifie le libellé
+ * du bouton, puis commence. */
+async function chooseAndStart(choice, shot) {
+    await until(
+        "écran « Nouvelle partie »",
+        () =>
+            location.hash === "#/nouvelle-partie" &&
+            !document.getElementById("new-game").hidden &&
+            !document.getElementById("new-game-start").disabled,
+    );
+    await page.click(choice.match ? "#new-game-match" : "#new-game-free");
+    if (choice.match) {
+        await page.click(`#new-game-length-${choice.length}`);
+    }
+    await page.click(`#new-game-level-${choice.level}`);
+    const label = await page.textContent("#new-game-start");
+    const expected = choice.match ? "Commencer le match" : "Commencer la partie";
+    check(label === expected, `bouton : « ${label} », attendu « ${expected} »`);
+    if (shot) {
+        await capture("1-nouvelle-partie");
+    }
+    await page.click("#new-game-start");
+}
+
+/** La nouvelle partie est à l'écran, sur le plateau, avec les réglages
+ * choisis ; ni le bilan ni le panneau de fin de l'ancienne partie, même un
+ * peu plus tard. */
+async function checkNewGame(entry, oldId, choice) {
+    await until(
+        `${entry} : partie commencée`,
+        () => location.hash === "#/" && !document.body.classList.contains("busy"),
+    );
+    // Le défaut apparaissait juste après : l'adresse passait au bilan de
+    // l'ancienne partie. On regarde pendant deux secondes.
+    for (let waited = 0; waited < 2000; waited += 100) {
+        const s = await page.evaluate(() => ({
+            hash: location.hash,
+            summary: !document.getElementById("summary-veil").hidden,
+            panel: !document.getElementById("panel-veil").hidden,
+            board: !document.getElementById("game").hidden,
+            newGame: !document.getElementById("new-game").hidden,
+        }));
+        check(
+            s.hash === "#/" && !s.summary && !s.panel && s.board && !s.newGame,
+            `${entry} : la nouvelle partie n'est pas à l'écran (ancienne partie ${oldId}) : ${JSON.stringify(s)}`,
+        );
+        await sleep(100);
+    }
+    await idle();
+    const shown = await page.evaluate(() => ({
+        line: document.getElementById("match-line").textContent,
+        lineShown: !document.getElementById("match-line").hidden,
+        level: JSON.parse(localStorage.getItem("ustagammon.settings") ?? "{}").level,
+        over: document.getElementById("again").hidden === false,
+    }));
+    check(!shown.over, `${entry} : la partie à l'écran est finie`);
+    check(shown.level === choice.level, `${entry} : niveau ${shown.level}`);
+    if (choice.match) {
+        check(
+            shown.lineShown && shown.line === `Match en ${choice.length} points`,
+            `${entry} : ligne du match « ${shown.line} »`,
+        );
+    } else {
+        check(!shown.lineShown, `${entry} : un match au lieu d'une partie libre`);
+    }
+    log(`${entry} : nouvelle partie directe (${choice.match ? `match en ${choice.length}` : "partie libre"}, ${choice.level})`);
+}
+
+// --------------------------- 1. L'application rouverte, puis l'accueil
+
+let oldId = await finishedGameWithSummary();
+// L'application rouverte : sans adresse, elle ouvre l'accueil.
+await page.goto(base);
+await until(
+    "accueil",
+    () =>
+        location.hash === "#/accueil" &&
+        !document.getElementById("home-new").hidden &&
+        !document.getElementById("home-new").disabled,
+);
+await page.click("#home-new");
+let choice = { match: true, length: 3, level: "beginner" };
+await chooseAndStart(choice, true);
+await checkNewGame("accueil", oldId, choice);
+await capture("2-partie-demarree");
+
+// Le coup de l'ordinateur, sur la ligne d'information, mène à la fiche
+// « Notation des coups ». On joue jusqu'à ce qu'il ait joué un coup.
+for (let actions = 0; ; actions++) {
+    check(actions < 200, "l'ordinateur ne joue pas de coup");
+    const link = await page.evaluate(() => document.querySelector("#info a.notation")?.href ?? null);
+    if (link !== null) {
+        check(link.endsWith("#/glossaire/notation-des-coups"), `lien de la notation : ${link}`);
+        break;
+    }
+    const what = await page.evaluate(() => {
+        const usable = (id) => {
+            const b = document.getElementById(id);
+            return !b.hidden && !b.disabled;
+        };
+        for (const id of ["take", "skip", "confirm", "roll"]) {
+            if (usable(id)) {
+                return `#${id}`;
+            }
+        }
+        if (document.querySelector("#board .hit.can-land")) {
+            return "#board .hit.can-land";
+        }
+        return document.querySelector("#board .hit.can-move") ? "#board .hit.can-move" : null;
+    });
+    if (what === null) {
+        await sleep(100);
+        continue;
+    }
+    await page.locator(what).first().click();
+    await idle();
+}
+await page.click("#info a.notation");
+await until(
+    "fiche « Notation des coups »",
+    () =>
+        location.hash === "#/glossaire/notation-des-coups" &&
+        document.getElementById("glossaire-notation-des-coups") !== null,
+);
+await page.goBack();
+await until("retour à la partie", () => location.hash === "#/");
+log("ligne de l'ordinateur : la notation mène à sa fiche");
+
+// --------------------------------- 2. L'application rouverte sur le menu
+
+oldId = await finishedGameWithSummary();
+await page.goto(`${base}#/menu`);
+await until("menu", () => !document.getElementById("menu-veil").hidden);
+await page.click("#menu-new-game");
+choice = { match: false, level: "amateur" };
+await chooseAndStart(choice, false);
+await checkNewGame("menu", oldId, choice);
+
+// ------------------------------- 3. « Changer les réglages » du bilan
+
+oldId = await finishedGameWithSummary();
+await page.click("#summary-settings");
+choice = { match: true, length: 5, level: "intermediate" };
+await chooseAndStart(choice, false);
+await checkNewGame("bilan, « Changer les réglages »", oldId, choice);
+
+const csp = await page.evaluate(() => window.__csp);
+for (const violation of csp) {
+    problems.push(`politique de sécurité : ${violation}`);
+}
+await browser.close();
+if (problems.length > 0) {
+    for (const problem of problems) {
+        console.error(`[${browserName}] ${problem}`);
+    }
+    process.exit(1);
+}
+log(`nouvelle partie : tout est conforme (${captures} captures)`);

tests/browser/play.mjs

@@ -1193,6 +1193,12 @@ for (let actions = 0; ; actions++) {
         tracesSeen++;
         if (!moments.has("coup-ordinateur")) {
             moments.add("coup-ordinateur");
+            // La ligne du dernier coup (portrait seulement : en paysage, le
+            // plateau occupe tout l'écran), dans la notation du moteur.
+            const played = (await page.textContent("#info")) ?? "";
+            check(/^L'ordinateur a joué \d-\d : \S.*\.$/.test(played),
+                `coup de l'ordinateur mal écrit : « ${played} »`);
+            log(`coup de l'ordinateur : « ${played} »`);
             await review("4-coup-ordinateur");
         }
         if (replays < 2) {

tests/browser/recette.mjs

@@ -98,3 +98,72 @@ export async function hiddenUnderActionBar(target) {
         return hidden;
     });
 }
+
+/**
+ * Les largeurs d'un écran du tutoriel, en px CSS : le plateau, la colonne
+ * de texte, et la largeur de la page (scrollWidth) face à celle de l'écran.
+ * Une page plus large que l'écran défile de côté ; sur un téléphone, Chrome
+ * la dézoome pour la montrer en entier, et tout l'écran paraît rétréci.
+ */
+export async function tutorialWidths(target) {
+    return target.evaluate(() => {
+        const width = (selector) => {
+            const el = document.querySelector(selector);
+            return el === null ? 0 : el.getBoundingClientRect().width;
+        };
+        const page = document.scrollingElement;
+        // Le plus à droite des descendants du tutoriel, pour nommer le
+        // coupable d'un débordement.
+        let widest = { what: "", right: 0 };
+        for (const el of document.querySelectorAll("#tutorial *")) {
+            const r = el.getBoundingClientRect();
+            if (r.width > 0 && r.right > widest.right) {
+                const name = el.id
+                    ? `#${el.id}`
+                    : `${el.tagName.toLowerCase()}${[...el.classList].map((c) => `.${c}`).join("")}`;
+                widest = { what: name, right: r.right };
+            }
+        }
+        return {
+            board: width("#tutorial-board"),
+            text: width("#tutorial .tutorial-body"),
+            page: Math.max(page.scrollWidth, document.body.scrollWidth),
+            screen: innerWidth,
+            widest,
+        };
+    });
+}
+
+/**
+ * Règle de la recette : pour une taille d'écran donnée, le plateau du
+ * tutoriel a la même largeur à toutes les étapes, et aucune page n'est plus
+ * large que l'écran. views : [{ name, size, board, text, page, screen,
+ * widest }]. Renvoie la liste des écarts, décrits (vide si tout va bien).
+ */
+export function tutorialWidthProblems(views) {
+    const problems = [];
+    const bySize = new Map();
+    for (const v of views) {
+        bySize.set(v.size, [...(bySize.get(v.size) ?? []), v]);
+        if (v.page > v.screen + 0.5) {
+            problems.push(
+                `${v.name} en ${v.size} : page de ${v.page} px pour ${v.screen} px ` +
+                    `(le plus à droite : ${v.widest.what}, ${Math.round(v.widest.right)} px)`,
+            );
+        }
+    }
+    for (const [size, list] of bySize) {
+        const widths = list.map((v) => v.board);
+        const min = Math.min(...widths);
+        const max = Math.max(...widths);
+        if (max - min > 0.5) {
+            const odd = list
+                .filter((v) => Math.abs(v.board - max) > 0.5)
+                .map((v) => `${v.name} ${v.board.toFixed(1)}`);
+            problems.push(
+                `${size} : plateau de ${min.toFixed(1)} à ${max.toFixed(1)} px (${odd.join(", ")})`,
+            );
+        }
+    }
+    return problems;
+}

tests/test_engine.sh

@@ -205,6 +205,17 @@ attendre_demi_coups "true false /38AAAAgAAAAAA" "$course" 65 "5/off"
 # Course, jet 21 : il faut jouer les deux dés.
 attendre_demi_coups "false false " "$course" 21 "6/3"
 attendre_demi_coups "true true /38AAAAkAAAAAA" "$course" 21 "6/5 5/3"
+# Sortie avec 6-1, pions sur 6 et 1 (BQAACAIAAAAAAA) : gnubg donne deux
+# coups légaux, « 6/off 1/off » et « 6/off » (6/5/off, qui laisse le pion
+# sur 1). 6/off seul mène déjà à la position de ce second coup (complet),
+# mais 1/off reste permis ensuite : les deux ordres mènent à « tout sorti ».
+sortie_61=BQAACAIAAAAAAA
+grep -qF '"move": "6/off 1/off"' <<<"$($cli legal "$sortie_61" "$libre_j0" 61)" \
+	|| echouer "sortie 6-1 : coup légal « 6/off 1/off » attendu"
+attendre_demi_coups "true true BQAACAAAAAAAAA" "$sortie_61" 61 "6/off"
+attendre_demi_coups "true true BQAAAAAAAAAAAA" "$sortie_61" 61 "6/off 1/off"
+attendre_demi_coups "true false BQAAAAEAAAAAAA" "$sortie_61" 61 "1/off"
+attendre_demi_coups "true true BQAAAAAAAAAAAA" "$sortie_61" 61 "1/off 6/off"
 # Aucun coup possible : rien n'est valide.
 attendre_demi_coups "false false " 27YBBwAcz8EDQA 66
 attendre_erreur usage halfmoves "$depart" 31 "8-5"

web/app.css

@@ -295,6 +295,15 @@ a {
   flex-direction: column;
 }
 
+/* Les pages sont des éléments de la colonne flexible #screen. Leurs marges
+ * automatiques les centrent, mais annulent leur étirement en largeur : sans
+ * largeur explicite, une page au contenu court se réduit à la largeur de ce
+ * contenu (le plateau de l'étape 6 « à vous » du tutoriel passait de 396 à
+ * 300 px en 412 × 915). Leur max-width les borne toujours. */
+.screen > .page {
+  width: 100%;
+}
+
 .spacer {
   flex: 1;
 }