diff --git a/files/fr/web/api/console/api-trace2.png b/files/fr/web/api/console/api-trace2.png new file mode 100644 index 00000000000000..138f9b21ce666c Binary files /dev/null and b/files/fr/web/api/console/api-trace2.png differ diff --git a/files/fr/web/api/console/assert_static/index.md b/files/fr/web/api/console/assert_static/index.md index f95fa2b68c8fc4..e312bee4ea7362 100644 --- a/files/fr/web/api/console/assert_static/index.md +++ b/files/fr/web/api/console/assert_static/index.md @@ -1,38 +1,63 @@ --- -title: Console.assert() +title: "console : méthode statique assert()" slug: Web/API/console/assert_static -original_slug: Web/API/console/assert +l10n: + sourceCommit: 022399901bdc60df947ee15e11a49be029e290d0 --- {{APIRef("Console API")}} -Affiche un message d'erreur dans la console si l'assertion est fausse. Si l'assertion est vraie, rien ne se produit. +La méthode **`console.assert()`** permet d'écrire un message d'erreur dans la console si l'assertion passée en argument est fausse. Si l'assertion est bien vérifiée, rien ne se passe. {{AvailableInWorkers}} -> **Note :** _La méthode `console.assert()` est implémentée différement dans les vieilles version de Node.js que dans celle disponible dans les navigateurs._ -> -> Plus précisément, dans les navigateurs, appeler `console.assert()` avec une condition fausse affichera le `message` dans la console sans interrompre l'éxecution du code suivant. Dans les versions inférieure à la v10 de Node.js, cependant, une assertion fausse lèvera une exception `AssertionError`. Cette différence de comportement a été corrigée par la v10 de Node et `console.assert()` se comporte maintenant de la même façon dans Node et dans les navigateurs. - ## Syntaxe -```js -console.assert(assertion, obj1 [, obj2, ..., objN]); -console.assert(assertion, msg [, subst1, ..., substN]); +```js-nolint +assert(assertion, obj1) +assert(assertion, obj1, obj2) +assert(assertion, obj1, obj2, /* …, */ objN) + +assert(assertion, msg) +assert(assertion, msg, subst1) +assert(assertion, msg, subst1, /* …, */ substN) ``` ### Paramètres - `assertion` - - : N'importe quelle expression booléenne. Si l'assertion est fausse, le message s'affichera dans la console. -- `obj1` ... `objN` - - : Une liste d'objets javascript à afficher. La représentation textuelle de chacun de ces objets est ajoutée à la suite de la précédente dans l'ordre donné et est ensuite affichée. + - : Une expression booléenne. Si l'assertion est fausse, le message est affiché dans la console. +- `obj1` … `objN` + - : Une liste d'objets JavaScript à afficher. Les représentations en chaînes de caractères de ces objets sont concaténés dans l'ordre et affichés dans la console. - `msg` - - : Une chaîne de caractères javascript contenant zéro ou plus chaîne(s) de caractères de substitution. -- `subst1` ... `substN` - - : L'objet javascript avec lequel remplacer les chaînes de substitution dans `msg`. Ceci vous offre plus de contrôle sur ce qui est affiché. + - : Une chaîne de caractères JavaScript qui contient zéro ou plusieurs chaînes de substitution. +- `subst1` … `substN` + - : Des objets JavaScript avec lesquels remplacer les chaînes de substitution dans `msg`. Ce paramètre permet un contrôle supplémentaire sur le format de ce qui est affiché. + +### Valeur de retour + +Aucune ([`undefined`](/fr/docs/Web/JavaScript/Reference/Global_Objects/undefined)). + +## Exemples -Allez voir [Afficher du texte dans la console](/fr/docs/Web/API/console#Outputting_text_to_the_console) dans la documentation de {{domxref("console")}} pour plus de détails. +Dans l'exemple suivant, on illustre comment utiliser un objet comme deuxième argument : + +```js +const messageErreur = "le nombre n'est pas pair"; +for (let nombre = 2; nombre <= 5; nombre++) { + console.log(`le nombre est ${nombre}`); + console.assert(nombre % 2 === 0, "%o", { nombre, messageErreur }); +} +// Ce qui est affiché dans la console : +// le nombre est 2 +// le nombre est 3 +// Assertion failed: {nombre: 3, messageErreur: "le nombre n'est pas pair"} +// le nombre est 4 +// le nombre est 5 +// Assertion failed: {nombre: 5, messageErreur: "le nombre n'est pas pair"} +``` + +Voir [la page sur les chaînes de caractères de substitution avec `console`](/fr/docs/Web/API/console#utiliser_les_caractères_de_substitution) pour plus de détails. ## Spécifications @@ -41,10 +66,3 @@ Allez voir [Afficher du texte dans la console](/fr/docs/Web/API/console#Outputti ## Compatibilité des navigateurs {{Compat}} - -## Voir aussi - -- [WHATWG Console Standard: console.assert](https://console.spec.whatwg.org/#assert-condition-data) -- [Opera Dragonfly documentation: Console](http://www.opera.com/dragonfly/documentation/console/) -- [MSDN: Using the F12 Tools Console to View Errors and Status](http://msdn.microsoft.com/library/gg589530) -- [Chrome Developer Tools: Using the Console](https://developer.chrome.com/devtools/docs/console#assertions) diff --git a/files/fr/web/api/console/clear_static/index.md b/files/fr/web/api/console/clear_static/index.md index 12bb5a55cfbd81..bfc0f5e59ae003 100644 --- a/files/fr/web/api/console/clear_static/index.md +++ b/files/fr/web/api/console/clear_static/index.md @@ -1,23 +1,28 @@ --- -title: clear() +title: "console : méthode statique clear()" slug: Web/API/console/clear_static -original_slug: Web/API/console/clear +l10n: + sourceCommit: 022399901bdc60df947ee15e11a49be029e290d0 --- {{APIRef("Console API")}} -Vide la console. - -Tous les messages de la console seront supprimés et remplacés par un message de confirmation ("Console was cleared"). - -À noter: sur Google Chrome, `console.clear()` n'a aucun effet si l'utilisateur a coché "Preserve log upon navigation" dans les [paramètres de l'inspecteur](https://developer.chrome.com/devtools/docs/settings#preserve-log%20upon%20navigation). +La méthode **`console.clear()`** vide l'affichage de la console, si celle-ci le permet. Une console graphique, comme celle utilisée par les navigateurs, autorisera ce vidage, tandis qu'une console affichée dans un terminal (comme celle de Node.js), ne prendra pas en charge ce comportement et la méthode n'aura pas d'effet (et ne déclenchera pas d'erreur non plus). ## Syntaxe -```js -console.clear(); +```js-nolint +clear() ``` +### Paramètres + +Aucune. + +### Valeur de retour + +Aucune ([`undefined`](/fr/docs/Web/JavaScript/Reference/Global_Objects/undefined)). + ## Spécifications {{Specifications}} @@ -25,9 +30,3 @@ console.clear(); ## Compatibilité des navigateurs {{Compat}} - -## Voir aussi - -- [Opera Dragonfly documentation: Console](http://www.opera.com/dragonfly/documentation/console/) -- [MSDN: Using the F12 Tools Console to View Errors and Status](http://msdn.microsoft.com/library/gg589530) -- [Chrome Developer Tools: Using the Console](https://developer.chrome.com/devtools/docs/console#assertions) diff --git a/files/fr/web/api/console/console-timelog.png b/files/fr/web/api/console/console-timelog.png new file mode 100644 index 00000000000000..9f21845c92d618 Binary files /dev/null and b/files/fr/web/api/console/console-timelog.png differ diff --git a/files/fr/web/api/console/count_static/index.md b/files/fr/web/api/console/count_static/index.md index a310607cd9dce5..1c4898ac613b43 100644 --- a/files/fr/web/api/console/count_static/index.md +++ b/files/fr/web/api/console/count_static/index.md @@ -1,83 +1,91 @@ --- -title: Console.count() +title: "console : méthode statique count()" slug: Web/API/console/count_static -original_slug: Web/API/console/count +l10n: + sourceCommit: 022399901bdc60df947ee15e11a49be029e290d0 --- {{APIRef("Console API")}} -Affiche dans la console le nombre de fois où la fonction `count()` a été appelée. Cette fonction accepte l'argument optionnel `label`. +La méthode **`console.count()`** affiche le nombre de fois que `count()` a été appelée (le compteur pouvat être identifié par l'argument passé à la méthode). {{AvailableInWorkers}} -Si un `label` est passé en paramètre, la fonction affiche le nombre de fois où la fonction `count()` a été appelée pour ce `label` spécifiquempent. +## Syntaxe + +```js-nolint +count() +count(libelle) +``` + +### Paramètres + +- `libelle` {{Optional_Inline}} + - : Une chaîne de caractères. Si cet argument est fourni, `count()` affiche le nombre de fois qu'elle a été appelée avec ce libellé. Si cet argument est absent, `count()` se comporte comme si elle avait été appelée avec le libellé `"default"`. -Si aucun `label` est passé en paramètre, la fonction affiche le nombre de fois où la fonction `count()` a été appelée jusqu'à présent. +### Valeur de retour -Ci-dessous, un exemple d'utilisation : +Aucune ([`undefined`](/fr/docs/Web/JavaScript/Reference/Global_Objects/undefined)). + +## Exemples + +Prneons le code suivant : ```js -function greet() { +let personne = ""; + +function salutation() { console.count(); - return "hi " + user; + return `Coucou ${personne}`; } -var user = "bob"; -greet(); -user = "alice"; -greet(); -greet(); +personne = "bob"; +salutation(); +personne = "alice"; +salutation(); +salutation(); console.count(); ``` -La console affichera les lignes suivantes : +L'affichage dans la console ressemblera à : -``` -": 1" -": 2" -": 3" -": 1" +```plain +"default: 1" +"default: 2" +"default: 3" +"default: 4" ``` -A noter, la dernière ligne inscrite dans la console fait référence à l'appel de la fonction `count()` de la ligne 11 qui est traité comme un événement indépendant. +On voit que le libellé affiché est `default`, car aucun libellé explicite n'a été fourni à `count()`. -Si la variable `user` est passée à la fonction comme paramètre `label`, le code ci-dessous génèrera un nouveau compteur lorsque la variable `user` sera modifiée : +Si on passe la variable `personne` comme argument pour le premier appel à `count()`, puis la chaîne de caractères `"alice"` lors du second appel : ```js -function greet() { - console.count(user); - return "hi " + user; +let personne = ""; + +function salutation() { + console.count(personne); + return `Coucou ${personne}`; } -var user = "bob"; -greet(); -user = "alice"; -greet(); -greet(); +personne = "bob"; +salutation(); +personne = "alice"; +salutation(); +salutation(); console.count("alice"); ``` -La console affichera les lignes suivantes : +On obtiendra ce résultat : -``` +```plain "bob: 1" "alice: 1" "alice: 2" "alice: 3" ``` -Nous obtenons maintenant deux compteurs distinct basés sur un libellé différent. L'appel de la fonction `count()` avec "alice" à la ligne 11 n'est pas considéré comme un événement indépendant car le compteur existe déjà. - -## Syntaxe - -```js -console.count([label]); -``` - -## Paramètres - -- `label` - - : Une chaîne de caractères. Si ce paramètre est renseigné, `count()` affiche le nombre de fois que la fonction a été appelée jusqu'à présent avec ce libellé. S'il est omis, `count()` affiche le nombre de fois que la fonction a été appelée sur cette ligne. +Et on peut ici compter le nombre d'appels en fonction du libellé passé en argument. ## Spécifications diff --git a/files/fr/web/api/console/countreset_static/index.md b/files/fr/web/api/console/countreset_static/index.md index cf30d64e49c591..85190af6d1f968 100644 --- a/files/fr/web/api/console/countreset_static/index.md +++ b/files/fr/web/api/console/countreset_static/index.md @@ -1,109 +1,87 @@ --- -title: Console.countReset() +title: "console : méthode statique countReset()" slug: Web/API/console/countreset_static -original_slug: Web/API/console/countReset +l10n: + sourceCommit: 022399901bdc60df947ee15e11a49be029e290d0 --- {{APIRef("Console API")}} -Remet le compteur à zero. Cette fonction prend un argument optionnel `label` +La méthode **`console.countReset()`** permet de réinitialiser le compteur utilisé avec [`console.count()`](/fr/docs/Web/API/console/count). {{AvailableInWorkers}} ## Syntaxe +```js-nolint +countReset() +countReset(libelle) ``` -console.countReset([label]); -``` - -### Parameters - -- `label` - - : Si specifié, `countReset()` remet à zero le compteur associé à ce label. S'il n'est pas specifié, `countReset()` remet à zéro le compteur par defaut. - -### Return value - -Si le paramètre label à été spécifié : - -``` -counter-name: 0 -``` - -Si aucun label n'as été specifié - -``` -default: 0 -``` - -### Warnings -Si `label` est specifié mais n'existe pas `countReset()` renvoie cet avertissement : +### Paramètres -``` -Counter "counter-name" doesn’t exist. -``` +- `libelle` {{optional_inline}} + - : Une chaîne de caractères. Si cet argument est fourni, `countReset()` remet à zéro le compteur associé à ce libellé. Si l'argumetn est absent, `countReset()` remet à zéro le compteur par défaut. -Si `label` n'est pas specifé et que `count()` n'as pas encore été appellé `countReset()` renvoie cette avertissement : +### Valeur de retour -``` -Counter "default" doesn’t exist. -``` +Aucune ([`undefined`](/fr/docs/Web/JavaScript/Reference/Global_Objects/undefined)). -## Examples +## Exemples -Par exemple avec un code comme celui ci : +Prenons le code suivant par exemple : ```js -var user = ""; +let personne = ""; -function greet() { +function salutations() { console.count(); - return "hi " + user; + return `Coucou ${personne}`; } -user = "bob"; -greet(); -user = "alice"; -greet(); -greet(); +personne = "bob"; +salutations(); +personne = "alice"; +salutations(); +salutations(); console.count(); console.countReset(); ``` -Le retour de la console ressemblera à ceci : +La console affichera ce qui suit : -``` +```plain "default: 1" "default: 2" "default: 3" -"default: 1" +"default: 4" "default: 0" ``` -Pour information l'appel à `console.counterReset()` remet à zero la valeur du compteur par défaut. +On voit que l'appel à `console.counterReset()` réinitialise la valeur du compteur par défaut à 0. -S'il on passe la variable `user` comme argument pour `label` et que l'on effectue un premier appel de la fonction `count()`, avec la chaine "bob" puis un second appel avec la chaine "alice" : +Si on passe la variable `personne` en paramètre pour le libellé (ici d'abord avec `"bob"`, puis avec `"alice"`) : ```js -var user = ""; +let personne = ""; -function greet() { - console.count(user); - return "hi " + user; +function salutations() { + console.count(personne); + return `Coucou ${personne}`; } -user = "bob"; -greet(); -user = "alice"; -greet(); -greet(); +personne = "bob"; +salutations(); +personne = "alice"; +salutations(); +salutations(); console.countReset("bob"); console.count("alice"); ``` -On obtiendra ce retour dans la console +On obtiendra le résultat suivant : -``` +```plain "bob: 1" "alice: 1" "alice: 2" @@ -111,7 +89,7 @@ On obtiendra ce retour dans la console "alice: 3" ``` -Remettre à zero le compteur "bob" change uniquement la valeur de celui-ci. La valeur du compteur "alice" reste inchangée. +En réinitialisant la valeur du compteur `"bob"`, on ne modifie pas pour autant le compteur `"alice"`. ## Spécifications diff --git a/files/fr/web/api/console/css-styling.png b/files/fr/web/api/console/css-styling.png new file mode 100644 index 00000000000000..18281e412492f6 Binary files /dev/null and b/files/fr/web/api/console/css-styling.png differ diff --git a/files/fr/web/api/console/debug_static/index.md b/files/fr/web/api/console/debug_static/index.md index 82dda333619ef3..1a2c3cee3ffe6c 100644 --- a/files/fr/web/api/console/debug_static/index.md +++ b/files/fr/web/api/console/debug_static/index.md @@ -1,14 +1,13 @@ --- -title: console.debug() +title: "console : méthode statique debug()" slug: Web/API/console/debug_static -original_slug: Web/API/console/debug +l10n: + sourceCommit: 022399901bdc60df947ee15e11a49be029e290d0 --- {{APIRef("Console API")}} -La méthode **`console.debug()`** affiche un message dans la console web avec le niveau « débogage/debug ». Le message est visible uniquement si la console est configurée pour afficher ce niveau de journalisation. - -Pour la plupart des cas, le niveau de journalisation visible se configure via l'interface utilisateur de la console. Le niveau de débogage de cette méthode correspond au niveau `Debug` ou `Verbose` en anglais. +La méthode **`console.debug()`** affiche un message dans la console pour le débogage. Ce message sera uniquement affiché si la console est configurée pour afficher les messages de débogage. Dans la plupart des cas, le niveau de journalisation se paramètre via l'interface utilisateur de la console. Le niveau de journalisation pourra par exemple être `Débogage` ou `Verbeux`. {{AvailableInWorkers}} @@ -24,13 +23,13 @@ debug(msg, subst1, /* …, */ substN) ### Paramètres - `obj1` … `objN` - - : Une liste d'objets JavaScript à afficher dans la sortie. Les représentations en chaînes de caractères de ces objets sont concaténées dans l'ordre des arguments puis cette concaténation est affichée dans la console. + - : Une liste d'objets JavaScript à afficher. Les représentations en chaînes de caractères de ces objets sont concaténés dans l'ordre et affichés dans la console. - `msg` - - : Une chaîne de caractères JavaScript contenant zéro ou plusieurs chaînes de caractères de substitution, remplacées respectivement par `subst1`, `substN`. + - : Une chaîne de caractères JavaScript qui contient zéro ou plusieurs chaînes de substitution qui seront remplacées par `subst1` … `substN` dans l'ordre. - `subst1` … `substN` - - : Des objets JavaScript à utiliser pour remplacer les chaînes de substitution de `msg`. Cela fournit un contrôle supplémentaire sur le format de la sortie. Voir [Utiliser les chaînes de caractères de substitution](/fr/docs/Web/API/Console#utiliser_les_caractères_de_substitution) qui décrit le fonctionnement des substitutions. + - : Des objets JavaScript avec lesquels remplacer les chaînes de substitution dans `msg`. Ce paramètre permet un contrôle supplémentaire sur le format de ce qui est affiché. Voir [la page sur les chaînes de caractères de substitution avec `console`](/fr/docs/Web/API/console#utiliser_les_caractères_de_substitution) pour plus de détails. -Voir [Afficher du texte dans la console](/fr/docs/Web/API/Console#afficher_du_texte_dans_la_console) dans la documentation de l'objet [`console`](/fr/docs/Web/API/Console) pour plus de détails. +Voir [Afficher du texte dans la console](/fr/docs/Web/API/console#afficher_du_texte_dans_la_console) pour plus de détails. ### Valeur de retour diff --git a/files/fr/web/api/console/dir_static/index.md b/files/fr/web/api/console/dir_static/index.md index 5c39348c5ec047..12ba31febc6a24 100644 --- a/files/fr/web/api/console/dir_static/index.md +++ b/files/fr/web/api/console/dir_static/index.md @@ -1,29 +1,34 @@ --- -title: console.dir() +title: "console : méthode statique dir()" slug: Web/API/console/dir_static -original_slug: Web/API/console/dir +l10n: + sourceCommit: 022399901bdc60df947ee15e11a49be029e290d0 --- {{APIRef("Console API")}} -La méthode **`console.dir()`** affiche une liste interactive des propriétés de l'objet JavaScript passé en argument. La sortie est présentée comme une liste hiérarchique avec des triangles qui permettent de développer l'arborescence de l'objet et de voir le contenu des objets descendants. +La méthode **`console.dir()`** affiche une liste interactive des propriétés de l'objet JavaScript passé en argument. L'affichage est une hiérarchie avec des flèches/triangles qui permettent de déplier/replier le contneu des propriétés et objets enfants. -Autrement dit, `console.dir()` permet de voir l'ensemble des propriétés d'un objet JavaScript dans la console. +Autrement dit, `console.dir()` permet de voir l'ensemble des propriétés d'un objet JavaScript dans la console et de manipuler les niveaux hiérarchiques. {{AvailableInWorkers}} -![Une capture d'écran de l'instruction console.dir() où on peut voir les propriétés de `document.location`](console-dir.png) +![console-dir.png](console-dir.png) ## Syntaxe -```js -console.dir(object); +```js-nolint +dir(objet) ``` ### Paramètres -- `object` - - : Un objet JavaScript dont on souhaite afficher les propriétés dans la console. +- `objet` + - : Un objet JavaScript dont on souhaite afficher les propriétés. + +### Valeur de retour + +Aucune ([`undefined`](/fr/docs/Web/JavaScript/Reference/Global_Objects/undefined)). ## Spécifications @@ -35,5 +40,5 @@ console.dir(object); ## Voir aussi -- [Microsoft Docs : référence de l'API Console](https://docs.microsoft.com/fr-fr/microsoft-edge/devtools-guide-chromium/console/api#dir) -- [Chrome : référence de l'API Console (en anglais)](https://developer.chrome.com/docs/devtools/console/api/#dir) +- [La documentation Edge sur `console.dir()`](https://learn.microsoft.com/fr-fr/microsoft-edge/devtools-guide-chromium/console/utilities#dir) +- [La documentation Chrome sur `console.dir()`](https://developer.chrome.com/docs/devtools/console/api/#dir) diff --git a/files/fr/web/api/console/dirxml_static/index.md b/files/fr/web/api/console/dirxml_static/index.md index 1be6d846c7700f..8bfc054df502fc 100644 --- a/files/fr/web/api/console/dirxml_static/index.md +++ b/files/fr/web/api/console/dirxml_static/index.md @@ -1,21 +1,28 @@ --- -title: Console.dirxml() +title: "console : méthode statique dirxml()" slug: Web/API/console/dirxml_static -original_slug: Web/API/console/dirxml +l10n: + sourceCommit: 022399901bdc60df947ee15e11a49be029e290d0 --- -{{APIRef ("Console API")}}Affiche un arbre interactif des éléments descendants de l'élément XML / HTML spécifié. S'il n'est pas possible d'afficher en tant qu'élément, la vue Objet JavaScript est affichée à la place. La sortie est présentée sous la forme d'une liste hiérarchique des noeuds extensibles qui vous permettent de voir le contenu des nœuds enfants. +{{APIRef("Console API")}} + +La méthode **`console.dirxml()`** affiche un arbre hiérarchique des éléments enfants de l'élément XML/HTML passé en argument. Si l'affichage sous la forme d'un élément n'est pas possible, l'argument est affiché comme un objet JavaScript. ## Syntaxe -```js -console.dirxml(object); +```js-nolint +dirxml(objet) ``` -## Paramètres +### Paramètres + +- `objet` + - : Un objet JavaScript dont on souhaite afficher les propriétés. + +### Valeur de retour -- `object` - - : Un objet JavaScript dont les propriétés doivent être sorties. +Aucune ([`undefined`](/fr/docs/Web/JavaScript/Reference/Global_Objects/undefined)). ## Spécifications @@ -24,7 +31,3 @@ console.dirxml(object); ## Compatibilité des navigateurs {{Compat}} - -## Voir aussi - -- [Opera Dragonfly documentation: Console](http://www.opera.com/dragonfly/documentation/console/) diff --git a/files/fr/web/api/console/error_static/index.md b/files/fr/web/api/console/error_static/index.md index b74518a61a062a..5ccf3560d5e9a7 100644 --- a/files/fr/web/api/console/error_static/index.md +++ b/files/fr/web/api/console/error_static/index.md @@ -1,36 +1,39 @@ --- -title: console.error() +title: "console : méthode statique error()" slug: Web/API/console/error_static -original_slug: Web/API/console/error +l10n: + sourceCommit: 022399901bdc60df947ee15e11a49be029e290d0 --- {{APIRef("Console API")}} -Affiche un message d'erreur dans la console du navigateur. +La méthode **`console.error()`** permet d'afficher un message d'erreur dans la console. {{AvailableInWorkers}} ## Syntaxe -```js -console.error(obj1 [, obj2, ..., objN]); -console.error(msg [, subst1, ..., substN]); -console.exception(obj1 [, obj2, ..., objN]); -console.exception(msg [, subst1, ..., substN]); +```js-nolint +error(obj1) +error(obj1, /* …, */ objN) +error(msg) +error(msg, subst1, /* …, */ substN) ``` -> **Note :** `console.exception()` est un alias de `console.error()`; ils sont fonctionnellement identiques. - ### Paramètres -- `obj1` ... `objN` - - : Une liste d'objets JavaScript à afficher. La représentation, en chaîne de caractéres, de chacun de ces objets est affichée dans l'ordre de la liste. +- `obj1` … `objN` + - : Une liste d'objets JavaScript à afficher. Les représentations en chaînes de caractères de ces objets sont concaténés dans l'ordre et affichés dans la console. - `msg` - - : Une chaîne de caractères JavaScript contenant zéro ou plusieurs subdivisions de chaîne de caractères. -- `subst1` ... `substN` - - : Une liste d'objets JavaScript qui remplace les chaînes de caractéres de `msg`. Cela vous donne plus de contrôle sur le format de sortie. + - : Une chaîne de caractères JavaScript qui contient zéro ou plusieurs chaînes de substitution qui seront remplacées par `subst1` … `substN` dans l'ordre. +- `subst1` … `substN` + - : Des objets JavaScript avec lesquels remplacer les chaînes de substitution dans `msg`. Ce paramètre permet un contrôle supplémentaire sur le format de ce qui est affiché. Voir [la page sur les chaînes de caractères de substitution avec `console`](/fr/docs/Web/API/console#utiliser_les_caractères_de_substitution) pour plus de détails. + +Voir [Afficher du texte dans la console](/fr/docs/Web/API/console#afficher_du_texte_dans_la_console) pour plus de détails. + +### Valeur de retour -Voir [Afficher du texte dans la console](/fr/docs/Web/API/console#Outputting_text_to_the_console) dans la documentation de {{domxref("console")}} pour plus de détails. +Aucune ([`undefined`](/fr/docs/Web/JavaScript/Reference/Global_Objects/undefined)). ## Spécifications @@ -42,6 +45,5 @@ Voir [Afficher du texte dans la console](/fr/docs/Web/API/console#Outputting_tex ## Voir aussi -- [Opera Dragonfly documentation: Console](http://www.opera.com/dragonfly/documentation/console/) -- [MSDN: Using the F12 Tools Console to View Errors and Status](http://msdn.microsoft.com/library/gg589530) -- [Chrome Developer Tools: Using the Console](https://developers.google.com/chrome-developer-tools/docs/console#errors_and_warnings) +- [La documentation Edge sur `console.error()`](https://learn.microsoft.com/en-us/microsoft-edge/devtools-guide-chromium/console/api#error) +- [La documentation Chrome sur `console.error()`](https://developer.chrome.com/docs/devtools/console/api/#error) diff --git a/files/fr/web/api/console/group_static/index.md b/files/fr/web/api/console/group_static/index.md index faf5e3bf3102c8..298a45c64d6502 100644 --- a/files/fr/web/api/console/group_static/index.md +++ b/files/fr/web/api/console/group_static/index.md @@ -1,50 +1,56 @@ --- -title: Console.group() +title: "console : méthode statique group()" slug: Web/API/console/group_static -original_slug: Web/API/console/group +l10n: + sourceCommit: 022399901bdc60df947ee15e11a49be029e290d0 --- {{APIRef("Console API")}} -Création d'un nouveau groupe en ligne dans la [console Web](/fr/docs/Tools/Web_Console). Cela indente les messages de console suivants par un niveau supplémentaire, jusqu'à ce que {{domxref("console.groupEnd()")}} soit appelé. +La méthode **`console.group()`** crée un nouveau groupe dans le journal affiché dans la console. Les messages affichés ensuite seront indentés d'un niveau jusqu'à ce que [`console.groupEnd()`](/fr/docs/Web/API/console/groupend_static) soit appelée. {{AvailableInWorkers}} ## Syntaxe -```js -console.group(); +```js-nolint +group() +group(libelle) ``` -## Paramètres +### Paramètres + +- `libelle` {{optional_inline}} + - : Un libellé pour identifier le groupe. + +### Valeur de retour -- `label` - - : donne une étiquette au groupe. Facultatif. (Chrome 59 testé). Ne fonctionne pas avec `console.groupEnd()`. +Aucune ([`undefined`](/fr/docs/Web/JavaScript/Reference/Global_Objects/undefined)). ## Exemples -Vous pouvez utiliser des groupes imbriqués pour organiser votre sortie en associant visuellement les messages correspondants. Pour créer un nouveau bloc imbriqué, appelez `console.group ()`. La méthode `console.groupCollapsed ()` est similaire, mais le nouveau bloc est réduit et nécessite de cliquer sur un bouton de divulgation pour le lire. +Vous pouvez utiliser des groupes imbriqués pour organiser l'affichage dans la console et regrouper les messages associés. Pour créer un nouveau bloc imbriqué, on appellera `console.group()`. La méthode [`console.groupCollapsed()`](/fr/docs/Web/API/console/groupcollapsed_static) est similaire, mais produit un groupe replié par défaut (il faut cliquer sur le symbole de dépliage pour voir les messages). -Pour sortir du groupe courant, appeler `console.groupEnd()`. Par exemple, étant donné ce code : +Pour clôturer le groupe courant, on appellera [`console.groupEnd()`](/fr/docs/Web/API/console/groupend_static). Par exemple, si on a écrit : ```js -console.log("This is the outer level"); +console.log("Il s'agit du niveau extérieur"); console.group(); -console.log("Level 2"); +console.log("Niveau 2"); console.group(); -console.log("Level 3"); -console.warn("More of level 3"); +console.log("Niveau 3"); +console.warn("Un avertissement au niveau 3"); console.groupEnd(); -console.log("Back to level 2"); +console.log("Retour au niveau 2"); console.groupEnd(); -console.log("Back to the outer level"); +console.log("Retour au niveau extérieur"); ``` -La sortie ressemble à ceci : +L'affichage dans la console ressemblera à ceci : -![Une capture d'écran de messages imbriqués dans la sortie de la console.](nesting.png) +![Une capture d'écran des messages imbriqués dans la sortie de la console.](nesting.png) -Pour plus de détail, se reporter à l'article [Using groups in the console](/fr/docs/Web/API/console#Using_groups_in_the_console) dans la documentation sur la {{domxref("console")}}. +Voir [Utiliser les groupes dans la console](/fr/docs/Web/API/Console#utiliser_des_groupes_dans_la_console) pour plus de détails. ## Spécifications @@ -56,4 +62,5 @@ Pour plus de détail, se reporter à l'article [Using groups in the console](/fr ## Voir aussi -- [Opera Dragonfly documentation: Console](http://www.opera.com/dragonfly/documentation/console/) +- [`console.groupEnd()`](/fr/docs/Web/API/console/groupend_static) +- [`console.groupCollapsed()`](/fr/docs/Web/API/console/groupcollapsed_static) diff --git a/files/fr/web/api/console/group_static/nesting.png b/files/fr/web/api/console/group_static/nesting.png new file mode 100644 index 00000000000000..39f461b03d3fa0 Binary files /dev/null and b/files/fr/web/api/console/group_static/nesting.png differ diff --git a/files/fr/web/api/console/groupcollapsed_static/index.md b/files/fr/web/api/console/groupcollapsed_static/index.md index 0e4d27f7b79f7f..dacd27895df83a 100644 --- a/files/fr/web/api/console/groupcollapsed_static/index.md +++ b/files/fr/web/api/console/groupcollapsed_static/index.md @@ -1,29 +1,35 @@ --- -title: Console.groupCollapsed() +title: "console : méthode statique groupCollapsed()" slug: Web/API/console/groupcollapsed_static -original_slug: Web/API/console/groupCollapsed +l10n: + sourceCommit: 022399901bdc60df947ee15e11a49be029e290d0 --- {{APIRef("Console API")}} -Crée un nouveau groupe intégré dans la console Web. Contrairement à {{domxref ("console.group ()")}}, le nouveau groupe est créé réduit. L'utilisateur devra utiliser le bouton de divulgation à côté pour le développer, en révélant les entrées créées dans le groupe. +La méthode **`console.groupCollapsed()`** crée un nouveau groupe dans le journal affiché dans la console. À la différence de [`console.group()`](/fr/docs/Web/API/console/group_static), le groupe créé ici est replié. La personne devra utiliser l'icône de dépliage pour révéler les informations du groupe. -Appellez {{domxref("console.groupEnd()")}} pour revenir au groupe parent. +Il faudra appeler [`console.groupEnd()`](/fr/docs/Web/API/console/groupend_static) pour fermer le groupe courant et revenir au niveau du groupe parent. -Voir [Using groups in the console](/fr/docs/Web/API/console#Using_groups_in_the_console) dans la documentation de {{domxref("console")}} pour plus de détails et des exemples. +Voir [Utiliser les groupes dans la console](/fr/docs/Web/API/Console#utiliser_des_groupes_dans_la_console) pour plus de détails et d'exemples. {{AvailableInWorkers}} ## Syntaxe -```js -console.groupCollapsed([label]); +```js-nolint +groupCollapsed() +groupCollapsed(libelle) ``` -## Paramètres +### Paramètres -- `label` - - : Étiquette pour le groupe. Facultatif. +- `libelle` {{optional_inline}} + - : Un libellé identifiant le groupe courant. + +### Valeur de retour + +Aucune ([`undefined`](/fr/docs/Web/JavaScript/Reference/Global_Objects/undefined)). ## Spécifications @@ -35,4 +41,5 @@ console.groupCollapsed([label]); ## Voir aussi -- [Opera Dragonfly documentation: Console](http://www.opera.com/dragonfly/documentation/console/) +- [`console.group()`](/fr/docs/Web/API/console/group_static) +- [`console.groupEnd()`](/fr/docs/Web/API/console/groupend_static) diff --git a/files/fr/web/api/console/groupend_static/index.md b/files/fr/web/api/console/groupend_static/index.md index f595bf8ef14e88..f0f2bdd2551592 100644 --- a/files/fr/web/api/console/groupend_static/index.md +++ b/files/fr/web/api/console/groupend_static/index.md @@ -1,25 +1,30 @@ --- -title: Console.groupEnd() +title: "console : méthode statique groupEnd()" slug: Web/API/console/groupend_static -original_slug: Web/API/console/groupEnd +l10n: + sourceCommit: 022399901bdc60df947ee15e11a49be029e290d0 --- {{APIRef("Console API")}} -Quitte le groupe en ligne actuel dans la [console Web](/fr/docs/Outils/Console_Web). Voir [Using groups in the console](/fr/docs/Web/API/console#Using_groups_in_the_console) dans la documentation {{domxref("console.group()")}} pour plus de détails et des exemples. +La méthode **`console.groupEnd()`** clôture le groupe courant dans la console. Voir [Utiliser les groupes dans la console](/fr/docs/Web/API/Console#utiliser_des_groupes_dans_la_console) pour plus de détails et d'exemples. {{AvailableInWorkers}} ## Syntaxe -```js -console.groupEnd(); +```js-nolint +groupEnd() ``` -## Paramètres +### Paramètres Aucun. +### Valeur de retour + +Aucune ([`undefined`](/fr/docs/Web/JavaScript/Reference/Global_Objects/undefined)). + ## Spécifications {{Specifications}} @@ -30,4 +35,5 @@ Aucun. ## Voir aussi -- [Opera Dragonfly documentation: Console](http://www.opera.com/dragonfly/documentation/console/) +- [`console.group()`](/fr/docs/Web/API/console/group_static) +- [`console.groupCollapsed()`](/fr/docs/Web/API/console/groupcollapsed_static) diff --git a/files/fr/web/api/console/index.md b/files/fr/web/api/console/index.md index e916c8bf6f3411..fd059fabccafd7 100644 --- a/files/fr/web/api/console/index.md +++ b/files/fr/web/api/console/index.md @@ -1,243 +1,262 @@ --- -title: Console +title: console slug: Web/API/console +l10n: + sourceCommit: 022399901bdc60df947ee15e11a49be029e290d0 --- {{APIRef("Console API")}} -L'objet **`console`** donne accès à la console de débogage du navigateur (par exemple, la [Console Web](/fr/docs/Tools/Web_Console) dans Firefox). Les spécificités de fonctionnement varient d'un navigateur à l'autre, mais il y a tout de même un ensemble de fonctionnalités qui sont fournies de base. +L'objet **`console`** permet d'accéder à la console de débogage de l'environnement JavaScript (par exemple [la console web](https://firefox-source-docs.mozilla.org/devtools-user/web_console/index.html) de Firefox). Son fonctionnement varie d'un navigateur à l'autre, mais certaines fonctionnalités sont standardisées et généralement fournies. -La `console` est accessible de n'importe quel objet global, {{domxref("Window")}} du cadre de navigation, {{domxref("WorkerGlobalScope")}} et ses variantes spécifiques pour les workers. Elle est exposée comme {{domxref ("Window.console")}} et peut être référencée simplement comme console. Par exemple : +On peut accéder à l'objet `console` depuis n'importe quel objet global, [`Window`](/fr/docs/Web/API/Window) pour les contextes de navigation classiques et [`WorkerGlobalScope`](/fr/docs/Web/API/WorkerGlobalScope) dans les workers, grâce à la propriété `console`. Exposé via [`Windows.console`](/fr/docs/Web/API/Window/console), on peut y faire référence avec `console`. Par exemple : ```js -console.log("Failed to open the specified link"); +console.log("Erreur à l'ouverture du lien indiqué."); ``` -Cette page documente les [méthodes](#méthodes) disponibles pour l'objet `console` et donne quelques [exemples d'utilisation](#exemples_dutilisation). +Dans cette page, nous verrons [les méthodes](#méthodes) disponibles sur l'objet `console` et donnerons quelques [cas d'utilisation](#cas_dutilisation). {{AvailableInWorkers}} -## Méthodes - -- {{domxref("Console.assert()")}} - - : Affiche un message et une trace d'appels dans la console si l'assertion en argument est à `false`. -- {{domxref("Console.clear()")}} - - : Vide la console. -- {{domxref("Console.count()")}} - - : Affiche le nombre de fois que la ligne a été appelée avec un label donné. -- {{domxref("Console.debug()")}} - - : Un alias de `log().` - -> **Note :** À partir de Chromium 58, cette méthode n'apparaît que dans les consoles de navigateur Chromium lorsque le niveau "Verbose" est sélectionné. - -- {{domxref("Console.dir()")}} {{Non-standard_inline}} - - : Affiche une liste interactive des propriétés d'un objet JavaScript donné. Cette liste vous permet d'examiner le contenu des enfants de l'objet en ouvrant les détails (petits triangles). -- {{domxref("Console.dirxml()")}} {{Non-standard_inline}} - - : Affiche si possible une représentation d'éléments XML/HTML d'un objet spécifié. Sinon, c'est une vue de l'objet JavaScript. -- {{domxref("Console.error()")}} - - : Affiche un message d'erreur. Vous pouvez utiliser les [caractères de substitution](/fr/docs/Web/API/console#Utiliser_les_caractères_de_substitution) et des arguments supplémentaires avec cette méthode. -- {{domxref("Console._exception()")}} {{Non-standard_inline}} {{deprecated_inline}} - - : Un alias d'`error();` -- {{domxref("Console.group()")}} - - : Crée un nouveau [groupe](/fr/docs/Web/API/console#Using_groups_in_the_console) en ligne, correspondant à un nouveau niveau d'indentation. Contrairement à `group()`. Pour revenir au niveau précédent, appeler `groupEnd()`. -- {{domxref("Console.groupCollapsed()")}} - - : Crée un nouveau [groupe](/fr/docs/Web/API/console#Using_groups_in_the_console) en ligne, correspondant à un nouveau niveau d'indentation. Contrairement à `group()` , cela commence avec le groupe en ligne effondré, nécessitant l'utilisation d'un bouton de divulgation pour l'agrandir. Pour revenir au niveau précédent, appeler `groupEnd()`. -- {{domxref("Console.groupEnd()")}} - - : Quitte le [groupe](/fr/docs/Web/API/console#Using_groups_in_the_console) d'indentation courant. -- {{domxref("Console.info()")}} - - : Affiche un message d'information. Vous pouvez utiliser les [caractères de substitution](/fr/docs/Web/API/console#Utiliser_les_caractères_de_substitution) et des arguments supplémentaires avec cette méthode. -- {{domxref("Console.log()")}} - - : Permet d'afficher des messages dans la console. Vous pouvez utiliser les [caractères de substitution](/fr/docs/Web/API/console#Utiliser_les_caractères_de_substitution) et des arguments supplémentaires avec cette méthode. -- {{domxref("Console.profile()")}} {{Non-standard_inline}} - - : démarre le profilage du navigateur (par exemple, l'[outil performances de Firefox](/fr/docs/Outils/Performance)). Vous pouvez spécifier un nom en option pour ce profil. -- {{domxref("Console.profileEnd()")}} {{Non-standard_inline}} - - : Arrête le profilage. Vous pouvez voir le résultat de ce dernier dans l'outil « performance » du navigateur (par exemple, l'[outil performance Firefox](/fr/docs/Outils/Performance)). -- {{domxref("Console.table()")}} - - : Affiche des données tabulaires comme un tableau. -- {{domxref("Console.time()")}} - - : Démarre un [chronomètre](/fr/docs/Web/API/console#Timers) que l'on peut nommer en le spécifiant en tant que paramètre. Jusqu'à 10 000 chronomètres simultanés peuvent tourner sur une page. -- {{domxref("Console.timeEnd()")}} - - : Arrête le [chronomètre](/fr/docs/Web/API/console#Timers) spécifié et affiche le temps écoulé en millisecondes depuis son démarrage. -- {{domxref("Console.timeStamp()")}} {{Non-standard_inline}} - - : Ajoute un marqueur dans la [Timeline](https://developer.chrome.com/devtools/docs/timeline) du navigateur ou l'outil [Waterfall](/fr/docs/Outils/Performance/Waterfall). -- {{domxref("Console.trace()")}} - - : Affiche une [trace d'appels](/fr/docs/Web/API/console#Traces_d%27appel). -- {{domxref("Console.warn()")}} - - : Affiche un message d'avertissement. Vous pouvez utiliser les [caractères de substitution](/fr/docs/Web/API/console#Utiliser_les_caractères_de_substitution) et des arguments supplémentaires avec cette méthode. - -## Exemples d'utilisation +> **Note :** Certains IDE et éditeurs peuvent implémenter l'API Console différemment. Cela se traduit par un comportement différent ou un absence de certaines fonctionnalités de l'API. Par exemple, les méthodes liées aux chronomètres pourraient ne pas afficher les durées en sortie. En cas de doute, utilisez la console des outils de développement de votre navigateur pour observer le fonctionnement décrit dans cette documentation. + +## Méthodes statiques + +- [`console.assert()`](/fr/docs/Web/API/console/assert_static) + - : Affiche un message dans la console si l'assertion passée comme premier argument est fausse. +- [`console.clear()`](/fr/docs/Web/API/console/clear_static) + - : Vide le contenu de la console. +- [`console.count()`](/fr/docs/Web/API/console/count_static) + - : Affiche le nombre de fois que le compteur avec le libellé correspondant a été appelé. +- [`console.countReset()`](/fr/docs/Web/API/console/countReset_static) + - : Réinitialise la valeur du compteur avec le libellé corredpondant. +- [`console.debug()`](/fr/docs/Web/API/console/debug_static) + - : Affiche un message de débogage dans la console. +- [`console.dir()`](/fr/docs/Web/API/console/dir_static) + - : Affiche une représentation hiérarchique d'un objet JavaScript. L'interface utilisateur permet de déplier l'arborescence pour examiner le contenu des objets enfants. +- [`console.dirxml()`](/fr/docs/Web/API/console/dirxml_static) + - : Affiche une représentation d'un objet XML/HTML fourni (ou la vue JavaScript équivalente de `console.dir()` par défaut). +- [`console.error()`](/fr/docs/Web/API/console/error_static) + - : Affiche un message d'erreur. Ce message peut contenir des [chaînes de caractères de substitution](#utiliser_des_chaînes_de_substitution) et d'autres valeurs fournies comme arguments complémentaires. +- `console.exception()` {{Non-standard_inline}} {{deprecated_inline}} + - : Un synonyme pour `console.error()`. +- [`console.group()`](/fr/docs/Web/API/console/group_static) + - : Crée un nouveau [groupe](#utiliser_des_groupes_dans_la_console), indentant l'affichage des messages suivants. Pour revenir au niveau courant, on appellera `console.groupEnd()`. +- [`console.groupCollapsed()`](/fr/docs/Web/API/console/groupCollapsed_static) + - : Crée un nouveau [groupe](#utiliser_des_groupes_dans_la_console), indentant l'affichage des messages suivants. Toutefois, contrairement à `console.group()`, les messages du groupe sont repliés. Pour revenir au niveau courant, on appellera `console.groupEnd()`. +- [`console.groupEnd()`](/fr/docs/Web/API/console/groupEnd_static) + - : Ferme le [groupe](#utiliser_des_groupes_dans_la_console) courant. +- [`console.info()`](/fr/docs/Web/API/console/info_static) + - : Affiche des informations dans la console. Ce message peut contenir des [chaînes de caractères de substitution](#utiliser_des_chaînes_de_substitution) et d'autres valeurs fournies comme arguments complémentaires. +- [`console.log()`](/fr/docs/Web/API/console/log_static) + - : Affiche des messages généraux dans la console. Ce message peut contenir des [chaînes de caractères de substitution](#utiliser_des_chaînes_de_substitution) et d'autres valeurs fournies comme arguments complémentaires. +- [`console.profile()`](/fr/docs/Web/API/console/profile_static) {{Non-standard_inline}} + - : Démarre l'enregistrement d'un profil de performance. Un nom peut être fourni en argument et asocié au profil ainsi créé. +- [`console.profileEnd()`](/fr/docs/Web/API/console/profileEnd_static) {{Non-standard_inline}} + - : Arrête l'enregistrement du profil de performance. +- [`console.table()`](/fr/docs/Web/API/console/table_static) + - : Affiche des données tabulaires sous forme d'un tableau. +- [`console.time()`](/fr/docs/Web/API/console/time_static) + - : Démarre un [chronomètre](#chronomètres) avec un nom fourni en paramètre. +- [`console.timeEnd()`](/fr/docs/Web/API/console/timeEnd_static) + - : Arrête le [chronomètre](#chronomètres) indiqué et affiche la durée écoulée (exprimée en millisecondes) depuis le début de la mesure. +- [`console.timeLog()`](/fr/docs/Web/API/console/timeLog_static) + - : Affiche la valeur du [chronomètre](#chronomètres) indiqué dans la console. +- [`console.timeStamp()`](/fr/docs/Web/API/console/timeStamp_static) {{Non-standard_inline}} + - : Ajoute un marqueur de performance pour l'outil de mesure des performance du navigateur ([Firefox](https://profiler.firefox.com/docs/#/), [Chrome](https://developer.chrome.com/docs/devtools/evaluate-performance/reference/)). +- [`console.trace()`](/fr/docs/Web/API/console/trace_static) + - : Affiche la [trace de la pile d'appels](#trace_de_piles_dappels). +- [`console.warn()`](/fr/docs/Web/API/console/warn_static) + - : Affiche un message d'avertissement dans la console. Ce message peut contenir des [chaînes de caractères de substitution](#utiliser_des_chaînes_de_substitution) et d'autres valeurs fournies comme arguments complémentaires. + +## Exemples ### Afficher du texte dans la console -La fonction la plus utilisée de la console est d'afficher du texte ou autres données. Il y a quatre sortes d'affichages que vous pouvez générer, en utilisant les méthodes {{domxref("console.log()")}}, {{domxref("console.info()")}}, {{domxref("console.warn()")}}, et {{domxref("console.error()")}}. Chacune de ces méthodes génére un affichage différent dans la console, et vous pouvez utiliser les fonctions de filtrage du navigateur pour voir uniquement les types de sortie qui vous intéressent. +On utilise la plupart du temps la console pour journaliser du texte et d'autres données. Il existe plusieurs catégories de messages qu'on peut afficher grâce aux méthodes [`console.log()`](/fr/docs/Web/API/console/log_static), [`console.info()`](/fr/docs/Web/API/console/info_static), [`console.warn()`](/fr/docs/Web/API/console/warn_static), [`console.error()`](/fr/docs/Web/API/console/error_static), et [`console.debug()`](/fr/docs/Web/API/console/debug_static). Les messages de chacune de ces méthodes seront affichés différemment et l'interface du navigateur vous permettra de les filtrer en fonction du niveau qui vous intéresse. -Il y a deux manières d'utiliser chacune de ces méthodes de sortie ; Vous pouvez passer une liste d'objets dont leur représentation sera concaténée dans une seule chaine et s'affichera dans la console, ou vous pouvez passer une chaîne de caractères contenant zéro et plus de caractères de substitution suivis d'une liste d'objets avec lesquels les remplacer. +Chacune de ces méthodes peut être utilisée de deux façons : soit en passant une liste d'objet dont les représentations en texte seront concaténées sur une seule chaîne de caractères puis affichées, soit en passant une chaîne de caractères contenant plusieurs chaînes de substitution, suivie d'une liste d'objet pour ces substitutions. -#### Afficher un seul objet +#### Afficher un objet -La manière la plus simple d'utiliser les méthodes de « log » est d'afficher un seul objet : +Un usage simple consiste à afficher les informations d'un objet : ```js -var someObject = { str: "Some text", id: 5 }; -console.log(someObject); +const unObjet = { str: "Du texte", id: 5 }; +console.log(unObjet); ``` -L'affichage ressemblera à ceci : +Le résultat dans la console ressemblera à : -``` -[09:27:13.475] ({str:"Some text", id:5}) +```plain +{str:"Du texte", id:5} ``` #### Afficher plusieurs objets -Vous pouvez aussi afficher plusieurs objets, en les séparant par une virgule, comme ceci : +On peut aussi afficher les données de plusieurs objets : ```js -var car = "Dodge Charger"; -var someObject = { str: "Some text", id: 5 }; -console.info("My first car was a", car, ". The object is: ", someObject); +const voiture = "Peugeot 404"; +const unObjet = { str: "Du texte", id: 5 }; +console.info( + "Ma première voiture était une ", + voiture, + ". L'objet est :", + unObjet, +); ``` -L'affichage ressemblera à ceci : +Dans la console, on verra le message suivant : +```plain +Ma première voiture était une Peugeot 404. L'objet est : {str:"Du texte", id:5} ``` -[09:28:22.711] My first car was a Dodge Charger . The object is: ({str:"Some text", id:5}) -``` -#### Utiliser les caractères de substitution - -Gecko 9.0 a amené le support des caractères de substitution. Lorsque l'on passe en argument une chaîne à l'une des méthodes qui acceptent des chaînes de caractère, on peut utiliser ces caractères de substitution : - - - - - - - - - - - - - - - - - - - - - - - - -
caractère de substitutiondescription
%o or %O - Affiche un lien hypertexte sur un objet JavaScript. Cliquer le lien - ouvre l'inspecteur. -
%d or %i - Affiche un entier. Le formatage des nombres est supporté, par exemple - console.log ("Foo% .2d", 1.1) affichera le nombre sous forme de deux - chiffres significatifs avec un 0 : Foo 01 -
%sAffiche une chaîne de caractères.
%f - Affiche un nombre réél. Le formatage est supporté, par exemple, - console.log("Foo %.2f", 1.1) affichera un nombre avec 2 - décimales : Foo 1.10 . -
- -Chacun de ceux-ci ira chercher l'argument qui suit la chaîne à formater. Par exemple : +#### Utiliser des chaînes de substitution + +Lorsqu'on passe une chaîne de caractères à l'une des méthodes d'affichage de `console` (telle que `log()`), on peut utiliser des chaînes de substitution : + +- `%o` ou `%O` + - : Permettra d'afficher un objet JavaScript. L'interface permettra de cliquer sur le nom de l'objet pour consulter plus d'informations dans l'inspecteur. +- `%d` ou `%i` + - : Permettra d'afficher un entier. Le formatage numérique est pris en charge et on pourra par exemple écrire `console.log("Toto %.2d", 1.1)` qui indiquera qu'il faut écrire le nombre avec deux chiffres significatifs et un 0 devant : `Toto 01`. +- `%s` + - : Permettra d'afficher une chaîne de caractères. +- `%f` + - : Permettra d'afficher une valeur décimale. Le formatage numérique est pris en charge et on pourra par exemple écrire `console.log("Toto %.2f", 1.1)` pour avoir deux chiffres décimaux : `Toto 1.10`. + +> **Attention :** Ce formatage pour la précision numérique ne fonctionne pas dans Chrome. + +Chaque chaîne de substitution est associé au paramètre correspondant dans la liste (la première chaîne avec le deuxième paramètre, la deuxième chaîne avec le troisième paramètre, et ainsi de suite). ```js -for (var i = 0; i < 5; i++) { - console.log("Hello, %s. You've called me %d times.", "Bob", i + 1); +for (let i = 0; i < 5; i++) { + console.log("Coucou, %s. Vous m'avez appelé %d fois.", "Olivier", i + 1); } ``` -L'affichage ressemblera à ceci : +Avec le fragment de code précédent, le résultat sera : -``` -[13:14:13.481] Hello, Bob. You've called me 1 times. -[13:14:13.483] Hello, Bob. You've called me 2 times. -[13:14:13.485] Hello, Bob. You've called me 3 times. -[13:14:13.487] Hello, Bob. You've called me 4 times. -[13:14:13.488] Hello, Bob. You've called me 5 times. +```plain +Coucou, Olivier. Vous m'avez appelé 1 fois. +Coucou, Olivier. Vous m'avez appelé 2 fois. +Coucou, Olivier. Vous m'avez appelé 3 fois. +Coucou, Olivier. Vous m'avez appelé 4 fois. +Coucou, Olivier. Vous m'avez appelé 5 fois. ``` -#### Donner un style à l'affichage de la console +#### Mettre en forme la sortie de la console -Vous pouvez utiliser l'instruction `"%c"` pour appliquer du style CSS à l'affichage de la console : +La directive `%c` permet d'appliquer une règle CSS pour mettre en forme le message dans la console : ```js console.log( - "This is %cMy stylish message", + "Voici mon %cmessage super stylé.", "color: yellow; font-style: italic; background-color: blue;padding: 2px", ); ``` -![](css-styling.png) +Le texte situé avant la directive n'est pas modifié. Le texte situé après sera mis en forme à l'aide des déclarations CSS du deuxième paramètre. + +![Texte mis en forme dans la console de Firefox](css-styling.png) -> **Note :** Un certain nombre de propriétés CSS sont supportées par ce style; vous devriez expérimenter et voir lesquels s'avèrent utiles. +La directive `%c` peut être utilisée plusieurs fois : + +```js +console.log( + "Utilisation de plusieurs styles : %cred %corange", + "color: red", + "color: orange", + "Un message non mis en forme", +); +``` + +Les propriétés qui peuvent être utilisées avec cette syntaxe sont (au moins pour Firefox) : + +- [`background`](/fr/docs/Web/CSS/background) et les propriétés détaillées correspondantes +- [`border`](/fr/docs/Web/CSS/border) et les propriétés détaillées correspondantes +- [`border-radius`](/fr/docs/Web/CSS/border-radius) +- [`box-decoration-break`](/fr/docs/Web/CSS/box-decoration-break) +- [`box-shadow`](/fr/docs/Web/CSS/box-shadow) +- [`clear`](/fr/docs/Web/CSS/clear) et [`float`](/fr/docs/Web/CSS/float) +- [`color`](/fr/docs/Web/CSS/color) +- [`cursor`](/fr/docs/Web/CSS/cursor) +- [`display`](/fr/docs/Web/CSS/display) +- [`font`](/fr/docs/Web/CSS/font) et les propriétés détaillées correspondantes +- [`line-height`](/fr/docs/Web/CSS/line-height) +- [`margin`](/fr/docs/Web/CSS/margin) +- [`outline`](/fr/docs/Web/CSS/outline) et les propriétés détaillées correspondantes +- [`padding`](/fr/docs/Web/CSS/padding) +- Les propriétés `text-*` comme [`text-transform`](/fr/docs/Web/CSS/text-transform) +- [`white-space`](/fr/docs/Web/CSS/white-space) +- [`word-spacing`](/fr/docs/Web/CSS/word-spacing) et [`word-break`](/fr/docs/Web/CSS/word-break) +- [`writing-mode`](/fr/docs/Web/CSS/writing-mode) + +> **Note :** Le message de la console se comporte par défaut comme un élément en ligne. Pour observer des effets avec `padding`, `margin` ou autre, il faut modifier son affichage, par exemple avec `display: inline-block`. ### Utiliser des groupes dans la console -Vous pouvez utiliser des groupes imbriqués pour vous aider à vous repérer dans l'affichage. Pour créer un nouveau bloc, appelez `console.group()`. La méthode `console.groupCollapsed()` est similaire, mais elle crée un bloc qui sera réduit. +On peut utiliser des groupes imbriqués pour organiser le contenu affiché dans la console. Pour créer un nouveau groupe, on utilisera la méthode `console.group()`. La méthode `console.groupCollapsed()` permettra également de créer un groupe, mais qui sera automatiquement replié (et qu'il faudra déplier via l'interface pour en consulter les informations). -Pour quitter le groupe dans lequel on est, appeler `console.groupEnd()`. Par exemple, examinez ce code : +Pour clôturer le groupe courant, on appellera `console.groupEnd()`. Ainsi, si on écrit : ```js -console.log("This is the outer level"); +console.log("Il s'agit du niveau extérieur"); console.group(); -console.log("Level 2"); +console.log("Niveau 2"); console.group(); -console.log("Level 3"); -console.warn("More of level 3"); +console.log("Niveau 3"); +console.warn("Un avertissement au niveau 3"); console.groupEnd(); -console.log("Back to level 2"); +console.log("Retour au niveau 2"); console.groupEnd(); -console.debug("Back to the outer level"); +console.log("Retour au niveau extérieur"); ``` -L'affichage ressemblera à ceci : +L'affichage dans la console ressemblera à ceci : -![Démonstration de groupes imbriqués dans la console Firefox](console_groups_demo.png) +![Une capture d'écran des messages imbriqués dans la sortie de la console.](nesting.png) -### Chronométrage +### Chronomètres -Pour calculer la durée d'une opération spécifique, Gecko 10 a amené le supports des chronomètres dans l'objet `console`. pour démarrer un chronomètre, appelez la méthode `console.time()` en lui donnant un seul paramètre, son nom. Pour arrêter le chronomètre et obtenir le temps écoulé en millisecondes, utilisez la méthode `console.timeEnd()`, en passant à nouveau le nom du chronomètre comme paramètre. Une seule page peut faire tourner un maximum de 10.000 chronomètres. +On peut démarrer un chronomètre pour mesurer la durée d'une opération donnée. Pour lancer un chronomètre, on appellera la méthode `console.time()`, à laquelle on pourra passer un nom comme paramètre. Pour arrêter le chronomètre et obtenir la durée écoulée, on appellera la méthode `console.timeEnd()` (à laquelle on pourra aussi passer un nom en argument pour arrêter un chronomètre donné). Pour une page web donnée, on peut exécuter jusqu'à 10 000 chronomètres simultanément. -Par exemple, voici ce code : +Si on écrit cela, par exemple : ```js -console.time("answer time"); -alert("Click to continue"); -console.timeEnd("answer time"); +console.time("ma mesure de temps"); +alert("Cliquez pour continuer"); +console.timeLog("ma mesure de temps"); +alert("Faire d'autres trucs…"); +console.timeEnd("ma mesure de temps"); ``` -affichera le temps pour l'utilisateur dont il a eu besoin pour faire disparaitre la fenêtre d'alerte : - -![](console-timelog.png) +Avec le fragment de code ci-avant, on affichera le temps écoulé après que la personne a fermé la première fenêtre modale, puis le temps total pris pour fermer les deux fenêtres : -Notez que le nom du chronomètre est affiché deux fois, à son départ et quand il se termine. +![L'affichage produit par le chronomètre dans la console de Firefox](console-timelog.png) -> **Note :** Il est important de noter que si vous vous servez de ceci pour enregistrer les durées du traffic réseau, le chronomètre renverra le temps total d'échanges, alors que les durées affichées dans l'onglet network représente seulement la durée à la réception du header. Si vous avez activer l'enregistrement de réponse du body, le temps listé pour la réponse du header et du body devrait correspondre à ce qu'affiche la sortie de la console. +On peut voir que le nom du chronomètre est affiché au démarrage et à l'arrêt de celui-ci. -### Traces d'appel +### Traces de piles d'appels -L'objet console supporte aussi l'affichage d'une trace d'appels ; cela montre le chemin pris pour atteindre l'endroit auquel vous avez fait appel à la fonction {{domxref("console.trace()")}}. Ce qui donne avec ce code : +L'objet `console` permet également d'afficher une trace de pile d'appels. Cela permet de connaître la pile d'appels suivie pour atteindre le point où la méthode [`console.trace()`](/fr/docs/Web/API/console/trace_static) a été appelée : ```js -foo(); - -function foo() { - function bar() { +function toto() { + function truc() { console.trace(); } - bar(); + truc(); } + +toto(); ``` -L'affichage dans la console ressemblera à ceci : +Avec le fragment de code précédent, on aura la trace suivante dans la console : -![](api-trace2.png) +![Trace de la pile d'appels dans la console Firefox](api-trace2.png) ## Spécifications @@ -247,16 +266,11 @@ L'affichage dans la console ressemblera à ceci : {{Compat}} -## Voir aussi +> **Note :** Dans Firefox, si une page définit un objet `console`, cet objet surchargera l'objet natif exposé par Firefox. -- [Outils de développement](/fr/docs/Outils) -- [Console web](/fr/docs/Outils/Console_Web) - comment la console Web de Firefox gère les appels d'API de console -- [Débogage distant](/fr/docs/Outils/Débogage_distant) - comment afficher la sortie de la console lorsque la cible de débogage est un périphérique mobile -- [Journalisation console sur l'appareil](/fr/docs/Archive/B2G_OS/Debugging/Journalisation_console) - comment se connecter sur les appareils Firefox OS - -### Autres implémentations +## Voir aussi -- [Google Chrome DevTools](https://developers.google.com/chrome-developer-tools/docs/console-api) -- [Firebug](http://getfirebug.com/wiki/index.php/Console_API) -- [Internet Explorer]() -- [Safari](https://developer.apple.com/library/safari/documentation/AppleApplications/Conceptual/Safari_Developer_Guide/Console/Console.html) +- [Google Chrome](https://developer.chrome.com/docs/devtools/console/api/) +- [Microsoft Edge](https://learn.microsoft.com/en-us/microsoft-edge/devtools-guide-chromium/console/) +- [Apple Safari](https://developer.apple.com/library/archive/documentation/AppleApplications/Conceptual/Safari_Developer_Guide/Console/Console.html) +- [Mozilla Firefox](https://firefox-source-docs.mozilla.org/devtools-user/web_console/index.html) diff --git a/files/fr/web/api/console/info_static/index.md b/files/fr/web/api/console/info_static/index.md index c2a3dcebf7f8cb..5c3bb9f59ead4b 100644 --- a/files/fr/web/api/console/info_static/index.md +++ b/files/fr/web/api/console/info_static/index.md @@ -1,32 +1,39 @@ --- -title: Console.info() +title: "console : méthode statique info()" slug: Web/API/console/info_static -original_slug: Web/API/console/info +l10n: + sourceCommit: 022399901bdc60df947ee15e11a49be029e290d0 --- -{{ APIRef("Console API") }}{{Non-standard_header}} +{{APIRef("Console API")}} -Affiche un message informatif dans la console du navigateur. Dans Firefox et Chrome, une petit icône de _i_ s'affiche devant le message. +La méthode **`console.info()`** affiche un message d'information dans la console. Le navigateur ou le moteur JavaScript pourra indiquer ce contenu avec une iconographie associée. {{AvailableInWorkers}} ## Syntaxe -```js -console.info(obj1 [, obj2, ..., objN]); -console.info(msg [, subst1, ..., substN]); +```js-nolint +info(obj1) +info(obj1, /* …, */ objN) +info(msg) +info(msg, subst1, /* …, */ substN) ``` ### Paramètres -- `obj1` ... `objN` - - : Une liste d'objets JavaScript à afficher. La représentation, en chaîne de caractéres, de chacun de ces objets est affichée dans l'ordre de la liste. +- `obj1` … `objN` + - : Une liste d'objets JavaScript à afficher. Les représentations en chaînes de caractères de ces objets sont concaténés dans l'ordre et affichés dans la console. - `msg` - - : Une chaîne de caractères JavaScript contenant zéro ou plusieurs subdivisions de chaîne de caractères. -- `subst1` ... `substN` - - : Une liste d'objets JavaScript qui remplace les chaînes de caractéres de `msg`. Cela vous donne plus de contrôle sur le format de sortie. + - : Une chaîne de caractères JavaScript qui contient zéro ou plusieurs chaînes de substitution qui seront remplacées par `subst1` … `substN` dans l'ordre. +- `subst1` … `substN` + - : Des objets JavaScript avec lesquels remplacer les chaînes de substitution dans `msg`. Ce paramètre permet un contrôle supplémentaire sur le format de ce qui est affiché. Voir [la page sur les chaînes de caractères de substitution avec `console`](/fr/docs/Web/API/console#utiliser_les_caractères_de_substitution) pour plus de détails. -Voir [Afficher du texte sur la console](/fr/docs/Web/API/Console#Outputting_text_to_the_console) dans la documentation de {{ domxref("console") }} pour plus de détails. +Voir [Afficher du texte dans la console](/fr/docs/Web/API/console#afficher_du_texte_dans_la_console) pour plus de détails. + +### Valeur de retour + +Aucune ([`undefined`](/fr/docs/Web/JavaScript/Reference/Global_Objects/undefined)). ## Spécifications @@ -35,8 +42,3 @@ Voir [Afficher du texte sur la console](/fr/docs/Web/API/Console#Outputting_text ## Compatibilité des navigateurs {{Compat}} - -## Voir aussi - -- [Opera Dragonfly documentation: Console](http://www.opera.com/dragonfly/documentation/console/) -- [MSDN: Using the F12 Tools Console to View Errors and Status](http://msdn.microsoft.com/library/gg589530) diff --git a/files/fr/web/api/console/log_static/index.md b/files/fr/web/api/console/log_static/index.md index d6cdd16bd73908..b227a334df7c27 100644 --- a/files/fr/web/api/console/log_static/index.md +++ b/files/fr/web/api/console/log_static/index.md @@ -1,47 +1,59 @@ --- -title: console.log() +title: "console : méthode statique log()" slug: Web/API/console/log_static -original_slug: Web/API/console/log +l10n: + sourceCommit: 022399901bdc60df947ee15e11a49be029e290d0 --- {{APIRef("Console API")}} -La méthode **`console.log()`** affiche un message dans la console Web. Le message peut être une simple chaine de caractères (avec des valeurs optionnelles de substitution) ou peut être composé d'un ou plusieurs objets JavaScript. +La méthode **`console.log()`** permet d'afficher un message dans la console. Le message peut être une chaîne de caractères (avec d'éventuelles valeurs de substitution) ou un ou plusieurs objets JavaScript. {{AvailableInWorkers}} ## Syntaxe -```js -console.log(obj1 [, obj2, ..., objN]); -console.log(msg [, subst1, ..., substN]); +```js-nolint +log(obj1) +log(obj1, /* …, */ objN) +log(msg) +log(msg, subst1, /* …, */ substN) ``` ### Paramètres -- `obj1` ... `objN` - - : Une liste d'objets Javascript à afficher. Les représentations textuelles de chacun de ces objets seront affichées dans la console du navigateur selon l'ordre indiqué. Attention, pour les versions récentes de Chrome et Firefox, ce qui apparaît dans la console est une **référence à l'objet** et pas nécessairement la valeur de l'objet au moment de l'appel à `console.log()` mais sa valeur au moment où on ouvre la console. +- `obj1` … `objN` + - : Une liste d'objets JavaScript à afficher. Les objets sont affichés dans l'ordre des arguments. Attention, pour certains navigateurs, ce qui est affiché dans la console est _une référence à l'objet_ et pas nécessairement la valeur de l'objet au moment où `console.log()` est appelé (mais la valeur de l'objet au moment où la console est ouverte). - `msg` - - : Une chaîne de caractères JavaScript contenant zéro ou plusieurs chaînes de substitution. -- `subst1` ... `substN` - - : Des objets JavaScript dont les valeurs textuelles remplaceront les emplacements à substituer indiqués dans `msg`. Cela offre plus de contrôle sur le format d'affichage. + - : Une chaîne de caractères JavaScript qui contient zéro ou plusieurs chaînes de substitution qui seront remplacées par `subst1` … `substN` dans l'ordre. +- `subst1` … `substN` + - : Des objets JavaScript avec lesquels remplacer les chaînes de substitution dans `msg`. Ce paramètre permet un contrôle supplémentaire sur le format de ce qui est affiché. Voir [la page sur les chaînes de caractères de substitution avec `console`](/fr/docs/Web/API/console#utiliser_les_caractères_de_substitution) pour plus de détails. + +Voir [Afficher du texte dans la console](/fr/docs/Web/API/console#afficher_du_texte_dans_la_console) pour plus de détails. -Voir [Afficher du texte sur la console](/fr/docs/Web/API/Console#outputting_text_to_the_console) dans la documentation de [`console`](/fr/docs/Web/API/Console) pour plus de détails. +### Valeur de retour -## Différence entre console.log() et console.dir() +Aucune ([`undefined`](/fr/docs/Web/JavaScript/Reference/Global_Objects/undefined)). -Vous pourriez vous demander quelles sont les différences entre [`console.dir()`](/fr/docs/Web/API/Console/dir) et `console.log()`. +## Journaliser des objets -Celles-ci concernent principalement la gestion particulière des objets du DOM : +Les informations relatives aux objets sont récupérées lorsque c'est nécessaire. Cela signifie que le message dans la console affiche le contenu de l'objet au moment où on l'observe depuis la console, et pas le contenu de l'objet au moment où la méthode a été appelée. Par exemple, avec : -- `console.log()` affiche les éléments dans un arbre de type HTML, -- `console.dir()` affiche les propriétés de l'objet JavaScript. +```js +const obj = {}; +console.log(obj); +obj.prop = 123; +``` -![](dozdcyr.png) +On verra `{}` affiché comme résultat. Mais si on déplie le détail de l'objet, on verra alors `prop: 123`. -## Affichage d'objets dans la console +Si vous modifiez l'objet et que vous ne voulez pas que les informations journalisées dans la console soient mises à jour, il faudra réaliser [un clone profond](/fr/docs/Glossary/Deep_copy) de l'objet avant de le journaliser. Une méthode courante pour ce faire consiste à utiliser [`JSON.stringify()`](/fr/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify) puis [`JSON.parse()`](/fr/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse) : + +```js +console.log(JSON.parse(JSON.stringify(obj))); +``` -Évitez d'utiliser `console.log(obj)` mais préférez `console.log(JSON.parse(JSON.stringify(obj)))` si vous souhaîtez être sûr·e d'observer la valeur de l'objet au moment de l'exécution de `console.log()`. Autrement, de nombreux navigateurs produisent un affichage interactif de l'objet qui se maintient à jour quand les propriétés de l'objet changent. Cela ne pourrait pas être ce que vous voulez et peut porter à confusion. +D'autres méthodes, comme [`structuredClone()`](/fr/docs/Web/API/structuredClone), peuvent fonctionner dans les navigateurs et seront plus efficaces pour cloner différents types d'objet. ## Spécifications @@ -53,6 +65,6 @@ Celles-ci concernent principalement la gestion particulière des objets du DOM : ## Voir aussi -- [Docs Microsoft : Edge - Afficher des messages dans la console](https://docs.microsoft.com/en-us/microsoft-edge/devtools-guide-chromium/console/console-log) -- [La référence de l'API Console pour Chrome](https://developers.google.com/chrome-developer-tools/docs/console-api#consoledirobject) -- [NodeJS : API Console](https://nodejs.org/docs/latest/api/console.html#console_console_log_data) +- [Documentation Edge](https://learn.microsoft.com/en-us/microsoft-edge/devtools-guide-chromium/console/console-log#console-messages-examples-log-info-error-and-warn) +- [Documentation Node.JS sur l'API Console](https://nodejs.org/docs/latest/api/console.html#consolelogdata-args) +- [Documentation Chrome](https://developer.chrome.com/docs/devtools/console/api/#log) diff --git a/files/fr/web/api/console/nesting.png b/files/fr/web/api/console/nesting.png new file mode 100644 index 00000000000000..39f461b03d3fa0 Binary files /dev/null and b/files/fr/web/api/console/nesting.png differ diff --git a/files/fr/web/api/console/profile_static/index.md b/files/fr/web/api/console/profile_static/index.md index 61d966fa16413b..6631756ae0341f 100644 --- a/files/fr/web/api/console/profile_static/index.md +++ b/files/fr/web/api/console/profile_static/index.md @@ -1,29 +1,34 @@ --- -title: Console.profile() +title: "console : méthode statique profile()" slug: Web/API/console/profile_static -original_slug: Web/API/console/profile +l10n: + sourceCommit: 022399901bdc60df947ee15e11a49be029e290d0 --- {{APIRef("Console API")}}{{Non-standard_header}} -Commence l'enregistrement d'un profil de performance (par exemple, l'outil [performance de Firefox](/fr/docs/Outils/Performance)). +La méthode **`console.profile()`** démarre l'enregistrement d'un profil de performance. -Vous pouvez éventuellement fournir un argument pour nommer le profil, ce qui vous permet d'arrêter uniquement ce profil si plusieurs profils sont enregistrés. Voir {{domxref("Console.profileEnd()")}} pour voir comment cet argument est interprété. +On peut fournir un argument indiquant le nom du profil, ce qui permet d'enregistrer plusieurs profils nommés en parallèle. Voir la documentation de [`console.profileEnd()`](/fr/docs/Web/API/console/profileend_static) pour plus d'informations sur cet argument. -Pour arrêter l'enregistrement, appeler {{domxref("Console.profileEnd()")}}. +Pour arrêter l'enregistrement du profil, on appellera [`console.profileEnd()`](/fr/docs/Web/API/console/profileend_static). {{AvailableInWorkers}} ## Syntaxe -```js -console.profile(profileName); +```js-nolint +profile(nomProfil) ``` -## Paramètres +### Paramètres -- `profileName` - - : Le nom à donner au profil. Facultatif. +- `nomProfil` {{optional_inline}} + - : Le nom à donner au profil. + +### Valeur de retour + +Aucune ([`undefined`](/fr/docs/Web/JavaScript/Reference/Global_Objects/undefined)). ## Compatibilité des navigateurs @@ -31,4 +36,4 @@ console.profile(profileName); ## Voir aussi -- {{domxref("Console.profileEnd()")}} +- [`console.profileEnd()`](/fr/docs/Web/API/console/profileend_static) diff --git a/files/fr/web/api/console/profileend_static/index.md b/files/fr/web/api/console/profileend_static/index.md index bf4da4d5289c07..94a7fe492abb3a 100644 --- a/files/fr/web/api/console/profileend_static/index.md +++ b/files/fr/web/api/console/profileend_static/index.md @@ -1,33 +1,36 @@ --- -title: Console.profileEnd() +title: "console : méthode statique profileEnd()" slug: Web/API/console/profileend_static -original_slug: Web/API/console/profileEnd +l10n: + sourceCommit: 022399901bdc60df947ee15e11a49be029e290d0 --- {{APIRef("Console API")}}{{Non-standard_header}} -> **Attention :** L'appel de cet API immédiatement après `console.profile()` peut l'empêcher de fonctionner. Pour contourner ce problème, appelez-le par un `setTimeout` avec un délai d'au-moins 5 ms. Voir [bug #1173588](https://bugzilla.mozilla.org/show_bug.cgi?id=1173588). +La méthode **`console.profileEnd()`** arrête l'enregistrement d'un profil de performance précédemment initié avec un appel à [`console.profile()`](/fr/docs/Web/API/console/profile_static). -La méthode `profileEnd` arrête l'enregistrement d'un profil lancé précédemment avec {{domxref("Console.profile()")}}. +Un argument facultatif permet d'indiquer le nom du profil en question. Utiliser ce nom permet de cibler un profil donné pour l'arrêt de l'enregistrement lorsque plusieurs profils sont enregistrés. -Vous pouvez éventuellement insérer un argument pour nommer le profil. Cela vous permet d'arrêter uniquement ce profil si vous avez enregistré plusieurs profils. - -- Si `Console.profileEnd()` reçoit un nom de profil qui correspond au nom d'un profil en cours d'enregistrement, ce profil est arrêté. -- Si `Console.profileEnd()` reçoit un nom de profil qui ne correspond pas au nom d'un profil en cours d'enregistrement, aucune modification n'est apportée. -- Si `Console.profileEnd()` ne reçoit pas un nom de profil, le dernier profil démarré est arrêté. +- Si `console.profileEnd()` est utilisée avec un nom de profil et que celui-ci correspond à un profil en cours d'enregistrement, l'enregistrement de ce profil donné est arrêté. +- Si `console.profileEnd()` est utilisée avec un nom de profil qui ne correspond à aucun profil en cours d'enregistrement, rien ne se passe. +- Si `console.profileEnd()` est utilisée sans nom de profil, c'est le profil dont l'enregistrement a démarré en dernier qui est arrêté. {{AvailableInWorkers}} ## Syntaxe -```js -console.profileEnd(profileName); +```js-nolint +profileEnd(nomProfil) ``` -## Paramètres +### Paramètres + +- `nomProfil` {{optional_inline}} + - : Le nom à donner au profil. + +### Valeur de retour -- `profileName` - - : Le nom à donner au profil. Ce paramètre est facultatif. +Aucune ([`undefined`](/fr/docs/Web/JavaScript/Reference/Global_Objects/undefined)). ## Compatibilité des navigateurs @@ -35,4 +38,4 @@ console.profileEnd(profileName); ## Voir aussi -- {{domxref("Console.profile()")}} +- [`console.profile()`](/fr/docs/Web/API/console/profile_static) diff --git a/files/fr/web/api/console/table_static/index.md b/files/fr/web/api/console/table_static/index.md index 462acf6cc13e1b..45131c96ac48c2 100644 --- a/files/fr/web/api/console/table_static/index.md +++ b/files/fr/web/api/console/table_static/index.md @@ -1,7 +1,8 @@ --- -title: "console : méthode table()" +title: "console : méthode statique table()" slug: Web/API/console/table_static -original_slug: Web/API/console/table +l10n: + sourceCommit: 022399901bdc60df947ee15e11a49be029e290d0 --- {{APIRef("Console API")}} diff --git a/files/fr/web/api/console/time_static/index.md b/files/fr/web/api/console/time_static/index.md index aba0e78e417590..2a7cdd8c48d831 100644 --- a/files/fr/web/api/console/time_static/index.md +++ b/files/fr/web/api/console/time_static/index.md @@ -1,25 +1,33 @@ --- -title: console.time +title: "console: time() static method" slug: Web/API/console/time_static -original_slug: Web/API/console/time +l10n: + sourceCommit: 022399901bdc60df947ee15e11a49be029e290d0 --- {{APIRef("Console API")}} -Chronomètre une opération. Chaque "timer" doit avoir un nom unique. Il peut y avoir jusqu'à 10000 "timers" sur une même page. En appelant {{ domxref("console.timeEnd()") }} avec le même nom, le navigateur affichera le temps d'execution en millisecondes dans la console. +La méthode **`console.time()`** démarre un chronomètre qui permet de mesurer la durée d'une opération. Chaque chronomètre peut être identifié avec un nom donné et on peut avoir jusqu'à 10 000 chronomètres simultanés sur une même page. Lorsqu'on appelle [`console.timeEnd()`](/fr/docs/Web/API/console/timeend_static) avec le même nom, la durée associée depuis le démarrage du chronomètre correspondant s'affichera dans la console (exprimée en millisecondes). -Voir [Timers](/fr/docs/Web/API/console#Timers) dans la documentation de {{ domxref("console") }} pour plus de details et d'exemples. +Voir [la section sur les chronomètres de la documentation de `console`](/fr/docs/Web/API/console#chronométrage) pour plus de détails et d'exemples. + +{{AvailableInWorkers}} ## Syntaxe -```js -console.time(label); +```js-nolint +time() +time(libelle) ``` -## Paramètres +### Paramètres + +- `libelle` {{optional_inline}} + - : Une chaîne de caractères qui représente le nom à donner au chronomètre. Ce nom servira d'identifiant, qu'il faudra passer à [`console.timeEnd()`](/fr/docs/Web/API/console/timeend_static) pour arrêter le chronomètre correspondant. Si cet argument est omis, le libellé `"default"` sera utilisé. + +### Valeur de retour -- `label` - - : Nom qui identifiera le nouveau "timer". Il faut utiliser le même nom pour {{ domxref("console.timeEnd()") }} pour arrêter le "timer" et afficher le temps dans la console. +Aucune ([`undefined`](/fr/docs/Web/JavaScript/Reference/Global_Objects/undefined)). ## Spécifications @@ -31,5 +39,5 @@ console.time(label); ## Voir aussi -- {{ domxref("console.timeEnd()") }} -- [Opera Dragonfly documentation: Console](http://www.opera.com/dragonfly/documentation/console/) +- [`console.timeEnd()`](/fr/docs/Web/API/console/timeend_static) +- [`console.timeLog()`](/fr/docs/Web/API/console/timelog_static) diff --git a/files/fr/web/api/console/timeend_static/index.md b/files/fr/web/api/console/timeend_static/index.md index 005c4318a71c30..1d9951248a6335 100644 --- a/files/fr/web/api/console/timeend_static/index.md +++ b/files/fr/web/api/console/timeend_static/index.md @@ -1,25 +1,49 @@ --- -title: console.timeEnd +title: "console : méthode statique timeEnd()" slug: Web/API/console/timeend_static -original_slug: Web/API/console/timeEnd +l10n: + sourceCommit: 022399901bdc60df947ee15e11a49be029e290d0 --- {{APIRef("Console API")}} -Arrête un chronomètre (_timer_) précédemment démarré par {{domxref("console.time()")}}. +La méthode **`console.timeEnd()`** arrête un chronomètre qui avait été démarré à l'aide de [`console.time()`](/fr/docs/Web/API/console/time_static). -Voir [Timers](/fr/docs/Web/API/console#Timers) dans la documentation de {{domxref("console")}} pour des détails et des exemples. +Voir [la section sur les chronomètres de la documentation de `console`](/fr/docs/Web/API/console#chronométrage) pour plus de détails et d'exemples. + +{{AvailableInWorkers}} ## Syntaxe -```js -console.timeEnd(label); +```js-nolint +timeEnd() +timeEnd(libelle) ``` ### Paramètres -- `label` - - : Le nom du _timer_ à stopper. Une fois arrêté, le temps écoulé est automatiquement affiché dans la [Console Web](/fr/docs/Outils/Console_Web). +- `libelle` {{optional_inline}} + - : Une chaîne de caractères qui représente le nom à donner au chronomètre. Lorsque le chronomètre associé est arrêté, la durée écoulée (exprimée en millisecondes) est affichée dans la console avec une indication que la mesure est terminée. Si cet argument est omis, le libellé `"default"` sera utilisé. + +### Valeur de retour + +Aucune ([`undefined`](/fr/docs/Web/JavaScript/Reference/Global_Objects/undefined)). + +## Exemples + +```js +console.time("ma mesure de temps"); +alert("Cliquez pour continuer"); +console.timeLog("ma mesure de temps"); +alert("Faire d'autres trucs…"); +console.timeEnd("ma mesure de temps"); +``` + +Avec le fragment de code ci-avant, on affichera le temps écoulé après que la personne a fermé la première fenêtre modale, puis le temps total pris pour fermer les deux fenêtres : + +![L'affichage produit par le chronomètre dans la console de Firefox](timer_output.png) + +On notera que le nom du chronomètre est affiché avec la durée lors de l'appel à `timeLog()`, puis lors de l'arrêt. Quand on appelle `timeEnd()`, on a en plus le message « chronomètre arrêté » qui précise que le chronomètre est terminé. ## Spécifications @@ -31,4 +55,5 @@ console.timeEnd(label); ## Voir aussi -- [Opera Dragonfly documentation: Console](http://www.opera.com/dragonfly/documentation/console/). +- [`console.time()`](/fr/docs/Web/API/console/time_static) +- [`console.timeLog()`](/fr/docs/Web/API/console/timelog_static) diff --git a/files/fr/web/api/console/timeend_static/timer_output.png b/files/fr/web/api/console/timeend_static/timer_output.png new file mode 100644 index 00000000000000..9f21845c92d618 Binary files /dev/null and b/files/fr/web/api/console/timeend_static/timer_output.png differ diff --git a/files/fr/web/api/console/timelog_static/index.md b/files/fr/web/api/console/timelog_static/index.md index 8b6f816379742d..45bb2b0e5e7d0e 100644 --- a/files/fr/web/api/console/timelog_static/index.md +++ b/files/fr/web/api/console/timelog_static/index.md @@ -1,71 +1,98 @@ --- -title: Console.timeLog() +title: "console : méthode statique timeLog()" slug: Web/API/console/timelog_static -original_slug: Web/API/console/timeLog +l10n: + sourceCommit: 022399901bdc60df947ee15e11a49be029e290d0 --- -{{APIRef("Console API")}} +{{APIRef("Console API")}}{{AvailableInWorkers}} -Affiche dans la console la valeur actuelle d'un timer précédemment appelé par {{domxref("console.time()")}} - -Voir [Timers](/fr/docs/Web/API/console#Timers) dans la documentation pour des exemples et plus de détails - -{{AvailableInWorkers}} +La méthode **`console.timeLog()`** affiche la valeur courante du chronomètre précédemment démarré par un appel à [`console.time()`](/fr/docs/Web/API/console/time_static). ## Syntaxe -```js -console.timeLog(label); +```js-nolint +timeLog() +timeLog(libelle) +timeLog(libelle, val1) +timeLog(libelle, val1, /* …, */ valN) ``` ### Paramètres -- `label` - - : Le nom du timer à afficher sur la console +- `libelle` {{optional_inline}} + - : Le nom du chronomètre dont on souhaite afficher la mesure dans la console. Si cet argument est absent, c'est le libellé `"default"` qui est utilisé. +- `valN` {{optional_inline}} + - : Des valeurs additionnelels à afficher dans la console après la mesure temporelle. ### Valeur de retour -Si aucun label n'est inclus +Aucune ([`undefined`](/fr/docs/Web/JavaScript/Reference/Global_Objects/undefined)). -``` -default: 1042ms -``` +## Description -Si un `label` est inclus: +La méthode `console.timeLog()` affiche la durée mesurée jusqu'à présent pour un chronomètre. -``` -timer name: 1242ms -``` +On peut passer un nom comme argument à cette méthode, ce sera alors la durée du chronomètre (précédemment créé avec un appel à [`console.time()`](/fr/docs/Web/API/console/time_static)) avec ce nom qui sera affichée : -### Exceptions +```js +console.time("réticulateur de spleens"); +reticulerLesSpleens(); +console.timeLog("réticulateur de spleens"); +// réticulateur de spleens : 650ms +``` -Si aucun timer n'est en cours d'éxecution, `timeLog()` retourne l'avertissement suivant : +Si le nom n'est pas fourni, ce sera la durée du chronomètre par défaut qui sera affiché : +```js +console.time(); +reticulerLesSpleens(); +console.timeLog(); +// default : 780ms ``` -Timer “default” doesn’t exist. + +```js +console.time("default"); +reticulerLesSpleens(); +console.timeLog(); +// default : 780ms ``` -Si le paramètre label est spécifé mais aucun timer n'y correspond : +S'il n'y a pas de chronomètre associé existant, `timeLog()` affichera un avertissement : +```plain +Le minuteur « nom du chronomètre » n'existe pas. ``` -Timer “timer name” doesn’t exist. + +On peut aussi fournir des valeurs supplémentaires, à afficher après la durée : + +```js +console.time(); +reticulerLesSpleens(); +console.timeLog("default", "Coucou", "monde"); +// default : 780ms Coucou monde ``` +Voir [la section sur les chronomètres de la documentation de `console`](/fr/docs/Web/API/console#chronométrage) pour plus de détails et d'exemples. + ## Exemples ```js -console.time("answer time"); -alert("Click to continue"); -console.timeLog("answer time"); -alert("Do a bunch of other stuff..."); -console.timeEnd("answer time"); +console.time("ma mesure de temps"); +alert("Cliquez pour continuer"); +console.timeLog("ma mesure de temps"); +alert("Faire d'autres trucs…"); +console.timeEnd("ma mesure de temps"); ``` -Le résultat de l'exemple ci-dessus montre le temps qu'a mis l'utilisateur à fermer la première pop-up d'alerte, puis le temps que l'utilisateur a pris pour fermer la seconde : +Avec le fragment de code ci-avant, on affichera le temps écoulé après que la personne a fermé la première fenêtre modale, puis le temps total pris pour fermer les deux fenêtres : -![](timer_output.png) +```plain +ma mesure de temps : 1287 ms +ma mesure de temps : 2808 ms - chronomètre arrêté +``` -Notez que le nom du timer est à la fois affiché lorsque la valeur est affichée par `timeLog()` et lorsque le timer est arrêté +On notera que le nom du chronomètre est affiché avec la durée lors de l'appel à `timeLog()`, puis lors de l'arrêt. Quand on appelle `timeEnd()`, on a en plus le message « chronomètre arrêté » qui précise que le chronomètre est terminé. ## Spécifications @@ -77,4 +104,5 @@ Notez que le nom du timer est à la fois affiché lorsque la valeur est affiché ## Voir aussi -- [Documentation d'Opera Dragonfly: Console](http://www.opera.com/dragonfly/documentation/console/) +- [`console.time()`](/fr/docs/Web/API/console/time_static) +- [`console.timeEnd()`](/fr/docs/Web/API/console/timeend_static) diff --git a/files/fr/web/api/console/timestamp_static/index.md b/files/fr/web/api/console/timestamp_static/index.md index 615327b3dace7b..046596b9a82b14 100644 --- a/files/fr/web/api/console/timestamp_static/index.md +++ b/files/fr/web/api/console/timestamp_static/index.md @@ -1,27 +1,32 @@ --- -title: Console.timeStamp() +title: "console : méthode statique timeStamp()" slug: Web/API/console/timestamp_static -original_slug: Web/API/console/timeStamp +l10n: + sourceCommit: 022399901bdc60df947ee15e11a49be029e290d0 --- {{APIRef("Console API")}}{{Non-standard_header}} -Ajoute un seul marqueur à l'outil [Performance](https://developers.google.com/web/tools/chrome-devtools/evaluate-performance/reference) ou [Waterfall](/fr/docs/Outils/Performance/Waterfall) du navigateur. Cela vous permet de corréler un point de votre code avec les autres événements enregistrés dans la chronologie, tels que les événements de mise en page et de peinture. +La méthode **`console.timeStamp()`** permet d'ajouter un marqueur de performance pour l'outil de mesure des performance du navigateur ([Firefox](https://profiler.firefox.com/docs/#/), [Chrome](https://developer.chrome.com/docs/devtools/evaluate-performance/reference/)). Cela permet de dresser des corrélations entre un moment dans le code et d'autres évènements mesurés dans la chronologie (comme ceux relatifs à la disposition ou au rendu à l'écran). -Vous pouvez éventuellement fournir un argument pour étiqueter l'horodatage, et cette étiquette sera ensuite affichée à côté du marqueur. +Un argument optionnel permet de fournir un libellé pour le marqueur. {{AvailableInWorkers}} ## Syntaxe -```js -console.timeStamp(label); +```js-nolint +timeStamp(libelle) ``` -## Paramètres +### Paramètres -- `label` - - : Étiquette pour l'horodatage. Facultatif. +- `libelle` {{optional_inline}} + - : Un libellé à utiliser pour le marqueur d'horodatage. + +### Valeur de retour + +Aucune ([`undefined`](/fr/docs/Web/JavaScript/Reference/Global_Objects/undefined)). ## Compatibilité des navigateurs @@ -29,6 +34,6 @@ console.timeStamp(label); ## Voir aussi -- {{domxref("Console.time()")}} -- {{domxref("Console.timeEnd()")}} -- [Ajout d'un marqueur de temps pour le Waterfall](/fr/docs/Outils/Performance/Waterfall#Marqueurs_de_temps) +- [`console.time()`](/fr/docs/Web/API/console/time_static) +- [`console.timeLog()`](/fr/docs/Web/API/console/timelog_static) +- [`console.timeEnd()`](/fr/docs/Web/API/console/timeend_static) diff --git a/files/fr/web/api/console/trace_static/index.md b/files/fr/web/api/console/trace_static/index.md index 6fa3f7d6ec3117..63a3fd41e31892 100644 --- a/files/fr/web/api/console/trace_static/index.md +++ b/files/fr/web/api/console/trace_static/index.md @@ -1,41 +1,54 @@ --- -title: Console.trace() +title: "console : méthode statique trace()" slug: Web/API/console/trace_static -original_slug: Web/API/console/trace +l10n: + sourceCommit: 022399901bdc60df947ee15e11a49be029e290d0 --- -{{ APIRef("Console API") }} +{{APIRef("Console API")}} -Affiche la _stack trace_ dans la [Web Console](/fr/docs/Outils/Console_Web). +La méthode **`console.trace()`** permet d'afficher la trace de la pile d'appels dans la console. {{AvailableInWorkers}} -Voir [Stack traces](/fr/docs/Web/API/console#Stack_traces) dans la documentation de {{ domxref("console") }} pour plus de détails et d'exemples. +> **Note :** Dans certains navigateurs, `console.trace()` pourra également afficher la séquence des appels et des évènements asynchrones qui ont mené à l'appel courant de `console.trace()` et qui ne sont pas nécessairement dans la pile d'appels, pour aider à déterminer l'origine de la boucle d'évaluation courante. + +Voir [la section sur le traçage des piles d'appels dans la documentation de `console`](/fr/docs/Web/API/console#traces_dappel) pour plus de détails et d'exemples. ## Syntaxe -```js -console.trace(); +```js-nolint +trace() +trace(obj1, /* …, */ objN) ``` -## Exemple +### Paramètres + +- `obj1` … `objN` {{optional_inline}} + - : Zéro ou plusieurs objets à afficher dans la console avec la trace d'appels. Ces objets sont assemblés et formatés comme s'ils avaient été passés à [`console.log()`](/fr/docs/Web/API/console/log_static). + +### Valeur de retour + +Aucune ([`undefined`](/fr/docs/Web/JavaScript/Reference/Global_Objects/undefined)). + +## Exemples ```js -function foo() { - function bar() { +function toto() { + function truc() { console.trace(); } - bar(); + truc(); } -foo(); +toto(); ``` -Dans la console, la trace suivante sera affichée : +Avec le fragment de code précédent, on aura la trace suivante dans la console : ```plain -bar -foo +truc +toto ``` @@ -46,7 +59,3 @@ foo ## Compatibilité des navigateurs {{Compat}} - -## Voir aussi - -[Opera Dragonfly documentation: Console](http://www.opera.com/dragonfly/documentation/console/) diff --git a/files/fr/web/api/console/warn_static/index.md b/files/fr/web/api/console/warn_static/index.md index b41b1db15c3095..1699ca18b6c531 100644 --- a/files/fr/web/api/console/warn_static/index.md +++ b/files/fr/web/api/console/warn_static/index.md @@ -1,34 +1,41 @@ --- -title: Console.warn() +title: "console : méthode statique warn()" slug: Web/API/console/warn_static -original_slug: Web/API/console/warn +l10n: + sourceCommit: 022399901bdc60df947ee15e11a49be029e290d0 --- -{{ APIRef("Console API") }} +{{APIRef("Console API")}} -Affiche un message d'avertissement dans la console web. +La méthode **`console.warn()`** affiche un message d'avertissement dans la console. {{AvailableInWorkers}} -> **Note :** Dans Firefox, une icône de point d'exclamation est affichée à côté des messages d'avertissement +> **Note :** Dans Chrome et Firefox, les avertissements sont indiqués par un triangle avec un point d'exclamation. ## Syntaxe -```js -console.warn(obj1 [, obj2, ..., objN]); -console.warn(msg [, subst1, ..., substN]); +```js-nolint +warn(obj1) +warn(obj1, /* …, */ objN) +warn(msg) +warn(msg, subst1, /* …, */ substN) ``` -## Paramétres +### Paramètres -- `obj1` ... `objN` - - : Une liste d'objets JavaScript à afficher. La représentation, en chaîne de caractéres, de chacun de ces objets est affichée dans l'ordre de la liste. +- `obj1` … `objN` + - : Une liste d'objets JavaScript à afficher. Les représentations en chaînes de caractères de ces objets sont concaténés dans l'ordre et affichés dans la console. - `msg` - - : Une chaîne de caractères JavaScript contenant zéro ou plusieurs subdivisions de chaîne de caractères. -- `subst1` ... `substN` - - : Une liste d'objets JavaScript qui remplace les chaînes de caractéres de `msg`. Cela vous donne plus de contrôle sur le format de sortie. + - : Une chaîne de caractères JavaScript qui contient zéro ou plusieurs chaînes de substitution qui seront remplacées par `subst1` … `substN` dans l'ordre. +- `subst1` … `substN` + - : Des objets JavaScript avec lesquels remplacer les chaînes de substitution dans `msg`. Ce paramètre permet un contrôle supplémentaire sur le format de ce qui est affiché. Voir [la page sur les chaînes de caractères de substitution avec `console`](/fr/docs/Web/API/console#utiliser_les_caractères_de_substitution) pour plus de détails. -Voir [Outputting text to the console](/fr/docs/Web/API/console#Outputting_text_to_the_console) dans la documentation de {{ domxref("console") }} pour plus de détails. +Voir [Afficher du texte dans la console](/fr/docs/Web/API/console#afficher_du_texte_dans_la_console) pour plus de détails. + +### Valeur de retour + +Aucune ([`undefined`](/fr/docs/Web/JavaScript/Reference/Global_Objects/undefined)). ## Spécifications @@ -40,5 +47,6 @@ Voir [Outputting text to the console](/fr/docs/Web/API/console#Outputting_text_t ## Voir aussi -- [Opera Dragonfly documentation: Console](http://www.opera.com/dragonfly/documentation/console/) -- [MSDN: Using the F12 Tools Console to View Errors and Status](http://msdn.microsoft.com/library/gg589530) +- [Documentation Edge](https://learn.microsoft.com/en-us/microsoft-edge/devtools-guide-chromium/console/console-log#console-messages-examples-log-info-error-and-warn) +- [Documentation Node.JS sur l'API Console](https://nodejs.org/docs/latest/api/console.html#consolewarndata-args) +- [Documentation Chrome](https://developer.chrome.com/docs/devtools/console/api/#warn)