11 KiB
11 KiB
GOLDEN_DATASET.md — Expria Frontend
Document de référence — Version 1.0 Ce fichier contient les tests manuels à rejouer après CHAQUE session Claude Code frontend, avant de déployer sur Cloudflare Pages. Un seul test en rouge = la modification est refusée, on revient en arrière.
Complément frontend du
GOLDEN_DATASET.mdbackend. Les deux doivent passer avant un déploiement couplé.
Principe d'utilisation
- Avant chaque session Claude Code : commit Git propre
- Après chaque session Claude Code : rejouer TOUS les tests du groupe concerné
- Si un test échoue : ne pas continuer, identifier la régression, corriger d'abord
- En cas de doute : rejouer le groupe Z (smoke test complet)
Environnement de test :
- URL frontend local :
http://localhost:5173 - URL backend :
https://api.expria.app(ou local si dev simultané) - Navigateurs à couvrir : Chrome + Firefox + Safari mobile (via DevTools mobile emulation minimum)
Comptes de test (identiques au backend) :
| Compte | Plan | Mot de passe |
|---|---|---|
| test.free@gmail.com | free | Expria2025!test |
| test.standard@gmail.com | standard | Expria2025!test |
| test.premium@gmail.com | premium | Expria2025!test |
| test.quota@gmail.com | free (5/5 utilisées) | Expria2025!test |
Groupe A — Authentification et routing
| # | Test | Compte | Résultat attendu | ✅/❌ |
|---|---|---|---|---|
| A1 | Arriver sur / sans être connecté |
— | Page Home publique affichée | |
| A2 | Cliquer "Se connecter" depuis Home | — | Redirection /login, formulaire visible |
|
| A3 | Inscription avec email + mot de passe valides | nouveau | Compte créé, plan=free, redirection /dashboard |
|
| A4 | Connexion avec identifiants corrects | test.free | Redirection /dashboard, plan Free affiché |
|
| A5 | Connexion avec mot de passe incorrect | test.free | Message d'erreur en français, pas de redirection | |
| A6 | Déconnexion depuis le menu utilisateur | test.free | Redirection /, session invalidée |
|
| A7 | Accès direct à /dashboard sans auth |
— | Redirection /login (ProtectedRoute) |
|
| A8 | Accès direct à /t2-live en tant que Free |
test.free | Redirection ou PaywallModal "Exclusivité Premium" | |
| A9 | Session JWT expirée pendant navigation | test.free | Message "Session expirée", redirection /login |
|
| A10 | Rafraîchir la page après login | test.free | Reste connecté, dashboard réaffiché |
Groupe B — Plan Free (parcours complet)
| # | Test | Compte | Résultat attendu | ✅/❌ |
|---|---|---|---|---|
| B1 | Dashboard Free après connexion | test.free | Compteur "X/5 simulations", aperçu flouté du dashboard Premium visible | |
| B2 | Badge compteur simulations affiché | test.free | Visible en permanence dans le header du dashboard | |
| B3 | Lancer une simulation EE T1 | test.free (quota < 5) | Interface de production affichée, pas de tips visibles | |
| B4 | Soumettre une production EE | test.free | Rapport affiché : score + NCLC visibles, critères floutés avec cadenas | |
| B5 | Rapport flouté avec mentions correctes | test.free | "Disponible en Standard" + bouton upgrade visible | |
| B6 | Lancer une simulation EO T1 | test.free | Interface d'enregistrement audio, pas d'erreur microphone | |
| B7 | Tenter EO T2 live depuis le sélecteur de tâches | test.free | Cadenas + message "Exclusivité Premium" | |
| B8 | Atteindre la 6e simulation | test.quota | Modal de blocage : "5/5 utilisées" + 2 boutons (Standard/Premium) + "Plus tard" | |
| B9 | Cliquer "Plus tard" dans le modal | test.quota | Modal fermé, dashboard visible, pas de redirection | |
| B10 | Cliquer "Mode Examen" | test.free | Cadenas + message "Exclusivité Premium" | |
| B11 | Tenter accès URL direct /exam-mode |
test.free | Redirection ou PaywallModal |
Groupe C — Plan Standard
| # | Test | Compte | Résultat attendu | ✅/❌ |
|---|---|---|---|---|
| C1 | Dashboard Standard après connexion | test.standard | Historique visible, pas de compteur simulations, bouton "Choisir une tâche" actif | |
| C2 | Lancer simulation EE sans limite | test.standard | Accès direct, aucune vérification de quota visible | |
| C3 | Toggle "Suggestions d'idées" activé | test.standard | Suggestions visibles pendant la simulation | |
| C4 | Toggle "Mode focus" activé | test.standard | Tips masqués pendant la simulation | |
| C5 | Rapport complet après soumission EE | test.standard | Score, critères détaillés, erreurs expliquées, modèle, exercices — rien flouté | |
| C6 | Production apparaît dans le dashboard | test.standard | Date, tâche, score affichés dans la liste | |
| C7 | Cliquer une production dans l'historique | test.standard | Rapport complet de cette production réaffiché | |
| C8 | Cliquer "Mode Examen" | test.standard | Message "Réservé au plan Premium" + bouton upgrade | |
| C9 | Cliquer "EO Tâche 2 live" | test.standard | Cadenas + message "Exclusivité Premium" | |
| C10 | Après 5 productions : indice de préparation | test.standard | Section indice visible avec score et message interprétatif | |
| C11 | Upgrade Standard → Premium : prorata affiché | test.standard | Avant confirmation, montant prorata visible (ex : "~10€ aujourd'hui") |
Groupe D — Plan Premium
| # | Test | Compte | Résultat attendu | ✅/❌ |
|---|---|---|---|---|
| D1 | Dashboard Premium après connexion | test.premium | Historique, indice, patterns, bouton examen actif, T2 live accessible | |
| D2 | Accéder à EO T2 live | test.premium | Page préparation T2, bouton "Démarrer le dialogue" actif | |
| D3 | Démarrer le dialogue T2 | test.premium | État "Connecting" puis "Listening", l'IA prend la parole en premier | |
| D4 | Répondre en audio à l'IA | test.premium | L'IA réagit après la réponse du candidat, état oscille listening/speaking | |
| D5 | Fin de dialogue T2 | test.premium | Rapport complet affiché, production enregistrée avec tag "T2 Live" | |
| D6 | Déconnexion WebSocket en cours de T2 | test.premium | État "Error" affiché, message utilisateur clair, option de reprise | |
| D7 | Lancer mode Examen EE | test.premium | Page d'avertissement affichée avant démarrage | |
| D8 | Confirmer Examen EE | test.premium | 3 tâches visibles, timer 60:00 démarré, inarrêtable | |
| D9 | Blocage à T=0 (Examen EE) | test.premium | Zone de texte figée, message "Temps écoulé", envoi auto | |
| D10 | Lancer mode Examen EO | test.premium | Timer 12:00, enregistrement actif, tâches enchaînées | |
| D11 | Analyse patterns (5+ productions) | test.premium | Section "Mon profil" avec erreurs récurrentes classées |
Groupe E — Paiements Stripe
⚠️ Utiliser les cartes de test Stripe :
- Carte valide :
4242 4242 4242 4242(date future, CVC libre)- Carte refusée :
4000 0000 0000 0002
| # | Test | Compte | Résultat attendu | ✅/❌ |
|---|---|---|---|---|
| E1 | Upgrade Free → Standard (Stripe Checkout) | test.free | Redirection full page vers Stripe, paiement, retour dashboard Standard | |
| E2 | Invalidation du cache plan après paiement | test.free → standard | usePlan() refetch automatiquement, dashboard bascule sans recharger la page | |
| E3 | Upgrade Free → Premium | test.free | Même flux que E1, plan=premium après retour | |
| E4 | Upgrade Standard → Premium avec prorata | test.standard | Montant prorata affiché avant confirmation, accès Premium immédiat | |
| E5 | Paiement refusé (carte 4000 0000 0000 0002) | test.free | Message d'erreur Stripe clair, plan inchangé | |
| E6 | Annuler au milieu du Checkout | test.free | Retour sur /billing ou /pricing, plan inchangé |
Groupe F — Sécurité et permissions
| # | Test | Compte | Résultat attendu | ✅/❌ |
|---|---|---|---|---|
| F1 | URL directe /t2-live en Standard |
test.standard | Redirection ou PaywallModal, pas d'accès à la page | |
| F2 | Inspecter DevTools → clés privées | — | Aucune clé SERVICE_ROLE, GEMINI, STRIPE_SECRET visible |
|
| F3 | Inspecter DevTools → JWT en clair dans localStorage | test.free | JWT Supabase visible (normal, c'est un access token) mais pas de refresh token exposé | |
| F4 | Modifier le plan dans DevTools via Redux/state | test.free | La modification locale n'a aucun effet — le backend reste l'autorité | |
| F5 | Rapport contenant des caractères HTML potentiellement malicieux | test.standard | Rendu comme texte, pas comme HTML (aucune exécution) | |
| F6 | CSP header présent dans la réponse HTTP | — | Content-Security-Policy défini dans les headers Cloudflare Pages |
|
| F7 | Console navigateur : pas de log de JWT ou données perso | test.free | Aucun console.log contenant email, token, payload API |
Groupe G — Responsive mobile
Tests à rejouer sur DevTools mobile emulation (iPhone SE, iPhone 12, Samsung Galaxy) ET sur vrai mobile si possible.
| # | Test | Résultat attendu | ✅/❌ |
|---|---|---|---|
| G1 | Page Home lisible sur écran 375px | Pas de débordement horizontal, CTA accessible | |
| G2 | Formulaire de login sur mobile | Champs bien dimensionnés, clavier virtuel ne cache pas le bouton | |
| G3 | Dashboard Free sur mobile | Compteur visible, aperçu flouté lisible | |
| G4 | Simulation EE sur mobile | Zone de texte utilisable, pas de zoom intempestif | |
| G5 | Enregistrement audio EO sur mobile | Permission microphone demandée, enregistrement fonctionnel | |
| G6 | T2 live sur mobile (Premium) | WebSocket fonctionne, audio bidirectionnel OK | |
| G7 | Modal PaywallModal sur mobile | Scrollable si contenu déborde, bouton fermeture accessible |
Groupe Z — Smoke test (avant chaque déploiement)
Les 10 scénarios les plus critiques, à rejouer dans l'ordre avant chaque déploiement production.
| # | Test | Description rapide |
|---|---|---|
| Z1 | Inscription + première simulation Free | Compte créé → simulation → rapport flouté visible |
| Z2 | Blocage quota Free | 6e simulation → modal de blocage |
| Z3 | Simulation Standard complète | Login → simulation → rapport complet → dashboard |
| Z4 | Mode examen bloqué en Standard | Bouton mode examen → message upgrade |
| Z5 | T2 live Premium | Login → T2 live → dialogue → rapport |
| Z6 | Mode examen EE complet | Lancement → timer → T=0 → envoi auto → rapport |
| Z7 | Paiement Free → Standard | Stripe Checkout → retour dashboard Standard sans rechargement |
| Z8 | Prorata Standard → Premium | Montant affiché → confirmation → accès Premium immédiat |
| Z9 | Déconnexion + accès protégé | Logout → accès /dashboard → redirection /login |
| Z10 | Responsive mobile Home + Login | Affichage correct sur iPhone SE |
Procédure en cas d'échec
Test échoue
↓
1. Noter le numéro du test et le comportement observé
2. NE PAS continuer la session Claude Code
3. Identifier le fichier modifié qui a causé la régression
4. Revenir au commit Git précédent
5. Analyser la cause avec Claude (chat, pas code)
6. Reformuler le prompt en ajoutant la contrainte manquante
7. Relancer la session Claude Code
8. Rejouer le groupe de tests concerné
Historique des sessions
Remplir après chaque session Claude Code frontend.
| Date | Session | Tests rejoués | Résultat | Notes |
|---|---|---|---|---|
| — | — | — | — | — |
Historique de ce document
| Version | Date | Changements |
|---|---|---|
| 1.0 | 2026-04-17 | Création initiale, 55 tests frontend |