Signaler un bug de navigateur

Informer les fournisseurs de navigateurs des problèmes que vous rencontrez dans leur navigateur fait partie intégrante de l'amélioration de la plate-forme Web.

Signaler un bug n'est pas compliqué, mais cela demande un peu de travail. L'objectif est de rendre trouver facilement ce qui ne fonctionne pas, atteindre l'origine du problème et, surtout, pour y remédier. Les bugs qui progressent rapidement sont généralement faciles à reproduire avec une le comportement attendu est clair.

Vérifier qu'il s'agit d'un bug

La première étape consiste à déterminer doit être.

Quel est le comportement correct ?

Consultez les documents pertinents de l'API sur MDN ou essayez trouver les spécifications associées. Ces informations peuvent vous aider à déterminer quelle API cassés, où ils sont cassés et quel est le comportement attendu.

Fonctionne-t-il dans un autre navigateur ?

Un comportement qui diffère selon les navigateurs est généralement prioritaire d'interopérabilité, en particulier lorsque le navigateur concerné un peu bizarre. Essayez d'effectuer le test avec les dernières versions de Chrome, Firefox, Safari et Edge, éventuellement à l'aide d'un outil comme BrowserStack.

Si possible, vérifiez que la page ne se comporte pas intentionnellement différemment en raison le reniflage de user-agents. Dans les outils pour les développeurs Chrome, essayez de définir la chaîne User-Agent vers un autre navigateur.

A-t-elle échoué dans une version récente ?

Cela fonctionnait-il comme prévu par le passé, mais ne fonctionnait pas avec une version récente du navigateur ? De telles "régressions" vous pouvez agir plus rapidement, surtout si vous fournissez le numéro de la version où elle fonctionnait et la version dans laquelle elle a échoué. Des outils tels que BrowserStack permet de vérifier facilement les anciennes versions de navigateur et outil bisect-builds (pour Chromium) permet de rechercher la modification très efficacement.

Si un problème est une régression et peut être reproduit, la cause du problème est généralement sont détectées et corrigées rapidement.

D'autres utilisateurs rencontrent-ils le même problème ?

Si vous rencontrez des problèmes, il est fort probable que d'autres développeurs l'aient également. Tout d'abord, recherchez le bug sur Stack Overflow. Cela peut vous aider à traduire un problème abstrait en une API défectueuse spécifique. et cela pourrait vous aider à trouver une solution de contournement à court terme jusqu'à ce que le bug soit corrigé.

A-t-il déjà été signalé ?

Une fois que vous avez une idée de la nature du bug, vérifiez s'il a déjà été signalé en effectuant une recherche dans la base de données des bugs du navigateur.

Si vous trouvez un bug qui décrit le problème, ajoutez votre assistance en ajoutant le bug à vos favoris, en l'ajoutant à vos favoris ou en le commentant. Et, sur de nombreux sites, vous pouvez vous ajouter à la liste des destinataires en Cc et obtenir des mises à jour lorsque le bug évolue.

Si vous décidez de commenter le bug, incluez des informations sur la façon dont il affecte votre site Web. Évitez d'ajouter "+1". les commentaires de style, comme des outils de suivi des bugs envoient généralement un e-mail pour chaque commentaire.

Signaler le bug

Si le bug n'a pas encore été signalé, il est temps d'en informer le fournisseur du navigateur. à ce sujet.

Créer un scénario de test réduit

Mozilla a un excellent article sur comment créer un scénario de test minimisé. Pour créer un en bref, bien qu'une description du problème soit un bon début, beats, en fournissant une démo associée au bug qui montre problème. Pour optimiser les chances de progression rapide, l'exemple doit contenir le minimum de code possible nécessaire pour illustrer le problème. Un code minimal l'échantillon est la première chose que vous pouvez faire pour augmenter les chances le bug est en cours de résolution.

Voici quelques conseils pour minimiser un scénario de test:

  • Télécharger la page Web, ajouter <base href="https://original.url"> et vérifier que le bug existe localement. Vous devrez peut-être utiliser un serveur HTTPS L'URL utilise le protocole HTTPS.
  • Testez les fichiers locaux sur les dernières versions d'un maximum de navigateurs.
  • Essayez de tout condenser en un seul fichier.
  • Supprimez le code (en commençant par les éléments que vous savez inutiles) jusqu'à ce que le bug disparaît.
  • Utilisez le contrôle des versions pour enregistrer votre travail et annuler les tâches inutiles faux.

Héberger un scénario de test réduit

Si vous recherchez un bon emplacement pour héberger votre cas de test réduit, plusieurs emplacements intéressants sont disponibles:

Sachez que plusieurs de ces sites affichent du contenu dans un cadre iFrame, ce qui peut entraîner un comportement différent des fonctionnalités ou des bugs.

Signaler votre problème

Une fois que vous avez créé votre scénario de test réduit, vous pouvez signaler ce bug. Rendez-vous sur le bon site de suivi des bugs et créez un nouveau problème.

Fournissez une description claire et les étapes nécessaires pour reproduire le problème

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

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

Indiquez ensuite en détail les étapes nécessaires pour reproduire le problème. C'est là qu'intervient votre scénario de test réduit.

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.

Enfin, décrivez le résultat attendu et réel.

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)

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)

Pour en savoir plus, consultez Consignes de rédaction des rapports de bug. sur MDN.

Ajoutez une capture d'écran ou un enregistrement d'écran du problème.

Bien que cela ne soit pas obligatoire, il peut être utile d'ajouter une capture d'écran, ou un enregistrement d'écran du problème. Cela est particulièrement utile lorsque des bugs peut nécessiter quelques étapes étranges pour être reproduits. Pouvoir voir ce qui se passe dans un enregistrement d'écran ou une capture d'écran peuvent souvent s'avérer utiles.

Inclure des détails sur l'environnement

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

Signaler le bug

Enfin, signalez le bug. N'oubliez pas de consulter vos e-mails des réponses au bug. Généralement, lors de l'investigation et de la correction du bug, les ingénieurs peuvent avoir des questions supplémentaires ou s'ils rencontrent des difficultés reproduire le problème, il est possible qu'il vous contacte.