Recette design : tutoriel en paysage, sens du jeu, bandeau de mise à jour

- Sens du jeu (étape 2) : le tracé passe sous les pions et sous les
  numéros des flèches ; liseré ivoire de 8 px, points de 4 px à l'écran.
- Tutoriel en paysage : plateau à gauche sur toute la hauteur (géométrie
  du jeu en paysage, colonne gauche du cadre), colonne à droite avec la
  barre de progression, le titre, le texte, la consigne et les boutons ;
  seul le texte peut défiler. Tient en 915x412 et 844x320.
- Recette automatique étendue au tutoriel : numéros d'au moins 12 px,
  page sans défilement et boutons en vue en paysage, captures en 844x320.
- Boutons du videau « Prendre » et « Passer », lien « Quitter ».
- Bandeau « Nouvelle version prête. » en bas, au-dessus de la barre
  d'actions, seulement entre deux tours (betweenTurns, testé).
- Test des adresses : le lien Aide est lu au moment du toucher, la carte
  du terme ouvert est mesurée sous la barre de l'aide.

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

app/tests/steps/regler-l-application.steps.ts

@@ -20,7 +20,7 @@ import { memoryStorage } from "../../src/storage/open-library.js";
 import { BANNER_MS } from "../../src/ui/app.js";
 import { createHaptics } from "../../src/ui/haptics.js";
 import { nextTheme, parseSettings, type Settings } from "../../src/ui/settings.js";
-import { updateBannerShown } from "../../src/ui/updates.js";
+import { betweenTurns, updateBannerShown } from "../../src/ui/updates.js";
 import { loadNodeEngine } from "../support/node-engine.js";
 
 setDefaultTimeout(30_000);
@@ -168,23 +168,34 @@ Then("il passe à clair, puis à sombre, puis revient à automatique", () => {
 // ------------------------------------------------------------ Mise à jour
 
 // Le bandeau dépend de deux choses : une version attend (le service worker
-// l'a installée), et aucun coup n'est en cours de saisie. La partie est
-// celle du domaine, sur le vrai moteur.
+// l'a installée), et la partie est entre deux tours. La partie est celle du
+// domaine, sur le vrai moteur.
 let updateAvailable = false;
 
 Given("une nouvelle version d'Ustagammon est disponible", () => {
     updateAvailable = true;
 });
 
-Given("vous avez déjà déplacé un pion de votre coup", async () => {
+const shownNow = (otherBanner = false) =>
+    updateBannerShown(
+        updateAvailable,
+        betweenTurns(game.state.phase, game.pendingHalfMoves.length),
+        otherBanner,
+    );
+
+Given("vous avez des dés à jouer", () => {
     // Jet d'ouverture 3-1 : vous commencez.
     game = Game.start(engine, { dice: fixedDice([3, 1, 6, 4, 5, 2]), ply: 0 });
     assert.equal(game.state.turn, "player");
+    assert.equal(game.state.phase, "moving");
+});
+
+When("vous déplacez un pion de votre coup", async () => {
     assert.ok(await game.playHalfMove({ from: 8, to: 5 }));
 });
 
 Then("l'application ne vous propose pas encore de mettre à jour", () => {
-    assert.ok(!updateBannerShown(updateAvailable, game.pendingHalfMoves.length > 0, false));
+    assert.ok(!shownNow());
 });
 
 When("vous avez joué votre coup", async () => {
@@ -193,7 +204,7 @@ When("vous avez joué votre coup", async () => {
 });
 
 Then("l'application vous propose de mettre à jour", () => {
-    assert.ok(updateBannerShown(updateAvailable, game.pendingHalfMoves.length > 0, false));
+    assert.ok(shownNow());
     // Jamais par-dessus le bandeau « Reprendre l'ancienne ».
-    assert.ok(!updateBannerShown(updateAvailable, false, true));
+    assert.ok(!shownNow(true));
 });