Aller au contenu principal

Comment ouvrir la Console du navigateur et collecter des informations de débogage

Mise à jour

Informations générales

Pour mieux analyser les erreurs que vous rencontrez, il est utile de consulter les messages d'erreur dans la console du navigateur. Vous pouvez y accéder en appuyant sur la touche « F12 » du clavier dans n'importe quel navigateur. Il peut également être nécessaire de cliquer sur l'onglet « Console ». Les messages d'erreur affichés en rouge sont les plus pertinents.

 

Voici les instructions générales. Consultez les sections correspondantes ci-dessous pour savoir comment ouvrir la console dans votre navigateur spécifique.

  1. Ouvrir la fenêtre de la console avant que l'erreur ne se produise

  2. Sélectionner l'onglet Console et effacer toutes les entrées affichées en cliquant sur le bouton avec le cercle

  3. Sélectionner l'onglet Network et effacer toutes les entrées affichées en cliquant sur le bouton avec le cercle

  4. Reproduire maintenant l'erreur

  5. Prendre une capture d'écran du navigateur avec l'onglet Console ouvert, puis une autre avec l'onglet Network ouvert

  6. Enregistrez ensuite le contenu de l'onglet Console en effectuant un clic droit dans la fenêtre de la console. Sélectionnez « Save as... » dans le menu contextuel qui apparaît. Répétez la même opération sur l'onglet Network et cliquez sur « Save all as HAR... » dans le menu contextuel

  7. Envoyez les captures d'écran et les deux fichiers journaux au support SoSafe

Chrome

Après avoir ouvert le menu (trois points) dans le coin supérieur droit de la fenêtre du navigateur et sélectionné « More tools » > « Developer Tools », ou en appuyant sur F12, une colonne s'ouvre sur la droite. Il peut également être nécessaire de cliquer sur « Console » ou « Network ». Les messages d'erreur sont signalés en rouge, les avertissements en jaune.

Effacer l'onglet Console + Network :

Chrome DevTools avec l'onglet Console et son icône d'effacement mis en évidence dans un panneau, et l'onglet Network avec son icône d'effacement mis en évidence dans un second panneau en dessous.

Sortie Console + Network :

L'onglet Console de Chrome DevTools affichant une erreur d'analyse en rouge et deux avertissements de source map, à côté de l'onglet Network listant plusieurs requêtes, dont adal.min.js, ainsi que des appels preflight et xhr.

Télécharger l'onglet Console + Network :

L'onglet Console de Chrome avec son menu contextuel (clic droit) ouvert et Save as mis en évidence, à côté de l'onglet Network avec son menu contextuel ouvert et Save all as HAR with content mis en évidence.

Edge

Après avoir ouvert le menu (trois points) dans le coin supérieur droit de la fenêtre du navigateur et sélectionné « More tools » > « Developer Tools », ou en appuyant sur F12, une colonne s'ouvre sur la droite. Il peut également être nécessaire de cliquer sur « Console » ou « Network ». Les messages d'erreur sont signalés en rouge, les avertissements en jaune.

 

Effacer l'onglet Console + Network :

Microsoft Edge DevTools avec l'onglet Console et son icône d'effacement mis en évidence dans un panneau, et l'onglet Network avec son icône d'effacement mis en évidence dans un second panneau en dessous.

Sortie Console + Network :

L'onglet Console de Microsoft Edge affichant un avertissement concernant des icônes enregistrées à nouveau, à côté de l'onglet Network listant plusieurs requêtes, dont moeerrorux.css, progress.gif et moe_status_icons.png.

Télécharger l'onglet Console + Network :

L'onglet Console de Microsoft Edge avec son menu contextuel (clic droit) ouvert et Save as mis en évidence, à côté de l'onglet Network avec son menu contextuel ouvert et Save all as HAR with content mis en évidence.

Firefox

Après avoir ouvert le menu (trois lignes) dans le coin supérieur droit de la fenêtre du navigateur et sélectionné « More Tools » > « Web Developer Tools », ou en appuyant sur F12, une colonne s'ouvre en bas. Il peut également être nécessaire de cliquer sur « Console » ou « Network ». Les messages d'erreur sont signalés en rouge, les problèmes en jaune. Si les erreurs ne sont pas toutes affichées simultanément, la fenêtre peut être agrandie en faisant glisser le bord de la console (flèche verte).

Effacer l'onglet Console + Network :

L'onglet Console de Firefox avec son icône d'effacement mis en évidence, à côté de l'onglet Network avec sa propre icône d'effacement mise en évidence au-dessus d'un message invitant à recharger la page pour plus de détails.

Sortie Console + Network :

L'onglet Console de Firefox affichant des avertissements concernant un cookie partitionné, une erreur d'analyse XML et un cookie sans attribut approprié, à côté de l'onglet Network listant des requêtes vers les domaines reporter.sosafe.de et appsforoffice.

Télécharger l'onglet Console + Network :

L'onglet Console de Firefox avec son menu contextuel ouvert et Save all Messages to File mis en évidence, à côté de l'onglet Network avec son menu contextuel ouvert et Save All As HAR mis en évidence.

Internet Explorer

Veuillez noter qu'Internet Explorer n'est plus pris en charge. Nous vous recommandons d'utiliser son successeur, Edge, à la place.

Après avoir appuyé sur F12, une colonne s'ouvre en bas. Il peut également être nécessaire de cliquer sur « Console ». Les messages d'erreur sont signalés en rouge, les avertissements en jaune. Si les erreurs ne sont pas toutes affichées simultanément, la fenêtre peut être agrandie en faisant glisser le bord de la console.

Cette traduction est automatisée. En cas de doute, consultez la version anglaise.

Articles associés