Rapport de bug visuel

Écrire un bug report à la main est lent et perd de l’information. « Le menu déroulant est mal aligné » ne dit presque jamais quel menu, sur quelle page, dans quel état. La correction prend plus de temps et vise parfois le mauvais élément.

Un outil de bug reporting visuel supprime ce problème : au lieu de décrire l’endroit, le relecteur clique dessus. Patchrooms enregistre le sélecteur du DOM, une capture d’écran, l’URL de la page et l’état de la console, puis empaquette le tout en un rapport qu’un humain ou un agent lit sans rien deviner.

Le flux tient en trois gestes, sans changer d’outil :

• Cliquez le bug. Le relecteur clique l’élément cassé directement sur l’app en direct, sans avoir à décrire où il se trouve.
• Patchrooms capture le contexte. Il enregistre automatiquement une capture, le sélecteur de l’élément, l’URL de la page et l’état de la console.
• Un développeur ou un agent corrige. Le rapport s’exporte en Markdown avec tout le détail technique attaché, pour une correction ciblée plutôt que spéculative.

Un exemple : une testeuse QA trouve une modale mal alignée sur le staging. Un clic capture le sélecteur de la modale, une capture et l’URL. Le développeur ouvre le rapport et corrige l’élément exact sans demander « quelle modale ? ».

L’embed tourne sur n’importe quelle page que vous servez : production, staging ou build de preview. C’est une seule balise de script, sans étape de build et sans rebuild quand le feedback change :

<script src="https://room.patchrooms.com/v1/patchrooms.js"
        data-project-key="pr_xxx"></script>

La personne qui relit n’a pas besoin de compte : elle ouvre le lien, clique et commente (par texte ou par note vocale transcrite automatiquement). Le rapport arrive sur votre dashboard en temps réel.

Chaque rapport de bug visuel s’exporte avec le sélecteur, la capture, l’URL et le contexte de la console, prêt à coller dans un coding agent ou à attacher à un ticket. Le texte lu par l’agent est en anglais (c’est ce que le modèle consomme) :

## Bug: Misaligned modal
- **Element:** `div.confirm-modal`
- **Comment:** Modal is offset ~24px to the right on desktop.
- **Screenshot:** blob/scr_41bd.png
- **URL:** https://staging.example.com/billing
- **Console:** no errors

Vous collez le Markdown dans Claude Code, Cursor, Codex, Windsurf ou Cline, ou vous laissez l’agent lire la file directement via le serveur MCP (list_reports / get_report, captures incluses) et clôturer ce qu’il corrige (set_status). Dans les deux cas, la correction vise l’élément exact au lieu de chasser dans l’arborescence de fichiers.

Patchrooms peut alimenter un tracker ou fonctionner seul. Chaque rapport s’exporte en Markdown que vous collez dans un tracker, dans un coding agent, ou que vous gardez trié dans le dashboard Patchrooms.

Le statut par rapport (nouveau, trié, en cours, clôturé) dit à l’équipe ce qu’il reste à faire, sans relire un fil de messages. Pour la boucle complète de relecture d’un artefact IA, voir la revue d’artefacts IA ; pour renvoyer le contexte à l’agent, le feedback prêt pour les agents.