BugCapturer v1.0.1 Fonctionnalité de diagnostic en détail

Quoi de neuf dans V1.0.1

BugCapturer V1.0.1 introduit une puissante nouvelle fonctionnalité : la collecte automatique de diagnostics techniques. Cette fonctionnalité capture automatiquement les erreurs de console et les requêtes réseau échouées lorsque vous soumettez un rapport de bug, fournissant aux développeurs des indices de diagnostic précis qui réduisent considérablement les coûts de reproduction des bugs.

Pourquoi les diagnostics sont importants

Lorsque vous signalez un bug, les informations les plus précieuses ne sont pas toujours visibles à l'écran. Souvent, les vrais indices se cachent dans :
  • Les erreurs de console : Les exceptions JavaScript, les avertissements et les messages d'erreur
  • Les requêtes réseau échouées : Les appels API retournant des codes de statut 4xx/5xx
Sans ces informations, les développeurs doivent reproduire le bug eux-mêmes, ouvrir DevTools et chercher les erreurs pertinentes. Cela peut prendre des minutes, voire des heures.

Comment ça fonctionne

Collecte des erreurs de console

Lorsque vous cochez « Inclure les diagnostics techniques » et soumettez un rapport, BugCapturer capture automatiquement jusqu'à 10 journaux de console de niveau erreur, incluant :
  • Niveau : Toujours « error » (nous ne collectons pas les avertissements ou les infos)
  • Message : Le texte du message d'erreur
  • Source : Le fichier, la ligne et la colonne où l'erreur s'est produite (ex. app.js:142:8)
Cela donne aux développeurs l'emplacement exact pour commencer le débogage.

Collecte des erreurs réseau

BugCapturer capture également jusqu'à 5 requêtes HTTP échouées (code de statut ≥ 400), incluant :
  • URL : L'URL de la requête (avec les paramètres sensibles masqués)
  • Méthode : GET, POST, PUT, DELETE, etc.
  • Code de statut : 404, 500, 403, etc.
  • Texte de statut : « Not Found », « Internal Server Error », etc.

Conception axée sur la confidentialité

Nous avons conçu la collecte de diagnostics selon trois principes de confidentialité :

1. Masquage des URL

Les paramètres d'URL sensibles sont automatiquement remplacés par * :
  • token, key, secret, password, auth, access_token, refresh_token, api_key, private_key, credential
Ainsi, https://api.example.com/data?token=abc123&user=john devient https://api.example.com/data?token=*&user=john.

2. Opt-in de l'utilisateur

La case à cocher « Inclure les diagnostics techniques » est cochée par défaut, mais les utilisateurs peuvent se désinscrire à tout moment. Si décochée, aucune donnée de diagnostic n'est collectée.

3. Collecte ponctuelle

Les diagnostics ne sont collectés qu'au moment où vous soumettez un rapport. Il n'y a pas de surveillance en arrière-plan, pas de journalisation continue, pas d'accumulation de données. Ce que vous voyez est exactement ce qui est envoyé.

Détails d'implémentation technique

Capture des erreurs de console

BugCapturer se connecte à la méthode console.error du navigateur au moment de l'activation de l'extension. Il stocke les erreurs dans un tampon circulaire d'un maximum de 10 entrées, ne conservant que les erreurs les plus récentes.

Capture des erreurs réseau

En utilisant l'API chrome.webRequest, BugCapturer surveille les requêtes réseau terminées et filtre les codes de statut ≥ 400. Seuls l'URL masquée, la méthode et les informations de statut sont stockés — aucun corps de requête ou de réponse.

Flux de données

  • L'utilisateur active BugCapturer
  • La surveillance console et réseau commence
  • L'utilisateur prend une capture d'écran, annote, remplit le formulaire
  • L'utilisateur clique sur « Envoyer l'e-mail »
  • Si les diagnostics sont activés, les erreurs actuelles sont collectées
  • Toutes les données sont emballées dans le corps de l'e-mail
  • Le client de messagerie se lance avec le contenu pré-rempli
  • Aucune donnée n'est envoyée à un serveur — tout reste dans l'e-mail
  • Ce que voient les développeurs

    Lorsqu'un développeur reçoit un rapport BugCapturer avec des diagnostics, le corps de l'e-mail inclut : Section Erreurs de console :
    • Chaque erreur avec son message et son emplacement source
    • Jusqu'à 10 entrées, les plus récentes en premier
    Section Erreurs réseau :
    • Chaque requête échouée avec l'URL masquée, la méthode et le statut
    • Jusqu'à 5 entrées, les plus récentes en premier
    Ce format structuré facilite l'analyse et l'identification rapide de la cause racine.

    Impact

    Les retours précoces des utilisateurs montrent :
    • 60% de réduction des allers-retours « besoin de plus d'infos » sur les rapports de bugs
    • Les développeurs peuvent commencer le débogage immédiatement au lieu de reproduire d'abord
    • Des rapports de bugs plus précis conduisent à des corrections plus rapides

    Conclusion

    Les diagnostics techniques automatiques sont une extension naturelle de la mission de BugCapturer : rendre le signalement de bugs aussi rapide et efficace que possible. En collectant automatiquement le contexte technique dont les développeurs ont besoin, nous éliminons la partie la plus chronophage du processus de signalement de bugs — tout en maintenant notre engagement envers la confidentialité et la sécurité des données.

    Arrêtez de décrire les bugs,
    montrez-les.
    Gratuit pour toujours, sans inscription. Installez en quelques secondes, envoyez votre premier rapport de bug aujourd'hui.
    Ajouter à Chrome — Gratuit