MDN may have intermittent access issues April 18 13:00 - April 19 01:00 UTC. See whistlepig.mozilla.org for all notifications.

mozilla

Revision 520881 of Console Web

  • Raccourci de la révision : Outils/Web_Console
  • Titre de la révision : Console Web
  • ID de la révision : 520881
  • Créé :
  • Créateur : milc
  • Version actuelle ? Non
  • Commentaire Ajout du chapitre sur les "reflows events"

Contenu de la révision

La Console Web:

  1. enregistre les informations associées à la page web : toutes les requêtes réseau, JavaScript, CSS, tout comme les erreurs et les avertissements de sécurité, ainsi que les erreurs, les avertissements et les messages d'information explicitement loggés par le code JavaScript s'éxecutant sur la page.
  2. vous permet d'intéragir avec la page web en éxecutant des expressions JavaScript dans le contexte de la page.

La Console Web remplace en partie la Console d'Erreurs intégrées à Firefox : mais la Console d'Erreurs montraient les erreurs, les avertissements et les messages de toutes les pages web, du code du navigateur, et des modules. Ceci rendait la lecture de ces messages très difficile. La Console Web est toujours associée à une page spécifique et ne montre que les informations associées à cette page.

L'autre partie remplaçant la Console d'Erreurs et la Console du Navigateur, qui montre les erreurs, les avertissements et les messages du code du navigateur et des modules.

Ouvrir la Console Web

Pour ouvrir la Console Web, sélectionnez "Console web" depuis le sous-menu "Développeur web" (dans le menu "Outils" si vous affichez la barre de menu ou que vous êtes sous Mac OS X), ou en appuyant sur le raccourci clavier Ctrl-Shift-K (Cmd-Option-K sur un Mac).

