Informez 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 faciliter la recherche de ce qui ne fonctionne pas, d'atteindre la cause racine et, surtout, de trouver un moyen de le corriger. Les bugs qui progressent rapidement sont généralement faciles à reproduire avec un comportement attendu clair.
Vérifier qu'il s'agit d'un bug
La première étape consiste à déterminer le "bon" comportement.
Quel est le comportement correct ?
Consultez la documentation de l'API appropriée sur MDN ou essayez de trouver les spécifications associées. Ces informations peuvent vous aider à décider quelle API est réellement défectueuse, où elle est défectueuse 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 en tant que problème d'interopérabilité, en particulier lorsque le navigateur qui contient le bug est le plus inhabituel. Essayez de tester 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 du reniflage par le user-agent. Dans les outils pour les développeurs Chrome, essayez de définir la chaîne User-Agent sur 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" peuvent être traitées beaucoup plus rapidement, en particulier si vous fournissez un numéro de version pour l'endroit où la tâche a fonctionné et une version dans laquelle elle a échoué. Des outils tels que BrowserStack peuvent faciliter la vérification des anciennes versions du navigateur. L'outil bisect-builds (pour Chromium) permet de rechercher la modification de manière très efficace.
Si un problème est une régression et peut être reproduit, la cause racine peut généralement être trouvée et corrigée 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 à 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, il est temps de vérifier s'il a déjà été signalé en effectuant une recherche dans la base de données des bugs du navigateur.
- Navigateurs basés sur Chromium: https://crbug.com
- Firefox: https://bugzilla.mozilla.org/
- Navigateurs Safari et WebKit: https://bugs.webkit.org/
Si vous trouvez un bug qui décrit le problème, apportez votre soutien en l'ajoutant à vos favoris, en l'ajoutant aux favoris ou en commentant le bug. De plus, sur de nombreux sites, vous pouvez vous ajouter à la liste des destinataires en Cc et être averti lorsque le bug évolue.
Si vous décidez de commenter le bug, indiquez comment il affecte votre site Web. Évitez d'ajouter des commentaires de type "+1", car les outils de suivi des bugs envoient généralement des e-mails 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.
Créer un scénario de test réduit
Mozilla propose un excellent article sur la création d'un scénario de test minimisé. Pour résumer, bien qu'une description du problème soit un bon début, rien ne vaut une démonstration en lien dans le bug qui illustre le problème. Pour optimiser les chances de progression rapide, l'exemple doit contenir le minimum de code possible pour illustrer le problème. Un exemple de code minimal est la première chose que vous pouvez faire pour augmenter les chances que le bug soit corrigé.
Voici quelques conseils pour minimiser un scénario de test:
- Téléchargez la page Web, ajoutez
<base href="https://original.url">et vérifiez que le bug existe localement. Un serveur HTTPS peut être requis si l'URL utilise 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 disparaisse.
- Utilisez le contrôle des versions pour enregistrer votre travail et annuler les opérations erronées.
Héberger un scénario de test réduit
Si vous souhaitez héberger votre scénario de test réduit, plusieurs options s'offrent à vous:
Sachez que plusieurs de ces sites affichent du contenu dans un 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.
- Navigateurs basés sur Chromium : https://crbug.com/new
- Firefox : https://bugzilla.mozilla.org/
- Navigateurs Safari et WebKit : https://bugs.webkit.org/
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 quel est le problème et à l'aider à le trier.
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 les 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 dans les cas où les bugs peuvent nécessiter des étapes étranges pour être reproduits. Être capable de voir ce qui se passe dans un enregistrement d'écran ou sur une capture d'écran peut souvent être utile.
Inclure des détails sur l'environnement
Certains bugs ne sont reproductibles que sur certains systèmes d'exploitation ou uniquement sur des types d'écrans spécifiques (par exemple, à faible PPP ou à PPP élevé). Veillez à inclure les détails de tous les environnements de test que vous avez utilisés.
Signaler le bug
Enfin, signalez le bug. Ensuite, n'oubliez pas de consulter vos e-mails pour connaître les 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 ont des difficultés à reproduire le problème, ils peuvent vous contacter.