chore(capitalisation): integrate triage entries and anchor new knowledge

This commit is contained in:
MaksTinyWorkshop
2026-04-18 13:19:27 +02:00
parent 7767f1f947
commit 02ad0de258
14 changed files with 528 additions and 4 deletions

View File

@@ -176,3 +176,25 @@ return (
</>
);
```
---
<a id="pattern-navigation-overlay-focus-trap"></a>
## Pattern : Overlay/drawer accessible avec focus trap
### Synthèse
Teleport + backdrop + Escape + scroll-lock n'est pas suffisant : le focus trap est obligatoire.
### Analyse
Sans focus trap, le clavier peut sortir de la sheet/panel et casser l'ordre de navigation.
### Validation
- Validé le : 09-04-2026
- Contexte technique : Vue 3 / accessibilité overlays — RL799_V2
- Applicable à tout drawer/sheet/modal custom en SPA (desktop et mobile clavier).
### Implémentation
- Capturer le focus à l'ouverture (premier élément interactif).
- Boucler Tab/Shift+Tab dans le conteneur.
- Restaurer le focus au trigger à la fermeture.
---

View File

@@ -187,3 +187,24 @@ Ne jamais :
- [ ] Garde-fou explicite contre les doubles actions
- [ ] Refresh explicite après mutation réussie
- [ ] Tests sur succès, erreur et action concurrente
---
<a id="pattern-state-hydratation-auth-async"></a>
## Pattern : Hydratation auth asynchrone avec états explicites
### Synthèse
Lors d'un passage sync -> async au boot, exposer un statut d'hydratation explicite (`idle`/`hydrating`/`ready`).
### Analyse
Sans état transitoire formel, les guards lisent des valeurs incomplètes et déclenchent des redirections erronées.
### Validation
- Validé le : 18-04-2026
- Contexte technique : Vue 3 / Pinia / boot async — RL799_V2
- Applicable à toute initialisation critique : session, feature flags, restore état persistant.
### Implémentation (exemple minimal)
- Store : `hydrateStatus` + promesse partagée en cours pour les appels concurrents.
- Guards : `await hydrate()` avant toute décision d'accès.
- UI : fallback de rendu tant que l'hydratation n'est pas `ready`.

View File

@@ -132,3 +132,24 @@ expect(aBeforeB).toBe(true);
### Risque associé
`boundingBox().y` vérifie la position visuelle rendue par CSS, pas l'ordre dans le DOM. De plus `boundingBox()` retourne `null` pour les éléments hors viewport → crash non déterministe.
---
<a id="pattern-tests-selecteurs-e2e-stables"></a>
## Pattern : Sélecteurs E2E stables orientés intention
### Synthèse
Les tests E2E doivent cibler des sélecteurs stables (`data-testid`, role/name) et non la structure CSS/XPath.
### Analyse
Les classes et la structure DOM changent fréquemment sans régression fonctionnelle.
### Validation
- Validé le : 14-04-2026
- Contexte technique : Playwright / sélecteurs robustes — RL799_V2
- Ce pattern s'applique à Playwright/Cypress sur toutes les UIs réactives.
### Implémentation
- Préférer `data-testid` paramétré par identifiant métier stable.
- Éviter `locator.first()` si l'ordre peut muter.
- Isoler les tests mutateurs avec stratégie de remise à l'état (snapshot/restore).

View File

@@ -135,3 +135,39 @@ if (user === null || user.role !== 'ADMIN') return <View />;
- **Signal review** : `Authorization: Bearer` dans les tests alors que le code production utilise `credentials: 'include'`
- Contexte technique : Vue 3 / auth migration — RL799_V2 08-04-2026
---
<a id="risque-auth-me-fallback-localstorage"></a>
## Migration vers `/auth/me` — fallback localStorage réintroduit une confiance client
### Risques
- Un blocage réseau ciblé peut forcer un fallback sur des données locales falsifiables.
### Symptômes
- Rôle/grade consommés depuis localStorage en cas d'erreur endpoint d'autorité.
### Bonnes pratiques / mitigations
- Si l'endpoint d'autorité échoue, conserver un état non authentifié/dégradé, pas un fallback de privilèges.
- Garder localStorage strictement pour métadonnées UX non sensibles.
- Contexte technique : auth frontend / source d'autorité — RL799_V2 18-04-2026
---
<a id="risque-auth-store-source-verite-bypass-service"></a>
## Source de vérité auth déplacée vers store, appels directs service laissés en place
### Risques
- Guards/router lisent un état store non synchronisé après login/logout.
### Symptômes
- Login réussi puis redirection immédiate vers `/login`.
### Bonnes pratiques / mitigations
- Interdire les appels directs au service auth depuis les pages une fois le store source de vérité.
- Centraliser login/logout/change-password via actions store.
- Contexte technique : auth frontend / Pinia store — RL799_V2 18-04-2026
---

View File

@@ -119,3 +119,39 @@ Erreurs courantes :
- Activer `@typescript-eslint/no-unused-vars` et `no-unused-imports` dans la config ESLint mobile
- Lors de toute migration de tokens, auditer les imports de chaque composant UI concerné
- Contexte technique : React Native / ESLint — app-alexandrie, 25-03-2026
---
<a id="risque-design-tokens-fallback-theme-incoherent"></a>
## Fallbacks de tokens incohérents avec le thème actif
### Risques
- Composants lisibles en dev mais illisibles quand une variable manque en production.
### Symptômes
- Fallback hardcodé light-theme dans un contexte dark-theme.
### Bonnes pratiques / mitigations
- Utiliser des fallbacks cohérents avec le thème de référence.
- Préférer un fallback vers alias sémantique existant plutôt qu'une couleur brute.
- Contexte technique : design tokens / thèmes CSS — RL799_V2 10-04-2026
---
<a id="risque-design-tokens-variables-non-definies"></a>
## Variables CSS utilisées mais non définies (fallback silencieux)
### Risques
- Dérive invisible du design system (les fallbacks masquent les oublis de token).
### Symptômes
- L'UI semble correcte mais contourne les tokens sur une part significative des règles.
### Bonnes pratiques / mitigations
- Auditer régulièrement : variables utilisées moins variables définies.
- Traiter chaque variable non définie comme dette explicite.
- Contexte technique : design tokens / audit CSS vars — RL799_V2 17-04-2026
---

View File

@@ -248,3 +248,74 @@ Poser `role="menu"` / `role="menuitem"` implique obligatoirement :
- **Signal review** : tout `.catch(() => {})` ou `catch { /* ignore */ }` mérite au minimum un log ou un feedback visuel
- Contexte technique : frontend / actions async — RL799_V2 07-04-2026
---
<a id="risque-monorepo-shim-js-desynchronise"></a>
## Monorepo ESM — shim runtime `.js` désynchronisé de l'index TypeScript
### Risques
- Le typecheck passe mais le runtime navigateur casse (`named export not found`).
### Symptômes
- Erreur Vite/browser sur export absent alors que `index.ts` est correct.
### Bonnes pratiques / mitigations
- Si un shim `.js` est maintenu, imposer une mise à jour miroir à chaque nouvel export.
- Ajouter un test/guard de cohérence exports TS vs JS shim.
- Contexte technique : monorepo / ESM shim runtime — RL799_V2 15-04-2026
---
<a id="risque-eslint-flat-tsconfigrootdir-manquant"></a>
## ESLint flat config TypeScript sans `tsconfigRootDir`
### Risques
- Erreurs de parsing massives en IDE/monorepo selon CWD d'exécution.
### Symptômes
- `No TsConfigRootDir` / `Cannot read tsconfig.json` alors que le build TS passe.
### Bonnes pratiques / mitigations
- Toujours définir `tsconfigRootDir: import.meta.dirname` quand `parserOptions.project` est utilisé.
- Redémarrer le serveur ESLint après correction.
- Contexte technique : tooling / ESLint flat config — RL799_V2 17-04-2026
---
<a id="risque-pwa-auth-cookie-cache"></a>
## PWA + auth cookie httpOnly — stratégie de cache non maîtrisée
### Risques
- Réponses sensibles servies depuis cache offline.
- Comportement d'auth incohérent entre réseau/cached.
### Symptômes
- Session/app state divergents après activation SW ou reprise réseau.
### Bonnes pratiques / mitigations
- Exclure explicitement les routes authentifiées sensibles du cache persistant.
- Définir une stratégie stricte par classe de route (auth, API privée, assets publics).
- Contexte technique : PWA / service worker / auth cookie — RL799_V2 18-04-2026
---
<a id="risque-pwa-beforeinstallprompt-tardif"></a>
## PWA install prompt — capture tardive de `beforeinstallprompt`
### Risques
- Événement perdu au cold boot, prompt jamais proposé.
### Symptômes
- Implémentation correcte en apparence mais aucun déclenchement sur Android.
### Bonnes pratiques / mitigations
- Installer l'écouteur le plus tôt possible dans le cycle d'initialisation.
- Ne pas baser la détection iOS uniquement sur l'UA (cas iPad en mode desktop).
- Contexte technique : PWA / install prompt — RL799_V2 18-04-2026
---

View File

@@ -277,3 +277,22 @@ const routes = [
- **Signal review** : guards de navigation couverts uniquement par des tests `includes()` sans test comportemental
- Contexte technique : Vue 3 / Vue Router 4 / node:test — RL799_V2 08-04-2026
---
<a id="risque-navigation-router-push-undefined"></a>
## `router.push` construit avec segment potentiellement `undefined`
### Risques
- Navigation vers `/.../undefined`, historique pollué et diagnostics trompeurs.
### Symptômes
- Warnings Vue Router en cascade au boot ou à la reprise d'événements globaux.
### Bonnes pratiques / mitigations
- Valider les segments dynamiques avant `push/replace`.
- Préférer la navigation nommée avec params validés plutôt que concaténation de string.
- Contexte technique : Vue Router / navigation dynamique — RL799_V2 15-04-2026
---