# Cascade onglet 1 — E2E PASS avec 3 bugs M

**Date :** 2026-04-29
**Session :** Claude Code + BrowserMCP (Brave)
**URL testée :** https://aep.trans-former.fr/pratiques-regeneratives

---

## Récap exécutif

```
Cascade onglet 1 — E2E PASS avec 3 bugs M

Scénarios : 5/5 OK
Bugs : 0 High / 3 Medium / 3 Low
Erreurs console : 0

Détail par scénario :
S1 Carte desktop : PASS — tiles OK, 52 markers, API 52/52, 0 erreurs console
S2 Filtres       : PASS* — search filtre (52→2, URL?q=), reset OK, chips a11y KO (Bug M1)
S3 Fiche + retour: PASS — /pratique/[id] complète, retour préserve état
S4 Form submit   : PASS — validation live, "Merci !" + modération message OK
S5 Mobile        : PASS — bottom sheet, hamburger nav, formulaire lisible
```

---

## Bugs M (Medium)

**M1 — Chips CRITÈRES et TYPE non accessibles au clavier (a11y)**
- Les chips de filtres (Matériaux, Filières, Posture… / Agence, Coopérative…) ne sont pas des éléments focusables dans l'arbre d'accessibilité BrowserMCP.
- Tab ne traverse pas les chips — ils apparaissent comme un seul nœud `text:` fusionné.
- Impact : utilisateurs clavier/screen reader ne peuvent pas filtrer.
- Fix : ajouter `role="button"` ou utiliser des `<button>` natifs pour les chips.

**M2 — "Effacer les filtres" ne vide pas le texte du searchbox**
- Après une recherche texte (ex: "rotor" → 2 résultats), cliquer "Effacer les filtres" remet les résultats à 52 et nettoie l'URL, mais le texte "rotor" reste visible dans le champ input.
- UI incohérente : l'utilisateur voit 52 résultats avec "rotor" toujours affiché.
- Fix : `emit('update:search', '')` dans le handler reset-filters du parent.

**M3 — Floating button "Soutenir" couvre le chip "Agence" TYPE**
- Le bouton flottant CTA (position:fixed, bottom-left) overlap visuellement le premier chip TYPE "Agence" sur le viewport actuel (~880px).
- Le chip "Agence" est partiellement ou totalement inaccessible au clic.
- Fix : ajuster le z-index ou la position du floating button pour éviter le overlap sur les chips.

---

## Bugs L (Low)

**L1 — Route `/fiche/[id]` retourne "Fiche introuvable" pour toutes les pratiques**
- La page `/fiche/[id]` est l'ancienne route (agences) qui appelle `/api/fiche/${orgId}` — endpoint inexistant.
- La bonne route pour les pratiques est `/pratique/[id]` (sans 's').
- Impact : confusion si un utilisateur essaie de partager `/fiche/1` manuellement.
- Fix : ajouter une redirection `/fiche/:id → /pratique/:id` ou supprimer la route `/fiche/` si obsolète.

**L2 — "← Retour à la carte" label incorrect sur `/proposer-pratique`**
- Le lien retour affiche "← Retour à la carte" mais pointe vers `/pratiques-regeneratives` (la page carte+liste).
- Sur `/pratique/[id]` le label est correct ("Retour aux pratiques régénératives").
- Fix : harmoniser le label sur `/proposer-pratique`.

**L3 — Map viewport ne se recentre pas sur les résultats filtrés**
- Après une recherche (ex: "rotor" → 2 fiches à Bruxelles), la carte reste centrée sur la vue initiale (Scandinavie).
- Les markers des résultats filtrés peuvent être hors viewport.
- Fix : appeler `map.fitBounds(filteredMarkers)` après chaque changement de filtre.

---

## Détail scénarios

### S1 — Carte desktop (chargement + structure)

- Navigation `/pratiques-regeneratives` : ✓
- Leaflet tiles chargés (OSM + CARTO) : ✓
- Markers/clusters visibles (3, 2, 3, 2, 4, 6, 15…) : ✓
- Bottom sheet avec "52 fiches" + search + CRITÈRES + TYPE + "52 RÉSULTATS" : ✓
- API `/api/pratiques` : 52 items (ids 1→52), source "static" : ✓
- Console JS : 0 erreurs : ✓
- CSS `--nav-primary-solid` : résolu ✓

### S2 — Filtres sidebar

- Search "rotor" → 2 résultats, URL `?q=rotor`, markers synchronisés : ✓
- Bouton "Effacer" (×) sur le searchbox : vide le texte et reset à 52 ✓
- "Effacer les filtres" : remet à 52 mais laisse "rotor" dans le champ → **Bug M2**
- Chips CRITÈRES/TYPE : non accessibles via Tab/keyboard → **Bug M1**
- Markers Bruxelles hors viewport après filtre "rotor" → **Bug L3**
- Reset fonctionnel pour le count : ✓

### S3 — Fiche pratique + retour

- `/pratique/1` (Rotor) : fiche complète ✓
  - Nom, type (Coopérative), pays (Belgique · Bruxelles), score 5/5 ✓
  - Description, critères, tags, site web ✓
  - Coordonnées et métadonnées ✓
- "Retour aux pratiques régénératives" → `/pratiques-regeneratives` ✓
- Retour : 52 résultats préservés ✓
- `/fiche/[id]` : "Fiche introuvable" pour toutes les pratiques → **Bug L1**

### S4 — Formulaire de contribution

- Page `/proposer-pratique` : tous les champs accessibles (refs individuels) ✓
- Nom : "Test BrowserMCP E2E" ✓
- URL : "https://example.com/test-e2e" ✓
- Description : 180/500 chars, compteur live ✓
- Critères : Matériaux + Posture + Vivant cochés (via Tab+Space) ✓
- Validation live "Sélectionne au moins 3 critères" : ✓
- Type : Collectif sélectionné (via Tab+ArrowDown) ✓
- Pays : FR sélectionné via `select_option` (options non visibles dans a11y tree)
- Submit : ✓
- Message succès : "Merci ! Ta proposition est en attente de modération." ✓

Note : click events sur checkbox/radio time out dans BrowserMCP (Tab+Space/ArrowDown workaround fonctionnel).

### S5 — Mobile (~880px viewport)

Note : BrowserMCP ne supporte pas `setViewport` — test effectué sur le viewport courant (~880px) qui déclenche le layout mobile (bottom sheet).

- Bottom sheet avec carte plein-écran en fond : ✓
- Handle de drag visible en haut de la sheet : ✓
- Hamburger nav (≡) : ✓ — dropdown avec 6 liens, page active en bold
- Filtres CRITÈRES et TYPE accessibles dans la sheet : ✓
- Formulaire `/proposer-pratique` : single column, pas de overflow horizontal ✓
- Floating button couvre chip "Agence" : **Bug M3**

---

## Notes de session BrowserMCP

- `browser_click` time out (30s) sur checkbox et radio buttons — workaround Tab+Space/ArrowDown
- `browser_click` fonctionne sur : textbox, links, buttons simples, select
- `browser_select_option` fonctionne sur `<select>` natif même si options non visibles dans a11y tree
- Cluster markers Leaflet : click time out (WebSocket 30s) — clusters non testables via clic direct
- `browser_snapshot` ne résout pas les éléments dans un nœud `text:` fusionné (chips, cards liste)

---

*E2E exécuté le 2026-04-29 par ATIS via Claude Code + BrowserMCP*