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).