diff --git a/.beads/interactions.jsonl b/.beads/interactions.jsonl index 6a34911..d0920a8 100644 --- a/.beads/interactions.jsonl +++ b/.beads/interactions.jsonl @@ -46,3 +46,4 @@ {"id":"int-cc87d51843f7ee62beb6445939aa30d5","kind":"field_change","created_at":"2026-09-13T06:35:52.804580049Z","actor":"Shinuwa","issue_id":"sokko-g-zsd","extra":{"field":"status","new_value":"open","old_value":"in_progress"}} {"id":"int-e554bed2958d709f2965a55fea9aa956","kind":"field_change","created_at":"2026-09-13T06:53:17.211928645Z","actor":"Shinuwa","issue_id":"sokko-g-zsd","extra":{"field":"status","new_value":"open","old_value":"in_progress"}} {"id":"int-6f399629fa8cc8212d36ca21853eaa52","kind":"field_change","created_at":"2026-09-13T17:46:00.430152831Z","actor":"Shinuwa","issue_id":"sokko-g-zsd","extra":{"field":"status","new_value":"open","old_value":"in_progress"}} +{"id":"int-3823a391b02ae7a3d58956b24c10e998","kind":"field_change","created_at":"2026-09-13T18:43:29.457174095Z","actor":"Shinuwa","issue_id":"sokko-g-zsd","extra":{"field":"status","new_value":"open","old_value":"in_progress"}} diff --git a/README.md b/README.md index c754b66..bb15354 100644 --- a/README.md +++ b/README.md @@ -61,13 +61,22 @@ npm run check Cette commande vérifie la configuration Node/Vite, lance les tests, puis exécute le build React. -Pour inclure les parcours navigateur, lancer `npm run check:full`. Les deux -validations sont exécutées successivement pour éviter la concurrence avec le build. +Pour inclure les parcours navigateur, lancer `npm run check:full`. Le check, les +E2E de développement et les E2E de production sont exécutés successivement pour +éviter la concurrence avec le build. La suite E2E utilise deux workers par défaut pour limiter la contention lors du chargement initial des outils par Vite. Le parallélisme reste ajustable avec `npm run test:e2e -- --workers=4`. Les traces des tests en échec sont conservées dans `test-results` et consultables depuis le rapport Playwright. +`npm run test:e2e:production` reconstruit l'application puis teste les comportements +propres à la production, notamment la visibilité de la prise en main. Cette suite +utilise temporairement `127.0.0.1:4173` ; le port doit être libre, aucune instance +existante n'est réutilisée. Le navigateur est isolé des données personnelles et +le serveur est fermé à la fin. Ses diagnostics sont conservés séparément dans +`test-results/production` et `playwright-report/production`. La suite habituelle +`npm run test:e2e` reste sur Vite en développement et exclut ces scénarios. + L'application est enveloppée dans `StrictMode` : en développement (y compris les E2E sur Vite), React rejoue certains rendus et cycles d'effets pour détecter les effets de bord et les nettoyages manquants. Ces contrôles supplémentaires ne diff --git a/docs/FEATURE_CHECKLIST.md b/docs/FEATURE_CHECKLIST.md index e587465..3b63b36 100644 --- a/docs/FEATURE_CHECKLIST.md +++ b/docs/FEATURE_CHECKLIST.md @@ -79,3 +79,9 @@ Le check doit passer avant de pousser : - génération des index de listes ; - tests Node ; - build de production. + +`npm run check:full` ajoute les parcours navigateur de développement puis de +production. Pour la prise en main de la home, vérifier sa présence sans toolbox, +sa disparition après création en production, son retour après suppression de la +dernière toolbox et la persistance de ces états après rechargement. Elle reste +visible en développement et sur la page À propos. diff --git a/e2e/onboarding.spec.js b/e2e/onboarding.spec.js index 4b01523..08a1d39 100644 --- a/e2e/onboarding.spec.js +++ b/e2e/onboarding.spec.js @@ -71,6 +71,10 @@ test("home onboarding creates the initial tools and starts the tutorial", async await expect(page.locator('[data-module-type="memos"]')).toBeVisible(); await expect(page.locator('[data-module-type="links"]')).toBeVisible(); await expect(page.locator(".toolbox-tutorial-count")).toHaveText(/^1\//); + await page.goto("/#/"); + await expect(page.getByRole("region", { name: content.title, exact: true })).toBeVisible(); + await page.reload(); + await expect(page.getByRole("region", { name: content.title, exact: true })).toBeVisible(); }); test("about reuses onboarding without creation and exposes tool examples and destinations", async ({ page }) => { diff --git a/e2e/production/onboarding.spec.js b/e2e/production/onboarding.spec.js new file mode 100644 index 0000000..9be8dc4 --- /dev/null +++ b/e2e/production/onboarding.spec.js @@ -0,0 +1,41 @@ +// Rôle : vérifie la visibilité de la prise en main sur le vrai build après création et suppression persistées. +import { test, expect } from "@playwright/test"; +import { readFile } from "node:fs/promises"; + +const site = JSON.parse(await readFile("website/public/data/site.json", "utf8")); + +test("production home hides onboarding after creation and restores it after deleting the last toolbox", async ({ page }) => { + const errors = []; + page.on("pageerror", (error) => errors.push(error.message)); + await page.goto("/"); + const onboarding = page.getByRole("region", { name: site.home.onboarding.title, exact: true }); + await expect(onboarding).toBeVisible(); + await expect(page.locator('script[type="module"][src^="/assets/"]')).toHaveCount(1); + await expect(page.locator('script[src*="/@vite/client"]')).toHaveCount(0); + await onboarding.getByRole("button", { name: site.home.onboarding.primaryAction, exact: true }).click(); + const dialog = page.getByRole("dialog"); + await dialog.getByRole("textbox", { name: "Nom", exact: true }).fill("Production toolbox"); + await dialog.getByRole("button", { name: "Créer", exact: true }).click(); + await expect(page).toHaveURL(/#\/toolbox\//); + await expect(page.locator('[data-module-type="memos"]')).toBeVisible(); + await expect(page.locator('[data-module-type="links"]')).toBeVisible(); + + await page.goto("/#/"); + await expect(page.getByRole("heading", { name: site.home.hero.title, exact: true })).toBeVisible(); + await expect(onboarding).toHaveCount(0); + await page.reload(); + await expect(page.getByRole("heading", { name: site.home.hero.title, exact: true })).toBeVisible(); + await expect(onboarding).toHaveCount(0); + await page.goto("/#/about"); + await expect(onboarding).toBeVisible(); + + await page.goto("/#/toolboxes"); + await page.getByRole("button", { name: "Supprimer Production toolbox", exact: true }).click(); + await page.getByRole("dialog").getByRole("button", { name: "Supprimer", exact: true }).click(); + await expect(page.locator(".toolbox-card")).toHaveCount(0); + await page.goto("/#/"); + await expect(onboarding).toBeVisible(); + await page.reload(); + await expect(onboarding).toBeVisible(); + expect(errors).toEqual([]); +}); diff --git a/package.json b/package.json index c6b9ac6..739ec8e 100644 --- a/package.json +++ b/package.json @@ -11,9 +11,10 @@ "lists:index": "node scripts/generate-list-indexes.mjs", "lint": "eslint .", "check": "node --check server.mjs && node --check vite.config.js && npm run lint && npm run lists:index && npm test && npm run build", - "check:full": "npm run check && npm run test:e2e", + "check:full": "npm run check && npm run test:e2e && npm run test:e2e:production", "test": "node --test", "test:e2e": "playwright test", + "test:e2e:production": "npm run build && playwright test --config playwright.production.config.js", "profile:toolboxes": "npm run build && node scripts/profile-toolbox-loading.mjs" }, "dependencies": { diff --git a/playwright.config.js b/playwright.config.js index 180225e..9629172 100644 --- a/playwright.config.js +++ b/playwright.config.js @@ -3,6 +3,7 @@ import { defineConfig, devices } from "@playwright/test"; export default defineConfig({ testDir: "./e2e", + testIgnore: "**/production/**", fullyParallel: true, // Le serveur Vite partagé compile les outils lazy à la première visite. workers: 2, diff --git a/playwright.production.config.js b/playwright.production.config.js new file mode 100644 index 0000000..6a2e0f7 --- /dev/null +++ b/playwright.production.config.js @@ -0,0 +1,21 @@ +// Rôle : vérifie le build de production sans réutiliser une instance Vite de développement. +import { defineConfig, devices } from "@playwright/test"; + +export default defineConfig({ + testDir: "./e2e/production", + workers: 1, + outputDir: "test-results/production", + reporter: [["list"], ["html", { open: "never", outputFolder: "playwright-report/production" }]], + use: { + baseURL: "http://127.0.0.1:4173", + trace: "retain-on-failure", + screenshot: "only-on-failure" + }, + webServer: { + command: "npm run preview -- --host 127.0.0.1 --port 4173 --strictPort", + url: "http://127.0.0.1:4173", + reuseExistingServer: false, + timeout: 120000 + }, + projects: [{ name: "chromium-production", use: { ...devices["Desktop Chrome"] } }] +}); diff --git a/tests/static-app.test.mjs b/tests/static-app.test.mjs index a4d5b30..3384e8e 100644 --- a/tests/static-app.test.mjs +++ b/tests/static-app.test.mjs @@ -30,7 +30,6 @@ test("vite entrypoint and app shell are wired", async () => { assert.match(overlays, /uid\("marker"\)/); assert.match(imageViewer, /export function ImageViewer/); assert.match(imageViewer, /function openImageInNewTab/); - assert.match(homePage, /import\.meta\.env\.DEV \|\| toolboxes\.length === 0/); assert.match(homePage, /dragon-home\.png/); assert.match(aboutPage, /module-icon-\$\{group\.icon \|\| "notepad"\}/); });