Comment signaler une bonne erreur de navigateur

Déposer un bon bogue n'est pas difficile, mais cela demande un peu de travail. L'objectif est de faciliter la recherche de ce qui est cassé, de trouver la cause profonde et, surtout, de trouver un moyen de le réparer. Les bogues à progression rapide ont tendance à être faciles à reproduire avec un comportement attendu clair.

Vérifiez qu'il s'agit d'une erreur

La première étape consiste à déterminer quel devrait être le comportement «correct».

Quel est le comportement correct?

Consultez la documentation API pertinente sur MDNou essayez de trouver les spécifications associées. Ces informations peuvent vous aider à décider quelle API est réellement cassée, où elle est cassée et quel est le comportement attendu.

Fonctionne-t-il dans un autre navigateur?

Un comportement qui diffère d'un navigateur à l'autre est généralement considéré comme un problème d'interopérabilité, en particulier lorsque le navigateur contenant le bogue est l'extérieur. Essayez de tester les dernières versions de Chrome, Firefox, Safari et Edge, éventuellement en utilisant un outil tel que BrowserStack.

Si possible, vérifiez que la page ne se comporte pas intentionnellement différemment en raison du traçage de l'agent utilisateur. Dans Chrome DevTools, essayez configurer le Agent utilisateur chaîne vers un autre navigateur.

A-t-il cassé sur une version récente?

Cela a fonctionné comme prévu dans le passé, mais il est tombé en panne dans une version récente du navigateur? Ces «régressions» peuvent être traitées beaucoup plus rapidement, surtout si vous fournissez un numéro de version là où cela a fonctionné et une version où cela a échoué. Des outils comme
BrowserStack cela peut faciliter la vérification des anciennes versions du navigateur.

Si un problème est une régression et peut être reproduit, la cause première peut généralement être trouvée et corrigée rapidement.

Les autres voient-ils le même problème?

Si vous rencontrez des problèmes, il y a de fortes chances que d'autres développeurs le soient aussi. Tout d'abord, essayez de rechercher l'erreur dans Débordement de pile. Cela pourrait vous aider à traduire un problème abstrait en une API cassée spécifique et pourrait vous aider à trouver une solution à court terme jusqu'à ce que le bogue soit corrigé.

Cela a-t-il déjà été signalé?

Une fois que vous avez une idée de l'erreur, il est temps de vérifier si l'erreur a déjà été signalée en recherchant dans la base de données des erreurs du navigateur.

Si vous trouvez un bogue existant qui décrit le problème, veuillez ajouter votre soutien en le mettant en évidence, en le mettant en favori ou en commentant le bogue. Et sur de nombreux sites, vous pouvez vous ajouter à la liste CC et obtenir des mises à jour lorsque l'erreur change.

Si vous décidez de commenter le bogue, veuillez inclure des informations sur la façon dont le bogue affecte votre site Web. Évitez d'ajouter des commentaires de style "+1", car les outils de suivi des bogues envoient souvent des e-mails pour chaque commentaire.

Signaler le bogue

Si l'erreur n'a pas été signalée auparavant, il est temps d'en informer le fournisseur de navigateur.

Créer un cas de test réduit

Mozilla a un excellent article sur
comment créer un cas de test minimisé. Pour faire une histoire courte, si une description du problème est un bon début, rien de mieux que de fournir une démo liée à l'erreur qui montre le problème. Pour maximiser la possibilité de progrès rapides, l'exemple doit contenir le minimum de code possible nécessaire pour démontrer le problème. Un échantillon de code minimal est la première chose que vous pouvez faire pour augmenter les chances que votre bogue soit corrigé.

Voici quelques conseils pour minimiser un cas de test:

• Téléchargez la page Web, ajoutez
  

  et vérifiez que l'erreur existe localement. Cela peut nécessiter un serveur HTTPS actif si l'URL utilise HTTPS.

• Essayez les fichiers locaux dans les dernières versions du plus grand nombre de navigateurs possible.
• Essayez de tout condenser en un seul fichier.
• Éliminez le code (en commençant par les choses que vous savez inutiles) jusqu'à ce que l'erreur disparaisse.
• Utilisez le contrôle de version pour pouvoir enregistrer votre travail et annuler les problèmes.

Héberger un cas de test minifié

Si vous cherchez un bon endroit pour héberger votre cas de test minifié, plusieurs bons endroits sont disponibles:

Notez que plusieurs de ces sites affichent le contenu dans une iframe, ce qui peut entraîner un comportement différent des fonctions ou des erreurs.

Présentez votre problème

Une fois votre scénario de test minimisé, vous êtes prêt à signaler ce bogue. Accédez au bon site de suivi des bogues et créez un nouveau problème.

Fournissez une description claire et des étapes pour reproduire le problème.

Tout d'abord, fournissez une description claire pour aider les ingénieurs à comprendre rapidement le problème et à le classer.

When installing a PWA using the `beforeinstallprompt.prompt()`, the
`appinstalled` event fires before the call to `prompt()` resolves.

Veuillez fournir les étapes détaillées requises pour reproduire le problème ci-dessous. C'est là qu'intervient votre scénario de test minifié.

What steps will reproduce the problem?
1. Go to https://basic-pwa.glitch.me/, open DevTools and look at the
console tab.
2. Click the Install button in the page, you might need to interact with
the page a bit before it becomes enabled.
3. Click Install on the browser modal install confirmation.

Et enfin, décrivez le réely attendu Résultat.

What is the actual result? In the console:
0. INSTALL: Available (logged when `beforeinstallprompt` event fired)
1. INSTALL: Success (logged when `appinstalled` event fired)
2. INSTALL_PROMPT_RESPONSE: {outcome: "accepted", platform: "web"}
(logged when beforeinstallprompt.prompt()` resolves)
What is the expected result? In the console:
0. INSTALL: Available (logged when `beforeinstallprompt` event fired)
1. INSTALL_PROMPT_RESPONSE: {outcome: "accepted", platform: "web"}
(logged when beforeinstallprompt.prompt()` resolves)
2. INSTALL: Success (logged when `appinstalled` event fired)

Pour plus d'informations, consultez Directives pour la rédaction de rapports de bogues
dans MDN.

Bonus: ajoutez une capture d'écran ou un screencast du problème

Bien que cela ne soit pas obligatoire, dans certains cas, il peut être utile d'ajouter une capture d'écran ou un screencast du problème. Ceci est particulièrement utile dans les cas où les erreurs peuvent nécessiter des étapes étranges pour se reproduire. Souvent, il peut être utile de pouvoir voir ce qui se passe sur un screencast ou dans une capture d'écran.

Inclure les détails environnementaux

Certaines erreurs ne sont reproductibles que sur certains systèmes d'exploitation, ou uniquement sur des types d'écrans spécifiques (par exemple, ppp faible ou élevé). N'oubliez pas d'inclure les détails des environnements de test que vous avez utilisés.

Soumettez le bogue

Enfin, soumettez l'erreur. N'oubliez pas de garder un œil sur votre e-mail pour obtenir des réponses à l'erreur. En règle générale, lors de l'enquête et lors de la correction de l'erreur, les ingénieurs peuvent avoir des questions supplémentaires ou, s'ils ont des difficultés à reproduire le problème, ils peuvent communiquer.