La boîte à outils apparaitra en bas de la fenêtre de votre navigateur, avec le Console Web activée (elle est simplement appelée "Console" dans la barre de le boîte d'outils.

Sous Console Web se découpe en trois sections :

  • Barre d'outils : en haut se trouve une barre d'outils avec des boutons "Réseau", "CSS, "JS", … Cette barre d'outils sert à filter les messages affichés.
  • Ligne de commande : en bas se trouve la ligne de commande que vous pouvez utiliser pour entrer des expressions JavaScript
  • Panneau d'affichage des messages : entre la barre d'outils et la ligne de commande, et occupant la majeure partie de la Console Web, se trouve l'espace servant à afficher les messages
     

Panneau d'affichage des messages

La majorité de la Console Web est occupé par le panneau d'affichage des messages :

Les messages suivant sont affichés :

  • Requêtes HTTP
  • Avertissements et erreurs (incluant JavaScript, CSS, avertissements et erreurs de sécurité, et les messages explicitement loggés dans le code JavaScript en utilisant l'API console)
  • Messages d'entrées/sorties: commandes envoyées au navigateur par la ligne de commande, et leurs résultats

Chaque message est affiché sur une nouvelle ligne.

Requêtes HTTP

Les requêtes HTTP sont affichées sous cette forme :

  • Time : le temps où le messages a été enregistré
  • Category : indique que ce message concerne une requête HTTP
  • Method : la méthode HTTP utilisée
  • URI : l'URI cible
  • Summary : la version HTTP, le code de statut, et le temps qu'il a fallu pour la terminer

Si vous cliquez sur le message, vous verrez une fenêtre contenant plus de détails sur la requête et la réponse :

Par défaut, la Console Web n'enregistre pas les contenus de la requête et la réponse : pour le faire, activez le menu contextuel de la Console Web et choisissez "Journaliser le contenu des requêtes et des réponses". Rechargez la page, et vous les verrez dans cette fenêtre d'inspection.

Seulement le premier mega-octet des données est enregistré pour le contenu de chaque requête ou réponse. Les requêtes et les réponses très lourdes seront tronquées.

Avertissements et erreurs

Avertissements et erreurs sont affichés sous cette forme :

  • Time : le temps où le message a été enregistré
  • Category : indique le type de message :
    • Bleu : Avertissement/erreur CSS
    • Orange : Avertissement/erreur JavaScript
    • Rouge : Avertissement/erreur de sécurité
    • Gris léger : message explicitement loggé dans le code JavaScript en utilisant l'API console
  • Type : une icône indiquant s'il s'agit d'une erreur (☓) ou d'un avertissement (⚠).
  • Message : le message
  • Number of occurrences : si une ligne générant un avertissement ou une erreur apparait plus d'une fois, elle ne sera enregistré qu'une fois, et ce compteur apparaitra pour indiquer le nombre de fois qu'elle a été rencontrée
  • Filename and line number : un lien vers le fichier et sa ligne qui a généré le message

 

Les évènements de reflux

Les reflux sont logués à partir de Firefox Desktop 27+ et Firefox OS 1.3+.

La Console Web logue aussi les évènements de reflux. Un reflux est le nom donné à une opération pendant laquelle le navigateur calcule la disposition de tout ou partie de la page.
Les reflux se produisent lorsqu'un changement est arrivé dans la page et que la navigateur pense qu'il en affecte la disposition. Plusieurs évènements peuvent déclencher des reflux, incluant : redimensionner la fenêtre du navigateur, activer des pseudo-classes comme :hover ou manipuler le DOM en JavaScript.

Parce que les reflux peuvent très coûteux en calculs et affecter directement l'interface utilisateur, ils peuvent avoir un grand impact sur la réactivité d'un site ou d'une application web. En loguant les évènements de reflux, la Console Web peut vous donner une idée du moment ou les évènements de reflux sont déclenchés, combien de temps ils prennent à s'exécuter et, si les reflux sont des reflux synchrones déclenchés par du JavaScript, quel code les a déclenchés.

Les évènements de reflux sont logués dans la catégorie CSS, en tant que messages "Log", bien séparés des erreurs et avertissements CSS. Par défaut, ils sont désactivés. Vous pouvez les activer en cliquant sur le bouton "CSS" dans la boîte à outils et en sélectionnant "Log".

Chaque message porte une étiquette "reflow" et montre le temps qui a fallu pour exécuter le reflux :


Si le reflux est synchrone et a été déclenché depuis du JavaScript, un lien vers la ligne de code qui a déclenché le reflux est aussi affiché :


Cliquez sur le lien pour ouvrir le fichier dans le Débogueur.

Reflux synchrones et asynchrones

Si un changement est fait et qu'il invalide la disposition courante - par exemple, la fenêtre du navigateur est redimensionnée ou du JavaScript modifie le CSS d'un élément - la disposition n'est pas recalculée immédiatement. A la place, le reflux se produit de façon asynchrone, lorsque le navigateur décide que c'est nécessaire (en général, lorsque le navigateur "repaints"). De cette façon, le navigateur peut enregistrer une série de changements invalidants et recalculer leurs effets en une seule fois. Cependant, si du code Javascript lit un style qui a été modifié, alors le navigateur doit réaliser un reflux asynchrone pour calculer le style calculé ("computed style") à retourner.

Par exemple, le code suivant provoque un reflux immédiat et synchrone au moment de l'appel à window.getComputedStyle(thing).height:

var thing = document.getElementById("the-thing");
thing.style.display = "inline-block";
var thingHeight = window.getComputedStyle(thing).height;

A cause de cela, c'est une bonne idée d'éviter l'entrelacement des appels en écriture et en lecture des styles d'un élément lors de la manipulation du DOM, parce que chaque fois que vous relisez un style qui a été invalidé par un précédent appel en écriture, vous forcez un reflux synchrone.

Messages d'entrée/sortie

Les commandes envoyées au navigateur en utilisant la ligne de commande de la Console Web, et les réponses correspondantes, sont affichés de cette façon :

La barre gris foncé indique qu'il s'agit de messages d'entrée/sortie, tandis que la direction de la flêche indique s'ils'agit d'une entrée ou d'une sortie.

Filtrer et rechercher

Vous pouvez utiliser la barre d'outils en haut pour filtrer l'affichage :

Vous pouvez afficher que certains types de messages, ou des messages contenant un texte en particulier.

Enfin, vous pouvez aussi vider la Console Web de tous ses messages.

L'interpréteur de lignes de commande

Vous pouvez traiter des expressions JavaScript en temps réel en utilisant la ligne de commande fournie avec la Console Web.

Opérations basiques

Entrer des expressions

Pour entrer des expressions, tapez juste dans la ligne de commande et appuyez sur "Entrée". Pout entrer des expressions de plusieurs lignes, utiliser "Shift+Entrée", au lieu de "Entrée".

L'expression que vous avez tapé, vous est retournée, suivi de son résulalt :

Accéder aux variables

Vous pouvez accéder aux variables définies dans la page, aussi bien les variables par défaut comme window, que les variables ajoutées par le code JavaScript comme jQuery :

Autocomplétion

La ligne de commande possède une autocomplétion : entrez les premières lettres et un popup apparait vous montrant les suggestions possibles :

Tapez "Entrer" ou "Tab" pour accepter une suggestion, utilisez les flêches haut/bas de votre clavier pour vous déplacer d'une suggestion à l'autre, ou continuez à taper si aucune suggestion ne vous convient.

Inspecter les objets

Si le résultat est un objet, il apparaît entre crochets et est souligné comme ceci [object Function]. Cliquez dessus pour voir apparaître un nouveau paneau contenant le détail de l'objet.

Pour faire partir le paneau, appuyez sur "Esc".

Définir des variables

Vous pouvez définir vos propres variables, et ensuite y accéder :

Historique des commandes

La ligne de commande se souvient des commandes que vous avez tapé : pour vous déplacer dans l'historique, utiliser les flêches haut et bas de votre clavier.

Raccourcis clavier

Raccourci Description
Restaure l'entrée précédente dans l'historique de la ligne de commande, ou si le popup d'autocomplétion est ouvert, met en évidence la suggestion précédente.
Restaure l'entrée suivant dans l'historique de la ligne de commande, ou si le popup d'autocomplétion est ouvert, met en évidence la suggestion suivante.
Ctrl-A Déplace le curseur au début de la ligne. (Note : à partir de Firefox 22, cela sélectionnera tout le texte sous Windows)
Ctrl-E Déplace le curseur à la fin de la ligne.
Entrée Execute le code tapé dans la ligne de commande, ou si le popup d'autocomplétion est ouvert, choisi l'actuel suggestion.
Shift-Entrée Augmente la hauteur du champ texte de la ligne de commande, d'une ligne.
Esc Annule le popup d'autocomplétion.
Tab Génère une suggestion d'autocomplétion et accepte la première.

Fonctions d'aide

{{ page("/fr/docs/Outils/Web_Console/Helpers", "Les commandes") }}

Voir également

Source de la révision

<p>La Console Web:</p>
<ol>
 <li>enregistre les informations associées à la page web : toutes les requêtes réseau, JavaScript, CSS, tout comme les erreurs et les avertissements de sécurité, ainsi que les erreurs, les avertissements et les messages d'information explicitement loggés par le code JavaScript s'éxecutant sur la page.</li>
 <li>vous permet d'intéragir avec la page web en éxecutant des expressions JavaScript dans le contexte de la page.</li>
</ol>
<p>La Console Web remplace en partie la <a href="/en-US/docs/Error_Console">Console d'Erreurs</a> intégrées à Firefox : mais la Console d'Erreurs montraient les erreurs, les avertissements et les messages de toutes les pages web, du code du navigateur, et des modules. Ceci rendait la lecture de ces messages très difficile. La Console Web est toujours associée à une page spécifique et ne montre que les informations associées à cette page.</p>
<p>L'autre partie remplaçant la Console d'Erreurs et la <a href="/en-US/docs/Tools/Browser_Console">Console du Navigateur,</a> qui montre les erreurs, les avertissements et les messages du code du navigateur et des modules.</p>
<h2 id="Ouvrir_la_Console_Web">Ouvrir la Console Web</h2>
<p>Pour ouvrir la Console Web, sélectionnez "Console web" depuis le sous-menu "Développeur web" (dans le menu "Outils" si vous affichez la barre de menu ou que vous êtes sous Mac OS X), ou en appuyant sur le raccourci clavier Ctrl-Shift-K (Cmd-Option-K sur un Mac).</p>
<p>La boîte à outils apparaitra en bas de la fenêtre de votre navigateur, avec le Console Web activée (elle est simplement appelée "Console" dans la barre de le boîte d'outils.</p>
<p><img alt="" src="https://mdn.mozillademos.org/files/5581/web-console.png" style="width: 913px; height: 1020px; display: block; margin-left: auto; margin-right: auto;" /></p>
<p>Sous Console Web se découpe en trois sections :</p>
<ul>
 <li><a href="#filtering-and-searching" title="#filtering-and-searching">Barre d'outils</a> : en haut se trouve une barre d'outils avec des boutons "Réseau", "CSS, "JS", … Cette barre d'outils sert à filter les messages affichés.</li>
 <li><a href="#command-line" title="#command-line">Ligne de commande</a> : en bas se trouve la ligne de commande que vous pouvez utiliser pour entrer des expressions JavaScript</li>
 <li><a href="#message-display-pane" title="#message-display-pane">Panneau d'affichage des messages</a> : entre la barre d'outils et la ligne de commande, et occupant la majeure partie de la Console Web, se trouve l'espace servant à afficher les messages<br />
  &nbsp;</li>
</ul>
<h2 id="Panneau_d'affichage_des_messages"><a name="message-display-pane">Panneau d'affichage des messages</a></h2>
<p>La majorité de la Console Web est occupé par le panneau d'affichage des messages :</p>
<p><img alt="" src="https://mdn.mozillademos.org/files/5599/web-console-messages-highlighted.png" style="width: 924px; height: 401px; display: block; margin-left: auto; margin-right: auto;" /></p>
<p>Les messages suivant sont affichés :</p>
<ul>
 <li>Requêtes HTTP</li>
 <li>Avertissements et erreurs (incluant JavaScript, CSS, avertissements et erreurs de sécurité, et les messages explicitement loggés dans le code JavaScript en utilisant l'API <a href="/en-US/docs/Web/API/console" title="/en-US/docs/Web/API/console">console</a>)</li>
 <li>Messages d'entrées/sorties: commandes envoyées au navigateur par la ligne de commande, et leurs résultats</li>
</ul>
<p>Chaque message est affiché sur une nouvelle ligne.</p>
<h3 id="Requ.C3.AAtes_HTTP">Requêtes HTTP</h3>
<p>Les requêtes HTTP sont affichées sous cette forme :</p>
<p><img alt="" src="https://mdn.mozillademos.org/files/5593/web-console-message-request-annotated.png" style="width: 664px; height: 139px; display: block; margin-left: auto; margin-right: auto;" /></p>
<ul>
 <li><strong>Time </strong>: le temps où le messages a été enregistré</li>
 <li><strong>Category </strong>: indique que ce message concerne une requête HTTP</li>
 <li><strong>Method </strong>: la méthode HTTP utilisée</li>
 <li><strong>URI</strong> : l'URI cible</li>
 <li><strong>Summary</strong> : la version HTTP, le code de statut, et le temps qu'il a fallu pour la terminer</li>
</ul>
<p>Si vous cliquez sur le message, vous verrez une fenêtre contenant plus de détails sur la requête et la réponse :</p>
<p><img alt="" src="https://mdn.mozillademos.org/files/3148/detailspanel.png" style="width: 430px; height: 502px; display: block; margin-left: auto; margin-right: auto;" />Par défaut, la Console Web n'enregistre pas les contenus de la requête et la réponse : pour le faire, activez le menu contextuel de la Console Web et choisissez "Journaliser le contenu des requêtes et des réponses". Rechargez la page, et vous les verrez dans cette fenêtre d'inspection.</p>
<p>Seulement le premier mega-octet des données est enregistré pour le contenu de chaque requête ou réponse. Les requêtes et les réponses très lourdes seront tronquées.</p>
<h3 id="Avertissements_et_erreurs">Avertissements et erreurs</h3>
<p>Avertissements et erreurs sont affichés sous cette forme :</p>
<p><img alt="" src="https://mdn.mozillademos.org/files/5585/web-console-message-annotated.png" style="width: 795px; height: 152px; display: block; margin-left: auto; margin-right: auto;" /></p>
<ul>
 <li><strong>Time </strong>: le temps où le message a été enregistré</li>
 <li><strong>Category </strong>: indique le type de message :
  <ul>
   <li><span style="color:#0099ff;"><strong>Bleu </strong></span>: Avertissement/erreur CSS</li>
   <li><strong><span style="color:#ff8c00;">Orange </span></strong>: Avertissement/erreur JavaScript</li>
   <li><span style="color:#ff0000;"><strong>Rouge</strong></span> : Avertissement/erreur de sécurité</li>
   <li><span style="color:#a9a9a9;"><strong>Gris léger </strong></span>: message explicitement loggé dans le code JavaScript en utilisant l'API <a href="/en-US/docs/Web/API/console" title="/en-US/docs/Web/API/console">console</a></li>
  </ul>
 </li>
 <li><strong>Type </strong>: une icône indiquant s'il s'agit d'une erreur (☓) ou d'un avertissement (⚠).</li>
 <li><strong>Message </strong>: le message</li>
 <li><strong>Number of occurrences</strong> : si une ligne générant un avertissement ou une erreur apparait plus d'une fois, elle ne sera enregistré qu'une fois, et ce compteur apparaitra pour indiquer le nombre de fois qu'elle a été rencontrée</li>
 <li><strong>Filename and line number</strong> : un lien vers le fichier et sa ligne qui a généré le message</li>
</ul>
<p>&nbsp;</p>
<h3>Les évènements de reflux</h3>
<div class="geckoVersionNote">
 <p>Les reflux sont logués à partir de Firefox Desktop 27+ et Firefox OS 1.3+.</p>
</div>
<p>La Console Web logue aussi les évènements de reflux. Un reflux est le nom donné à une opération pendant laquelle le navigateur calcule la disposition de tout ou partie de la page.<br />
 Les reflux se produisent lorsqu'un changement est arrivé dans la page et que la navigateur pense qu'il en affecte la disposition. Plusieurs évènements peuvent déclencher des reflux, incluant : redimensionner la fenêtre du navigateur, activer des pseudo-classes comme :hover ou manipuler le DOM en JavaScript.<br />
 <br />
 Parce que les reflux peuvent très coûteux en calculs et affecter directement l'interface utilisateur, ils peuvent avoir un grand impact sur la réactivité d'un site ou d'une application web. En loguant les évènements de reflux, la Console Web peut vous donner une idée du moment ou les évènements de reflux sont déclenchés, combien de temps ils prennent à s'exécuter et, si les reflux sont des reflux synchrones déclenchés par du JavaScript, quel code les a déclenchés.<br />
 <br />
 Les évènements de reflux sont logués dans la catégorie CSS, en tant que messages "Log", bien séparés des erreurs et avertissements CSS. Par défaut, ils sont désactivés. Vous pouvez les activer en cliquant sur le bouton "CSS" dans la boîte à outils et en sélectionnant "Log".<br />
 <br />
 Chaque message porte une étiquette "reflow" et montre le temps qui a fallu pour exécuter le reflux :<br />
 <br />
 <img alt="" src="https://mdn.mozillademos.org/files/7087/web-console-reflow-asynch.png" style="width: 554px; height: 53px;" /><br />
 Si le reflux est synchrone et a été déclenché depuis du JavaScript, un lien vers la ligne de code qui a déclenché le reflux est aussi affiché :</p>
<p><img alt="" src="https://mdn.mozillademos.org/files/7089/web-console-reflow-synch.png" /><br />
 Cliquez sur le lien pour ouvrir le fichier dans le <a href="/en-US/docs/Tools/Debugger">Débogueur</a>.</p>
<h4>Reflux synchrones et asynchrones</h4>
<p>Si un changement est fait et qu'il invalide la disposition courante - par exemple, la fenêtre du navigateur est redimensionnée ou du JavaScript modifie le CSS d'un élément - la disposition n'est pas recalculée immédiatement. A la place, le reflux se produit de façon asynchrone, lorsque le navigateur décide que c'est nécessaire (en général, lorsque le navigateur <em>"repaints</em>"). De cette façon, le navigateur peut enregistrer une série de changements invalidants et recalculer leurs effets en une seule fois. Cependant, si du code Javascript lit un style qui a été modifié, alors le navigateur doit réaliser un reflux asynchrone pour calculer le style calculé ("<em>computed style</em>") à retourner.</p>
<p>Par exemple, le code suivant provoque un reflux immédiat et synchrone au moment de l'appel à window.getComputedStyle(thing).height:</p>
<pre>
var thing = document.getElementById("the-thing");
thing.style.display = "inline-block";
var thingHeight = window.getComputedStyle(thing).height;
</pre>
<p>A cause de cela, c'est une bonne idée d'éviter l'entrelacement des appels en écriture et en lecture des styles d'un élément lors de la manipulation du DOM, parce que chaque fois que vous relisez un style qui a été invalidé par un précédent appel en écriture, vous forcez un reflux synchrone.</p>
<h3 id="Messages_d'entr.C3.A9e.2Fsortie">Messages d'entrée/sortie</h3>
<p>Les commandes envoyées au navigateur en utilisant <a href="#command-line" title="#command-line">la ligne de commande de la Console Web</a>, et les réponses correspondantes, sont affichés de cette façon :</p>
<p><img alt="" src="https://mdn.mozillademos.org/files/5587/web-console-message-input-output.png" style="width: 554px; height: 68px; display: block; margin-left: auto; margin-right: auto;" />La barre gris foncé indique qu'il s'agit de messages d'entrée/sortie, tandis que la direction de la flêche indique s'ils'agit d'une entrée ou d'une sortie.</p>
<h3 id="Filtrer_et_rechercher"><a name="filtering-and-searching">Filtrer et rechercher</a></h3>
<p>Vous pouvez utiliser la barre d'outils en haut pour filtrer l'affichage :</p>
<p><img alt="" src="https://mdn.mozillademos.org/files/5601/web-console-toolbar-highlighted.png" style="width: 924px; height: 401px; display: block; margin-left: auto; margin-right: auto;" />Vous pouvez afficher que certains types de messages, ou des messages contenant un texte en particulier.</p>
<p>Enfin, vous pouvez aussi vider la Console Web de tous ses messages.</p>
<dl>
</dl>
<h2 id="L'interpr.C3.A9teur_de_lignes_de_commande"><a name="command-line">L'interpréteur de lignes de commande</a></h2>
<p>Vous pouvez traiter des expressions JavaScript en temps réel en utilisant la ligne de commande fournie avec la Console Web.</p>
<p><img alt="" src="https://mdn.mozillademos.org/files/5597/web-console-commandline-highlighted.png" style="width: 924px; height: 410px; display: block; margin-left: auto; margin-right: auto;" /></p>
<h3 id="Op.C3.A9rations_basiques">Opérations basiques</h3>
<h4 id="Entrer_des_expressions">Entrer des expressions</h4>
<p>Pour entrer des expressions, tapez juste dans la ligne de commande et appuyez sur "Entrée". Pout entrer des expressions de plusieurs lignes, utiliser "Shift+Entrée", au lieu de "Entrée".</p>
<p>L'expression que vous avez tapé, vous est retournée, suivi de son résulalt :</p>
<p><img alt="" src="https://mdn.mozillademos.org/files/5615/web-console-commandline-simple.png" style="width: 632px; height: 92px; display: block; margin-left: auto; margin-right: auto;" /></p>
<h4 id="Acc.C3.A9der_aux_variables">Accéder aux variables</h4>
<p>Vous pouvez accéder aux variables définies dans la page, aussi bien les variables par défaut comme <code>window</code>, que les variables ajoutées par le code JavaScript comme <code>jQuery </code>:</p>
<p><img alt="" src="https://mdn.mozillademos.org/files/5609/web-console-commandline-href.png" style="width: 632px; height: 89px; display: block; margin-left: auto; margin-right: auto;" /><img alt="" src="https://mdn.mozillademos.org/files/5611/web-console-commandline-jquery.png" style="width: 632px; height: 92px; display: block; margin-left: auto; margin-right: auto;" /></p>
<h4 id="Autocompl.C3.A9tion">Autocomplétion</h4>
<p>La ligne de commande possède une autocomplétion : entrez les premières lettres et un popup apparait vous montrant les suggestions possibles :</p>
<p><img alt="" src="https://mdn.mozillademos.org/files/5607/web-console-commandline-autocomplete.png" style="width: 632px; height: 125px; display: block; margin-left: auto; margin-right: auto;" />Tapez "Entrer" ou "Tab" pour accepter une suggestion, utilisez les flêches haut/bas de votre clavier pour vous déplacer d'une suggestion à l'autre, ou continuez à taper si aucune suggestion ne vous convient.</p>
<h4 id="Inspecter_les_objets">Inspecter les objets</h4>
<p>Si le résultat est un objet, il apparaît entre crochets et est souligné comme ceci <code><u>[object Function]</u></code>. Cliquez dessus pour voir apparaître un nouveau paneau contenant le détail de l'objet.</p>
<p><img alt="" src="https://mdn.mozillademos.org/files/5613/web-console-commandline-object-details.png" style="width: 860px; height: 351px; display: block; margin-left: auto; margin-right: auto;" />Pour faire partir le paneau, appuyez sur "Esc".</p>
<h4 id="D.C3.A9finir_des_variables">Définir des variables</h4>
<p>Vous pouvez définir vos propres variables, et ensuite y accéder :</p>
<p><img alt="" src="https://mdn.mozillademos.org/files/5605/web-console-commandline-addvariable.png" style="width: 632px; height: 125px; display: block; margin-left: auto; margin-right: auto;" /><img alt="" src="https://mdn.mozillademos.org/files/5603/web-console-commandline-addfunction.png" style="width: 632px; height: 168px; display: block; margin-left: auto; margin-right: auto;" /></p>
<h4 id="Historique_des_commandes">Historique des commandes</h4>
<p>La ligne de commande se souvient des commandes que vous avez tapé : pour vous déplacer dans l'historique, utiliser les flêches haut et bas de votre clavier.</p>
<h3 id="Raccourcis_clavier">Raccourcis clavier</h3>
<table class="standard-table" style="width: auto;">
 <tbody>
  <tr>
   <td class="header">Raccourci</td>
   <td class="header">Description</td>
  </tr>
  <tr>
   <td>↑</td>
   <td>Restaure l'entrée précédente dans l'historique de la ligne de commande, ou si le popup d'autocomplétion est ouvert, met en évidence la suggestion précédente.</td>
  </tr>
  <tr>
   <td>↓</td>
   <td>Restaure l'entrée suivant dans l'historique de la ligne de commande, ou si le popup d'autocomplétion est ouvert, met en évidence la suggestion suivante.</td>
  </tr>
  <tr>
   <td>Ctrl-A</td>
   <td>Déplace le curseur au début de la ligne. (Note : à partir de Firefox 22, cela sélectionnera tout le texte sous Windows)</td>
  </tr>
  <tr>
   <td>Ctrl-E</td>
   <td>Déplace le curseur à la fin de la ligne.</td>
  </tr>
  <tr>
   <td>Entrée</td>
   <td>Execute le code tapé dans la ligne de commande, ou si le popup d'autocomplétion est ouvert, choisi l'actuel suggestion.</td>
  </tr>
  <tr>
   <td>Shift-Entrée</td>
   <td>Augmente la hauteur du champ texte de la ligne de commande, d'une ligne.</td>
  </tr>
  <tr>
   <td>Esc</td>
   <td>Annule le popup d'autocomplétion.</td>
  </tr>
  <tr>
   <td>Tab</td>
   <td>Génère une suggestion d'autocomplétion et accepte la première.</td>
  </tr>
 </tbody>
</table>
<h3 id="Fonctions_d'aide">Fonctions d'aide</h3>
<p>{{ page("/fr/docs/Outils/Web_Console/Helpers", "Les commandes") }}</p>
<dl>
</dl>
<h2 id="Voir_.C3.A9galement">Voir également</h2>
<ul>
 <li><a href="/fr/docs/Outils/Web_Console/Helpers">Fonctions d'aide de la Console Web</a></li>
 <li>{{ domxref("console") }}</li>
</ul>
Revenir à cette révision