Comment récupérer les informations générées par les outils de développement de Chrome ?

[Adeline_Hochet]

This is a translated copy of: Troubleshooting Toolkit: How to retrieve network errors for HubSpot's French users. 

Parfois, vous rencontrerez une erreur sur une page qui n'est pas assez spécifique et qui requiert de chercher plus d'informations pour en trouver l’origine. Vous pouvez, par exemple, voir une image comme celle-ci :

Pour les erreurs comme celle-ci, la console JavaScript constitue un outil que vous pouvez utiliser et qui vous permettra d’obtenir plus d'informations. Vous trouverez dans certains cas des informations spécifiques qui vous guideront vers la solution directement dans la console. Si ce n’est pas le cas, les informations obtenues pourront néanmoins vous être utiles pour pour trouver une solution, comme le fait de disposer des informations relatives aux erreurs de réseau, qui envoyées en pièce jointe, peuvent considérablement accélérer le traitement de votre requête auprès de l’équipe support de HubSpot.

La console JavaScript de Google Chrome (vous pouvez également accéder à une console dans d'autres navigateurs) est un outil très utile qui peut montrer toutes les erreurs qui peuvent apparaître sur la page et fournir plus d'informations sur ce à quoi l’erreur fait référence. L’équipe support de HubSpot se tourne fréquemment vers la console pour plus d'informations sur les erreurs et demande souvent une capture d'écran de la console pour traiter les requêtes qui lui sont adressées.

Voici comment accéder à cette console :

Onglet Console

1. Ouvrir Chrome sur la page sur laquelle vous voyez des erreurs.
2. Faire un clic droit sur la page et sélectionner Inspecter. Vous pouvez également utiliser le raccourci clavier : Ctrl + Maj + J (Windows / Linux) ou Commande + Option + J (Mac).
3. Aller dans l’onglet Console.
4. Reproduire l’erreur que vous avez rencontrée.

L'onglet Console enregistre les erreurs ou les avertissements qui apparaissent sur la page. Par exemple, si une ressource ne parvient pas à charger sur la page, vous trouverez souvent l'erreur correspondante dans la console.

Onglet Network

1. Aller dans l’onglet Network.
2. Rafraîchir la page avec les erreurs.
3. Cliquer sur l’erreur et aller sur la droite dans les onglets Headers, Preview, et Response pour obtenir plus d’informations sur l’erreur

L'onglet Network affiche tous les éléments de chargement sur la page et leurs temps de chargement. Par exemple, s'il y a un fichier JavaScript attaché à la page, ce fichier JavaScript sera listé dans l'onglet Network lors du chargement de la page.

La plupart des erreurs et des ressources ayant échoué sont en rouge, il est alors nécessaire de prendre une capture d’écran de ces textes en rouge dans les onglets Console et Network et de les transmettre à l’équipe de support de HubSpot, en tant que pièce jointe dans votre requête.

Vous pouvez également sauvegarder un fichier HAR depuis l'onglet Network, comme expliqué ici. 

Pour plus d'informations sur la Console de Chrome, vous pouvez visiter cette page.

[LouisG]

Merci pour l'information...

[roisinkirby]

Thanks for sharing @Adeline_Hochet!