From f36cc6a7639a8f1adff02bc7a152bd7f54ceae6d Mon Sep 17 00:00:00 2001 From: julieng Date: Mon, 15 Nov 2021 21:45:09 +0100 Subject: move *.html to *.md --- .../add-ons/webextensions/api/devtools/index.html | 72 ------- .../add-ons/webextensions/api/devtools/index.md | 72 +++++++ .../api/devtools/inspectedwindow/eval/index.html | 217 --------------------- .../api/devtools/inspectedwindow/eval/index.md | 217 +++++++++++++++++++++ .../api/devtools/inspectedwindow/index.html | 83 -------- .../api/devtools/inspectedwindow/index.md | 83 ++++++++ .../api/devtools/inspectedwindow/reload/index.html | 98 ---------- .../api/devtools/inspectedwindow/reload/index.md | 98 ++++++++++ .../api/devtools/inspectedwindow/tabid/index.html | 84 -------- .../api/devtools/inspectedwindow/tabid/index.md | 84 ++++++++ .../api/devtools/network/gethar/index.html | 87 --------- .../api/devtools/network/gethar/index.md | 87 +++++++++ .../webextensions/api/devtools/network/index.html | 76 -------- .../webextensions/api/devtools/network/index.md | 76 ++++++++ .../api/devtools/network/onnavigated/index.html | 102 ---------- .../api/devtools/network/onnavigated/index.md | 102 ++++++++++ .../devtools/network/onrequestfinished/index.html | 111 ----------- .../devtools/network/onrequestfinished/index.md | 111 +++++++++++ .../api/devtools/panels/create/index.html | 109 ----------- .../api/devtools/panels/create/index.md | 109 +++++++++++ .../api/devtools/panels/elements/index.html | 28 --- .../api/devtools/panels/elements/index.md | 28 +++ .../elementspanel/createsidebarpane/index.html | 107 ---------- .../elementspanel/createsidebarpane/index.md | 107 ++++++++++ .../api/devtools/panels/elementspanel/index.html | 74 ------- .../api/devtools/panels/elementspanel/index.md | 74 +++++++ .../elementspanel/onselectionchanged/index.html | 74 ------- .../elementspanel/onselectionchanged/index.md | 74 +++++++ .../api/devtools/panels/extensionpanel/index.html | 92 --------- .../api/devtools/panels/extensionpanel/index.md | 92 +++++++++ .../panels/extensionsidebarpane/index.html | 90 --------- .../devtools/panels/extensionsidebarpane/index.md | 90 +++++++++ .../extensionsidebarpane/onhidden/index.html | 80 -------- .../panels/extensionsidebarpane/onhidden/index.md | 80 ++++++++ .../panels/extensionsidebarpane/onshown/index.html | 77 -------- .../panels/extensionsidebarpane/onshown/index.md | 77 ++++++++ .../extensionsidebarpane/setexpression/index.html | 106 ---------- .../extensionsidebarpane/setexpression/index.md | 106 ++++++++++ .../extensionsidebarpane/setobject/index.html | 104 ---------- .../panels/extensionsidebarpane/setobject/index.md | 104 ++++++++++ .../panels/extensionsidebarpane/setpage/index.html | 86 -------- .../panels/extensionsidebarpane/setpage/index.md | 86 ++++++++ .../webextensions/api/devtools/panels/index.html | 104 ---------- .../webextensions/api/devtools/panels/index.md | 104 ++++++++++ .../api/devtools/panels/onthemechanged/index.html | 71 ------- .../api/devtools/panels/onthemechanged/index.md | 71 +++++++ .../api/devtools/panels/themename/index.html | 38 ---- .../api/devtools/panels/themename/index.md | 38 ++++ 48 files changed, 2170 insertions(+), 2170 deletions(-) delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/index.md delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/eval/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/eval/index.md delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/index.md delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/reload/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/reload/index.md delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/tabid/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/tabid/index.md delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/network/gethar/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/network/gethar/index.md delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/network/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/network/index.md delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/network/onnavigated/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/network/onnavigated/index.md delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/network/onrequestfinished/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/network/onrequestfinished/index.md delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/create/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/create/index.md delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elements/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elements/index.md delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/createsidebarpane/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/createsidebarpane/index.md delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/index.md delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/onselectionchanged/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/onselectionchanged/index.md delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionpanel/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionpanel/index.md delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/index.md delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onhidden/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onhidden/index.md delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onshown/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onshown/index.md delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setexpression/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setexpression/index.md delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setobject/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setobject/index.md delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setpage/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setpage/index.md delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/index.md delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/onthemechanged/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/onthemechanged/index.md delete mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/themename/index.html create mode 100644 files/fr/mozilla/add-ons/webextensions/api/devtools/panels/themename/index.md (limited to 'files/fr/mozilla/add-ons/webextensions/api/devtools') diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/index.html deleted file mode 100644 index 70c32fc4f4..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/index.html +++ /dev/null @@ -1,72 +0,0 @@ ---- -title: devtools -slug: Mozilla/Add-ons/WebExtensions/API/devtools -tags: - - API - - Add-ons - - Extensions - - Reference - - WebExtensions - - devtools.inspectedWindow - - devtools.network - - devtools.panels -translation_of: Mozilla/Add-ons/WebExtensions/API/devtools ---- -

{{AddonSidebar}}

- -

Permet aux extensions d'interagir avec le {{Glossary("Developer Tools")}} du navigateur. Vous pouvez utiliser cette API pour créer des pages d'outils de développement, interagir avec la fenêtre qui est inspectée, inspecter l'utilisation du réseau de pages.

- -

Pour utiliser cette API, vous devez disposer de la permission API "devtools" spécifiée dans votre fichier manifest.json. Cette permission ne peut pas être facultative.

- -

Interfaces

- -
-
{{WebExtAPIRef("devtools.inspectedWindow")}}
-
Interagir avec la fenêtre à laquelle les outils de développement sont attachés (fenêtre inspectée). Cela inclut l'obtention de l'onglet ID pour la page inspectée, l'évaluation du code dans le contexte de la fenêtre inspectée, le rechargement de la page ou l'obtention de la liste des ressources dans la page.
-
{{WebExtAPIRef("devtools.network")}}
-
Obtenir des informations sur les requêtes de réseau associées à la fenêtre à laquelle les outils de développement sont attachés (la fenêtre inspectée).
-
{{WebExtAPIRef("devtools.panels")}}
-
Créer des panneaux d'interface utilisateur qui seront affichés dans les outils de développement de l'agent utilisateur.
-
- -

Compatibilité du navigateur

- -

{{Compat("webextensions.api.devtools")}}

- -

Note :

- -

Cette API est basé sur l'API  chrome.downloads de Chromium.

- -

Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.

-
- - diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/index.md new file mode 100644 index 0000000000..70c32fc4f4 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/index.md @@ -0,0 +1,72 @@ +--- +title: devtools +slug: Mozilla/Add-ons/WebExtensions/API/devtools +tags: + - API + - Add-ons + - Extensions + - Reference + - WebExtensions + - devtools.inspectedWindow + - devtools.network + - devtools.panels +translation_of: Mozilla/Add-ons/WebExtensions/API/devtools +--- +

{{AddonSidebar}}

+ +

Permet aux extensions d'interagir avec le {{Glossary("Developer Tools")}} du navigateur. Vous pouvez utiliser cette API pour créer des pages d'outils de développement, interagir avec la fenêtre qui est inspectée, inspecter l'utilisation du réseau de pages.

+ +

Pour utiliser cette API, vous devez disposer de la permission API "devtools" spécifiée dans votre fichier manifest.json. Cette permission ne peut pas être facultative.

+ +

Interfaces

+ +
+
{{WebExtAPIRef("devtools.inspectedWindow")}}
+
Interagir avec la fenêtre à laquelle les outils de développement sont attachés (fenêtre inspectée). Cela inclut l'obtention de l'onglet ID pour la page inspectée, l'évaluation du code dans le contexte de la fenêtre inspectée, le rechargement de la page ou l'obtention de la liste des ressources dans la page.
+
{{WebExtAPIRef("devtools.network")}}
+
Obtenir des informations sur les requêtes de réseau associées à la fenêtre à laquelle les outils de développement sont attachés (la fenêtre inspectée).
+
{{WebExtAPIRef("devtools.panels")}}
+
Créer des panneaux d'interface utilisateur qui seront affichés dans les outils de développement de l'agent utilisateur.
+
+ +

Compatibilité du navigateur

+ +

{{Compat("webextensions.api.devtools")}}

+ +

Note :

+ +

Cette API est basé sur l'API  chrome.downloads de Chromium.

+ +

Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.

+
+ + diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/eval/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/eval/index.html deleted file mode 100644 index b0a63e7c22..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/eval/index.html +++ /dev/null @@ -1,217 +0,0 @@ ---- -title: devtools.inspectedWindow.eval() -slug: Mozilla/Add-ons/WebExtensions/API/devtools/inspectedWindow/eval -tags: - - API - - Add-ons - - Devtools.inspectedWindows - - Extensions - - Reference - - WebExtensions - - eval -translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow/eval -original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow/eval ---- -
{{AddonSidebar()}}
- -

Exécute JavaScript dans la fenêtre à laquelle les devtools sont attachés.

- -

C'est un peu comme utiliser {{WebExtAPIRef("tabs.executeScript()")}} pour joindre un script de contenu, mais avec deux différences principales:

- -

Tout d'abord, le JavaScript peut utiliser un ensemble de commandes spéciales que les navigateurs fournissent généralement dans leur implémentation de console devtools : par exemple, en utilisant "$0" pour designer l'élément actuellement sélectionné dans l'inspecteur.

- -

Deuxièmement, le JavaScript que vous exécutez peut voir les modifications apportées à la page par des scripts que la page a chargés. Cela contraste avec les scripts de contenu, qui voient la page telle qu'elle existerait si aucun script de page n'était pas chargé. Cependant, notez que l'isolement fourni par les scripts de contenu est une fonction de sécurité délibérée, destinée à rendre plus difficile la confusion ou la subversion des WebExtensions par des pages web malveillantes ou simplement non coopératives en redéfinissant les fonctions et les propriétés du DOM. Cela signifie que vous devez être très prudent si vous renoncez à cette protection en utilisant eval(), et devrait utiliser les scripts de contenu, sauf si vous devez utiliser eval().

- -

Le script est évalué par défaut dans le cadre principal de la page. Le script doit évaluer une valeur qui peut être représentée comme JSON (ce qui signifie que, par exemple, il peut ne pas évaluer une fonction ou un objet contenant des fonctions). Par défaut, le script ne voit pas les scripts de contenu attachés à la page.

- -

Vous ne pouvez pas appeler eval() sur les fenêtres de navigateur privilégiées telles que "about: addons".

- -

Vous pouvez éventuellement fournir un paramètre d'options, qui comprend des options pour évaluer le script dans une image différente ou dans le contexte des scripts de contenu attachés. Notez que Firefox ne supporte pas encore le paramètre d'options.

- -

La fonction eval() renvoie une Promise qui résout le résultat évalué du script ou une erreur.

- -

Aides

- -

Le script accède à un certain nombre d'objets qui aident le script injecté à interagir avec les outils du développeur. Les assistants suivants sont actuellement pris en charge:

- -
-
$0
-
Contient une référence à l'élément actuellement sélectionné dans l'inspecteur Devtools.
-
inspect()
-
Etant donné un objet, s'il s'agit d'un élément DOM dans la page, sélectionnez-le dans l'inspecteur devtools, sinon il crée un aperçu de l'objet dans la webconsole.
-
- -

Voir quelques exemples.

- -

Syntaxe

- -
var evaluating = browser.devtools.inspectedWindow.eval(
-  expression,       // string
-  options           // object
-)
-
- -

Paramètres

- -
-
expression
-
string. L'expression JavaScript à évaluer. La chaîne doit évaluer un objet qui peut être représenté comme JSON, ou une exception sera lancée. Par exemple, l'expression ne doit pas évaluer une fonction.
-
options{{optional_inline}}
-

object. Options pour la fonction  (Notez que Firefox ne supporte pas encore cette option), comme suit :

-
-
frameURL{{optional_inline}}
-
string. L'URL du cadre dans lequel à évaluer l'expression. Si cela est supprimé, l'expression est évaluée dans la trame principale de la fenêtre.
-
useContentScriptContext{{optional_inline}}
-
boolean. Si c'est vrai, évaluez l'expression dans le contexte des scripts de contenu que cette extension a attachée à la page. Si vous définissez cette option, vous devez d'abord attacher certains scripts de contenu à la page ou une erreur Devtools sera lancée.
-
contextSecurityOrigin {{optional_inline}}
-
string. Evaluez l'expression dans le contexte d'un script de contenu attaché par une extension différente, dont l'origine correspond à la valeur donnée ici. Ces remplacements sont useContentScriptContext.
-
-
-
- -

Valeur retournée

- -

Une Promise qui sera remplie avec un tableau contenant deux éléments.

- -

Si aucune erreur n'est survenue, l'élément 0 contiendra le résultat de l'évaluation de l'expression et l'élément 1 sera indéfini.

- -

Si une erreur s'est produite, l'élément 0 sera indéfini et l'élément 1 contiendra un objet donnant des détails sur l'erreur. Deux types différents d'erreurs sont distingués :

- - - -

Compatibilité des navigateurs

- -

{{Compat("webextensions.api.devtools.inspectedWindow.eval")}}

- -

Exemples

- -

Ceci teste si jQuery est défini dans la fenêtre inspectée et enregistre le résultat. Notez que cela ne fonctionnerait pas dans un script de contenu, car même si jQuery était défini, le script de contenu ne le verrait pas.

- -
function handleError(error) {
-  if (error.isError) {
-    console.log(`Devtools error: ${error.code}`);
-  } else {
-    console.log(`JavaScript error: ${error.value}`);
-  }
-}
-
-function handleResult(result) {
-  console.log(result);
-  if (result[0] !== undefined) {
-    console.log(`jQuery: ${result[0]}`);
-  } else if (result[1]) {
-    handleError(result[1]);
-  }
-}
-
-const checkjQuery = "typeof jQuery != 'undefined'";
-
-evalButton.addEventListener("click", () => {
-  browser.devtools.inspectedWindow.eval(checkjQuery)
-    .then(handleResult);
-});
- -

Exemples d'aide

- -

Cela utilise l'aide de $0 pour définir la couleur d'arrière-plan de l'élément, actuellement sélectionné dans l'inspecteur :

- -
const evalButton = document.querySelector("#reddinate");
-const evalString = "$0.style.backgroundColor = 'red'";
-
-function handleError(error) {
-  if (error.isError) {
-    console.log(`Devtools error: ${error.code}`);
-  } else {
-    console.log(`JavaScript error: ${error.value}`);
-  }
-}
-
-function handleResult(result) {
-  if (result[1]) {
-    handleError(result[1]);
-  }
-}
-
-evalButton.addEventListener("click", () => {
-  browser.devtools.inspectedWindow.eval(evalString)
-    .then(handleResult);
-});
-
- -

Cela utilise l'assistant l'inspection() pour sélectionner le premier élément <h1> dans la page:

- -
const inspectButton = document.querySelector("#inspect");
-const inspectString = "inspect(document.querySelector('h1'))";
-
-function handleError(error) {
-  if (error.isError) {
-    console.log(`Devtools error: ${error.code}`);
-  } else {
-    console.log(`JavaScript error: ${error.value}`);
-  }
-}
-
-function handleResult(result) {
-  if (result[1]) {
-    handleError(result[1]);
-  }
-}
-
-inspectButton.addEventListener("click", () => {
-  browser.devtools.inspectedWindow.eval(inspectString)
-    .then(handleResult);
-});
-
- -

{{WebExtExamples}}

- -

Note :

- -

Cette API est basée sur l'API Chromium chrome.devtools.

- -

Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.

-
- - diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/eval/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/eval/index.md new file mode 100644 index 0000000000..b0a63e7c22 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/eval/index.md @@ -0,0 +1,217 @@ +--- +title: devtools.inspectedWindow.eval() +slug: Mozilla/Add-ons/WebExtensions/API/devtools/inspectedWindow/eval +tags: + - API + - Add-ons + - Devtools.inspectedWindows + - Extensions + - Reference + - WebExtensions + - eval +translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow/eval +original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow/eval +--- +
{{AddonSidebar()}}
+ +

Exécute JavaScript dans la fenêtre à laquelle les devtools sont attachés.

+ +

C'est un peu comme utiliser {{WebExtAPIRef("tabs.executeScript()")}} pour joindre un script de contenu, mais avec deux différences principales:

+ +

Tout d'abord, le JavaScript peut utiliser un ensemble de commandes spéciales que les navigateurs fournissent généralement dans leur implémentation de console devtools : par exemple, en utilisant "$0" pour designer l'élément actuellement sélectionné dans l'inspecteur.

+ +

Deuxièmement, le JavaScript que vous exécutez peut voir les modifications apportées à la page par des scripts que la page a chargés. Cela contraste avec les scripts de contenu, qui voient la page telle qu'elle existerait si aucun script de page n'était pas chargé. Cependant, notez que l'isolement fourni par les scripts de contenu est une fonction de sécurité délibérée, destinée à rendre plus difficile la confusion ou la subversion des WebExtensions par des pages web malveillantes ou simplement non coopératives en redéfinissant les fonctions et les propriétés du DOM. Cela signifie que vous devez être très prudent si vous renoncez à cette protection en utilisant eval(), et devrait utiliser les scripts de contenu, sauf si vous devez utiliser eval().

+ +

Le script est évalué par défaut dans le cadre principal de la page. Le script doit évaluer une valeur qui peut être représentée comme JSON (ce qui signifie que, par exemple, il peut ne pas évaluer une fonction ou un objet contenant des fonctions). Par défaut, le script ne voit pas les scripts de contenu attachés à la page.

+ +

Vous ne pouvez pas appeler eval() sur les fenêtres de navigateur privilégiées telles que "about: addons".

+ +

Vous pouvez éventuellement fournir un paramètre d'options, qui comprend des options pour évaluer le script dans une image différente ou dans le contexte des scripts de contenu attachés. Notez que Firefox ne supporte pas encore le paramètre d'options.

+ +

La fonction eval() renvoie une Promise qui résout le résultat évalué du script ou une erreur.

+ +

Aides

+ +

Le script accède à un certain nombre d'objets qui aident le script injecté à interagir avec les outils du développeur. Les assistants suivants sont actuellement pris en charge:

+ +
+
$0
+
Contient une référence à l'élément actuellement sélectionné dans l'inspecteur Devtools.
+
inspect()
+
Etant donné un objet, s'il s'agit d'un élément DOM dans la page, sélectionnez-le dans l'inspecteur devtools, sinon il crée un aperçu de l'objet dans la webconsole.
+
+ +

Voir quelques exemples.

+ +

Syntaxe

+ +
var evaluating = browser.devtools.inspectedWindow.eval(
+  expression,       // string
+  options           // object
+)
+
+ +

Paramètres

+ +
+
expression
+
string. L'expression JavaScript à évaluer. La chaîne doit évaluer un objet qui peut être représenté comme JSON, ou une exception sera lancée. Par exemple, l'expression ne doit pas évaluer une fonction.
+
options{{optional_inline}}
+

object. Options pour la fonction  (Notez que Firefox ne supporte pas encore cette option), comme suit :

+
+
frameURL{{optional_inline}}
+
string. L'URL du cadre dans lequel à évaluer l'expression. Si cela est supprimé, l'expression est évaluée dans la trame principale de la fenêtre.
+
useContentScriptContext{{optional_inline}}
+
boolean. Si c'est vrai, évaluez l'expression dans le contexte des scripts de contenu que cette extension a attachée à la page. Si vous définissez cette option, vous devez d'abord attacher certains scripts de contenu à la page ou une erreur Devtools sera lancée.
+
contextSecurityOrigin {{optional_inline}}
+
string. Evaluez l'expression dans le contexte d'un script de contenu attaché par une extension différente, dont l'origine correspond à la valeur donnée ici. Ces remplacements sont useContentScriptContext.
+
+
+
+ +

Valeur retournée

+ +

Une Promise qui sera remplie avec un tableau contenant deux éléments.

+ +

Si aucune erreur n'est survenue, l'élément 0 contiendra le résultat de l'évaluation de l'expression et l'élément 1 sera indéfini.

+ +

Si une erreur s'est produite, l'élément 0 sera indéfini et l'élément 1 contiendra un objet donnant des détails sur l'erreur. Deux types différents d'erreurs sont distingués :

+ + + +

Compatibilité des navigateurs

+ +

{{Compat("webextensions.api.devtools.inspectedWindow.eval")}}

+ +

Exemples

+ +

Ceci teste si jQuery est défini dans la fenêtre inspectée et enregistre le résultat. Notez que cela ne fonctionnerait pas dans un script de contenu, car même si jQuery était défini, le script de contenu ne le verrait pas.

+ +
function handleError(error) {
+  if (error.isError) {
+    console.log(`Devtools error: ${error.code}`);
+  } else {
+    console.log(`JavaScript error: ${error.value}`);
+  }
+}
+
+function handleResult(result) {
+  console.log(result);
+  if (result[0] !== undefined) {
+    console.log(`jQuery: ${result[0]}`);
+  } else if (result[1]) {
+    handleError(result[1]);
+  }
+}
+
+const checkjQuery = "typeof jQuery != 'undefined'";
+
+evalButton.addEventListener("click", () => {
+  browser.devtools.inspectedWindow.eval(checkjQuery)
+    .then(handleResult);
+});
+ +

Exemples d'aide

+ +

Cela utilise l'aide de $0 pour définir la couleur d'arrière-plan de l'élément, actuellement sélectionné dans l'inspecteur :

+ +
const evalButton = document.querySelector("#reddinate");
+const evalString = "$0.style.backgroundColor = 'red'";
+
+function handleError(error) {
+  if (error.isError) {
+    console.log(`Devtools error: ${error.code}`);
+  } else {
+    console.log(`JavaScript error: ${error.value}`);
+  }
+}
+
+function handleResult(result) {
+  if (result[1]) {
+    handleError(result[1]);
+  }
+}
+
+evalButton.addEventListener("click", () => {
+  browser.devtools.inspectedWindow.eval(evalString)
+    .then(handleResult);
+});
+
+ +

Cela utilise l'assistant l'inspection() pour sélectionner le premier élément <h1> dans la page:

+ +
const inspectButton = document.querySelector("#inspect");
+const inspectString = "inspect(document.querySelector('h1'))";
+
+function handleError(error) {
+  if (error.isError) {
+    console.log(`Devtools error: ${error.code}`);
+  } else {
+    console.log(`JavaScript error: ${error.value}`);
+  }
+}
+
+function handleResult(result) {
+  if (result[1]) {
+    handleError(result[1]);
+  }
+}
+
+inspectButton.addEventListener("click", () => {
+  browser.devtools.inspectedWindow.eval(inspectString)
+    .then(handleResult);
+});
+
+ +

{{WebExtExamples}}

+ +

Note :

+ +

Cette API est basée sur l'API Chromium chrome.devtools.

+ +

Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.

+
+ + diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/index.html deleted file mode 100644 index ed589e5b7c..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/index.html +++ /dev/null @@ -1,83 +0,0 @@ ---- -title: devtools.inspectedWindow -slug: Mozilla/Add-ons/WebExtensions/API/devtools/inspectedWindow -tags: - - API - - Add-ons - - Devtools.inspectedWindows - - Extensions - - Reference - - WebExtensions -translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow -original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow ---- -
{{AddonSidebar}}
- -
-

Note : Cette page décrit les API de développement de WebExtensions telles qu'elles existent dans Firefox 54. Bien que les API soient basées sur les APIs de devtools de Chrome, il existe encore de nombreuses fonctionnalités qui ne sont pas encore implémentées dans Firefox et ne sont donc pas documentées ici. Pour voir les fonctionnalités actuellement manquantes, regarder  Limitations des APIs devtools.

-
- -

L'API devtools.inspectedWindow permet à un extension de devtools d'interagir avec la fenêtre sur laquelle les outils de développement sont attachés.

- -

Comme toutes les APIs de devtools, cette API n'est disponible que pour exécuter le code dans le document défini dans la clé devtools_page du manifest.json, où dans d'autres documents devtools créés par l'extension (tels que le document hébergé par un panneau, l'extension créée). Voir Extension des outils de développement  pour plus d'informations.

- -

Propriétés

- -
-
devtools.inspectedWindow.tabId
-
L'ID de la fenêtre sur laquelle sont attachés les outils du développeur.
-
- -

Fonctions

- -
-
devtools.inspectedWindow.eval()
-
Evaluez certains JavaScript dans la fenêtre de destination.
-
devtools.inspectedWindow.reload()
-
Rechargez le document de la fenêtre destination.
-
- -

Comptatibilité navigateur

- -

{{Compat("webextensions.api.devtools.inspectedWindow")}}

- -

{{WebExtExamples("h2")}}

- - - -

Note :

- -

Cette API est basée sur l'API Chromium chrome.devtools.inspectedWindow.

- -

Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.

-
- - diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/index.md new file mode 100644 index 0000000000..ed589e5b7c --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/index.md @@ -0,0 +1,83 @@ +--- +title: devtools.inspectedWindow +slug: Mozilla/Add-ons/WebExtensions/API/devtools/inspectedWindow +tags: + - API + - Add-ons + - Devtools.inspectedWindows + - Extensions + - Reference + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow +original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow +--- +
{{AddonSidebar}}
+ +
+

Note : Cette page décrit les API de développement de WebExtensions telles qu'elles existent dans Firefox 54. Bien que les API soient basées sur les APIs de devtools de Chrome, il existe encore de nombreuses fonctionnalités qui ne sont pas encore implémentées dans Firefox et ne sont donc pas documentées ici. Pour voir les fonctionnalités actuellement manquantes, regarder  Limitations des APIs devtools.

+
+ +

L'API devtools.inspectedWindow permet à un extension de devtools d'interagir avec la fenêtre sur laquelle les outils de développement sont attachés.

+ +

Comme toutes les APIs de devtools, cette API n'est disponible que pour exécuter le code dans le document défini dans la clé devtools_page du manifest.json, où dans d'autres documents devtools créés par l'extension (tels que le document hébergé par un panneau, l'extension créée). Voir Extension des outils de développement  pour plus d'informations.

+ +

Propriétés

+ +
+
devtools.inspectedWindow.tabId
+
L'ID de la fenêtre sur laquelle sont attachés les outils du développeur.
+
+ +

Fonctions

+ +
+
devtools.inspectedWindow.eval()
+
Evaluez certains JavaScript dans la fenêtre de destination.
+
devtools.inspectedWindow.reload()
+
Rechargez le document de la fenêtre destination.
+
+ +

Comptatibilité navigateur

+ +

{{Compat("webextensions.api.devtools.inspectedWindow")}}

+ +

{{WebExtExamples("h2")}}

+ + + +

Note :

+ +

Cette API est basée sur l'API Chromium chrome.devtools.inspectedWindow.

+ +

Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.

+
+ + diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/reload/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/reload/index.html deleted file mode 100644 index ee1076553c..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/reload/index.html +++ /dev/null @@ -1,98 +0,0 @@ ---- -title: devtools.inspectedWindow.reload() -slug: Mozilla/Add-ons/WebExtensions/API/devtools/inspectedWindow/reload -tags: - - API - - Add-ons - - Extensions - - Reference - - WebExtensions - - devtools.inspectedWindow - - reload -translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow/reload -original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow/reload ---- -
{{AddonSidebar()}}
- -

Recharge la fenêtre à laquelle les devtools sont attachés.

- -

Syntaxe

- -
browser.devtools.inspectedWindow.reload(
-  reloadOptions       // object
-)
-
- -

Paramètres

- -
-
reloadOptions{{optional_inline}}
-

object. Options pour la fonction, comme suit

-
-
ignoreCache{{optional_inline}}
-
boolean. S'il est vrai, cela fait que le rechargement ignore le cache du navigateur (comme si l'utilisateur avait appuyé sur Shift+Ctrl+R).
-
userAgent{{optional_inline}}
-
string. Définissez un agent utilisateur personnalisé pour la page. Ici, la chaîne fournie sera envoyée dans l'en-tête de l'Agent utilisateur, et sera renvoyée par les appels à navigator.userAgent réalisé par des scripts s'exécutant sur la page.
-
injectedScript {{optional_inline}}
-
string. Injectez l'expression JavaScript donnée dans toutes les images de la page, avant tout autre script.
-
-
-
- -

Compatibilité du navigateur

- -

{{Compat("webextensions.api.devtools.inspectedWindow.reload")}}

- -

Exemples

- -

Rechargez la fenêtre inspectée, définissez l'agent utilisateur et injectez un script

- -
const reloadButton = document.querySelector("#reload-button");
-
-reloadButton.addEventListener("click", () => {
-  browser.devtools.inspectedWindow.reload({
-    injectedScript:"alert(navigator.userAgent);",
-    userAgent: "Not a real UA"
-  });
-});
-
- -

{{WebExtExamples}}

- -

Note :

- -

Cette API est basée sur l'API Chromium chrome.devtools.

- -

Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.

-
- - diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/reload/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/reload/index.md new file mode 100644 index 0000000000..ee1076553c --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/reload/index.md @@ -0,0 +1,98 @@ +--- +title: devtools.inspectedWindow.reload() +slug: Mozilla/Add-ons/WebExtensions/API/devtools/inspectedWindow/reload +tags: + - API + - Add-ons + - Extensions + - Reference + - WebExtensions + - devtools.inspectedWindow + - reload +translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow/reload +original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow/reload +--- +
{{AddonSidebar()}}
+ +

Recharge la fenêtre à laquelle les devtools sont attachés.

+ +

Syntaxe

+ +
browser.devtools.inspectedWindow.reload(
+  reloadOptions       // object
+)
+
+ +

Paramètres

+ +
+
reloadOptions{{optional_inline}}
+

object. Options pour la fonction, comme suit

+
+
ignoreCache{{optional_inline}}
+
boolean. S'il est vrai, cela fait que le rechargement ignore le cache du navigateur (comme si l'utilisateur avait appuyé sur Shift+Ctrl+R).
+
userAgent{{optional_inline}}
+
string. Définissez un agent utilisateur personnalisé pour la page. Ici, la chaîne fournie sera envoyée dans l'en-tête de l'Agent utilisateur, et sera renvoyée par les appels à navigator.userAgent réalisé par des scripts s'exécutant sur la page.
+
injectedScript {{optional_inline}}
+
string. Injectez l'expression JavaScript donnée dans toutes les images de la page, avant tout autre script.
+
+
+
+ +

Compatibilité du navigateur

+ +

{{Compat("webextensions.api.devtools.inspectedWindow.reload")}}

+ +

Exemples

+ +

Rechargez la fenêtre inspectée, définissez l'agent utilisateur et injectez un script

+ +
const reloadButton = document.querySelector("#reload-button");
+
+reloadButton.addEventListener("click", () => {
+  browser.devtools.inspectedWindow.reload({
+    injectedScript:"alert(navigator.userAgent);",
+    userAgent: "Not a real UA"
+  });
+});
+
+ +

{{WebExtExamples}}

+ +

Note :

+ +

Cette API est basée sur l'API Chromium chrome.devtools.

+ +

Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.

+
+ + diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/tabid/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/tabid/index.html deleted file mode 100644 index 74bd42ba3b..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/tabid/index.html +++ /dev/null @@ -1,84 +0,0 @@ ---- -title: devtools.inspectedWindow.tabId -slug: Mozilla/Add-ons/WebExtensions/API/devtools/inspectedWindow/tabId -tags: - - API - - Add-ons - - Extensions - - Reference - - WebExtensions - - devtools.inpectedWindow - - tabId -translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow/tabId -original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow/tabId ---- -
{{AddonSidebar()}}
- -

L'ID de {{WebExtAPIRef("tabs.Tab", "tab")}} est que cette instance des devtools est jointe, représenté comme un nombre.

- -

Cela peut être envoyé à la page de fond de l'extension, de sorte que la page d'arrière plan peut utiliser l'API {{WebExtAPIRef("tabs")}} pour interargir avec l'onglet :

- -
// devtools-panel.js
-
-const scriptToAttach = "document.body.innerHTML = 'Hi from the devtools';";
-
-attachContentScriptButton.addEventListener("click", () => {
-  browser.runtime.sendMessage({
-    tabId: browser.devtools.inspectedWindow.tabId,
-    script: scriptToAttach
-  });
-});
- -
// background.js
-
-function handleMessage(request, sender, sendResponse) {
-  browser.tabs.executeScript(request.tabId, {
-    code: request.script
-  });
-}
-
-browser.runtime.onMessage.addListener(handleMessage);
- -

Compatibilité du navigateur

- -

{{Compat("webextensions.api.devtools.inspectedWindow.tabId")}}

- -

{{WebExtExamples}}

- -

Note :

- -

Cette API est basée sur l'API Chromium chrome.devtools.

- -

Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.

-
- - diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/tabid/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/tabid/index.md new file mode 100644 index 0000000000..74bd42ba3b --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/tabid/index.md @@ -0,0 +1,84 @@ +--- +title: devtools.inspectedWindow.tabId +slug: Mozilla/Add-ons/WebExtensions/API/devtools/inspectedWindow/tabId +tags: + - API + - Add-ons + - Extensions + - Reference + - WebExtensions + - devtools.inpectedWindow + - tabId +translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow/tabId +original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.inspectedWindow/tabId +--- +
{{AddonSidebar()}}
+ +

L'ID de {{WebExtAPIRef("tabs.Tab", "tab")}} est que cette instance des devtools est jointe, représenté comme un nombre.

+ +

Cela peut être envoyé à la page de fond de l'extension, de sorte que la page d'arrière plan peut utiliser l'API {{WebExtAPIRef("tabs")}} pour interargir avec l'onglet :

+ +
// devtools-panel.js
+
+const scriptToAttach = "document.body.innerHTML = 'Hi from the devtools';";
+
+attachContentScriptButton.addEventListener("click", () => {
+  browser.runtime.sendMessage({
+    tabId: browser.devtools.inspectedWindow.tabId,
+    script: scriptToAttach
+  });
+});
+ +
// background.js
+
+function handleMessage(request, sender, sendResponse) {
+  browser.tabs.executeScript(request.tabId, {
+    code: request.script
+  });
+}
+
+browser.runtime.onMessage.addListener(handleMessage);
+ +

Compatibilité du navigateur

+ +

{{Compat("webextensions.api.devtools.inspectedWindow.tabId")}}

+ +

{{WebExtExamples}}

+ +

Note :

+ +

Cette API est basée sur l'API Chromium chrome.devtools.

+ +

Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.

+
+ + diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/network/gethar/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/network/gethar/index.html deleted file mode 100644 index 622856787a..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/network/gethar/index.html +++ /dev/null @@ -1,87 +0,0 @@ ---- -title: devtools.network.getHAR() -slug: Mozilla/Add-ons/WebExtensions/API/devtools/network/getHAR -tags: - - Add-ons - - Extensions - - WebExtensions - - devtools.network - - getHAR -translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.network/getHAR -original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.network/getHAR ---- -
{{AddonSidebar()}}
- -

Obtenez un journal HAR pour la page chargée dans l'onglet en cours.

- -

C'est une fonction asynchrone qui renvoie une Promise.

- -

Syntaxe

- -
var getting = browser.devtools.network.getHAR()
-
- -

Paramètres

- -

None.

- -

Valeur retournée

- -

Une Promise qui sera remplie avec un objet contenant le journal HAR pour l'onglet en cours. Pour plus de détails sur ce que contient l'objet journal, reportez-vous à la spécification HAR.

- -

Compatibilité du navigateur

- -

{{Compat("webextensions.api.devtools.network.getHAR")}}

- -

Exemples

- -

Consignez les URL des demandes contenues dans le journal HAR :

- -
async function logRequests() {
-  let harLog = await browser.devtools.network.getHAR();
-  console.log(`HAR version: ${harLog.version}`);
-  for (let entry of harLog.entries) {
-    console.log(entry.request.url);
-  }
-}
-
-logRequestsButton.addEventListener("click", logRequests);
-
- -

{{WebExtExamples}}

- -

Note :

- -

Cette API est basée sur l'API Chromium chrome.devtools.network.

-
- - diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/network/gethar/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/network/gethar/index.md new file mode 100644 index 0000000000..622856787a --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/network/gethar/index.md @@ -0,0 +1,87 @@ +--- +title: devtools.network.getHAR() +slug: Mozilla/Add-ons/WebExtensions/API/devtools/network/getHAR +tags: + - Add-ons + - Extensions + - WebExtensions + - devtools.network + - getHAR +translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.network/getHAR +original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.network/getHAR +--- +
{{AddonSidebar()}}
+ +

Obtenez un journal HAR pour la page chargée dans l'onglet en cours.

+ +

C'est une fonction asynchrone qui renvoie une Promise.

+ +

Syntaxe

+ +
var getting = browser.devtools.network.getHAR()
+
+ +

Paramètres

+ +

None.

+ +

Valeur retournée

+ +

Une Promise qui sera remplie avec un objet contenant le journal HAR pour l'onglet en cours. Pour plus de détails sur ce que contient l'objet journal, reportez-vous à la spécification HAR.

+ +

Compatibilité du navigateur

+ +

{{Compat("webextensions.api.devtools.network.getHAR")}}

+ +

Exemples

+ +

Consignez les URL des demandes contenues dans le journal HAR :

+ +
async function logRequests() {
+  let harLog = await browser.devtools.network.getHAR();
+  console.log(`HAR version: ${harLog.version}`);
+  for (let entry of harLog.entries) {
+    console.log(entry.request.url);
+  }
+}
+
+logRequestsButton.addEventListener("click", logRequests);
+
+ +

{{WebExtExamples}}

+ +

Note :

+ +

Cette API est basée sur l'API Chromium chrome.devtools.network.

+
+ + diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/network/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/network/index.html deleted file mode 100644 index 77b3bfa8a7..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/network/index.html +++ /dev/null @@ -1,76 +0,0 @@ ---- -title: devtools.network -slug: Mozilla/Add-ons/WebExtensions/API/devtools/network -tags: - - API - - Add-ons - - Extensions - - Reference - - WebExtensions - - devtools.network -translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.network -original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.network ---- -
{{AddonSidebar}}
- -

L'API devtools.network permet à une extension devtools d'obtenir des informations sur les demandes de réseau associées à la fenêtre à laquelle les devtools sont attachés (la fenêtre inspectée).

- -

Comme toutes les APIs de devtools, cette API est uniquement disponible pour le code exécuté dans le document défini dans la clé devtools_page du manifest.json, ou dans d'autres documents de devtools créés par l'extension (tel que le document du panneau). Voir Extension des outils de développement pour plus d'informations.

- -

Fonctions

- -
-
devtools.network.getHAR()
-
Obtenez le  journal HAR pour la page chargée dans l'onglet en cours..
-
- -

Evénements

- -
-
devtools.network.onNavigated
-
Attiré lorsque l'utilisateur navigue dans la fenêtre inspectée vers une nouvelle page.
-
devtools.network.onRequestFinished
-
Lancé lorsque la demande réseau est terminée et que ses détails sont disponibles pour l'extension.
-
- -

Compatibilité du navigateur

- -

{{Compat("webextensions.api.devtools.network")}}

- -

{{WebExtExamples("h2")}}

- -

Note :

- -

Cette API est basée sur l'API Chromium chrome.devtools.network.

-
- - diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/network/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/network/index.md new file mode 100644 index 0000000000..77b3bfa8a7 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/network/index.md @@ -0,0 +1,76 @@ +--- +title: devtools.network +slug: Mozilla/Add-ons/WebExtensions/API/devtools/network +tags: + - API + - Add-ons + - Extensions + - Reference + - WebExtensions + - devtools.network +translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.network +original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.network +--- +
{{AddonSidebar}}
+ +

L'API devtools.network permet à une extension devtools d'obtenir des informations sur les demandes de réseau associées à la fenêtre à laquelle les devtools sont attachés (la fenêtre inspectée).

+ +

Comme toutes les APIs de devtools, cette API est uniquement disponible pour le code exécuté dans le document défini dans la clé devtools_page du manifest.json, ou dans d'autres documents de devtools créés par l'extension (tel que le document du panneau). Voir Extension des outils de développement pour plus d'informations.

+ +

Fonctions

+ +
+
devtools.network.getHAR()
+
Obtenez le  journal HAR pour la page chargée dans l'onglet en cours..
+
+ +

Evénements

+ +
+
devtools.network.onNavigated
+
Attiré lorsque l'utilisateur navigue dans la fenêtre inspectée vers une nouvelle page.
+
devtools.network.onRequestFinished
+
Lancé lorsque la demande réseau est terminée et que ses détails sont disponibles pour l'extension.
+
+ +

Compatibilité du navigateur

+ +

{{Compat("webextensions.api.devtools.network")}}

+ +

{{WebExtExamples("h2")}}

+ +

Note :

+ +

Cette API est basée sur l'API Chromium chrome.devtools.network.

+
+ + diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/network/onnavigated/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/network/onnavigated/index.html deleted file mode 100644 index bc75f0ecdd..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/network/onnavigated/index.html +++ /dev/null @@ -1,102 +0,0 @@ ---- -title: devtools.network.onNavigated -slug: Mozilla/Add-ons/WebExtensions/API/devtools/network/onNavigated -tags: - - API - - Add-ons - - Extensions - - Reference - - WebExtensions - - devtools.network -translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.network/onNavigated -original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.network/onNavigated ---- -
{{AddonSidebar()}}
- -

Mise en place lorsque l'utilisateur navigue dans la fenêtre inspectée vers une nouvelle page

- -

Syntaxe

- -
browser.devtools.network.onNavigated.addListener(listener)
-browser.devtools.network.onNavigated.removeListener(listener)
-browser.devtools.network.onNavigated.hasListener(listener)
-
- -

Les événements ont trois fonctions :

- -
-
addListener(listener)
-
Ajouter un auditeur à cet événement.
-
removeListener(listener)
-
Arrêter d'écouter un événement. L'argument de l'auditeur est l'auditeur à supprimer.
-
hasListener(listener)
-
Vérifiez si l'auditeur est enregistré pour cet événement. Renvoie vrai si elle écoute, sinon faux.
-
- -

Syntaxe addListener

- -

Paramètres

- -
-
callback
-
-

Fonction qui sera appelée lors de l'événement. La fonction passera les arguments suivants :

- -
-
url
-
string. La nouvelle URL pour la fenêtre.
-
-
-
- -

Compatibilité du navigateur

- -

{{Compat("webextensions.api.devtools.network.onNavigated")}}

- -

Exemples

- -
function handleNavigated(url) {
-  console.log(url);
-}
-
-browser.devtools.network.onNavigated.addListener(handleNavigated);
- -

{{WebExtExamples}}

- -

Note :

- -

Cette API est basée sur l'API chrome.devtools de Chromium.

- -

Les données de compatibilité de  Microsoft Edge sont fournies par Microsoft Corporation et sont incluses ici sous la licence Creative Commons Attribution 3.0 United States.

-
- - diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/network/onnavigated/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/network/onnavigated/index.md new file mode 100644 index 0000000000..bc75f0ecdd --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/network/onnavigated/index.md @@ -0,0 +1,102 @@ +--- +title: devtools.network.onNavigated +slug: Mozilla/Add-ons/WebExtensions/API/devtools/network/onNavigated +tags: + - API + - Add-ons + - Extensions + - Reference + - WebExtensions + - devtools.network +translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.network/onNavigated +original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.network/onNavigated +--- +
{{AddonSidebar()}}
+ +

Mise en place lorsque l'utilisateur navigue dans la fenêtre inspectée vers une nouvelle page

+ +

Syntaxe

+ +
browser.devtools.network.onNavigated.addListener(listener)
+browser.devtools.network.onNavigated.removeListener(listener)
+browser.devtools.network.onNavigated.hasListener(listener)
+
+ +

Les événements ont trois fonctions :

+ +
+
addListener(listener)
+
Ajouter un auditeur à cet événement.
+
removeListener(listener)
+
Arrêter d'écouter un événement. L'argument de l'auditeur est l'auditeur à supprimer.
+
hasListener(listener)
+
Vérifiez si l'auditeur est enregistré pour cet événement. Renvoie vrai si elle écoute, sinon faux.
+
+ +

Syntaxe addListener

+ +

Paramètres

+ +
+
callback
+
+

Fonction qui sera appelée lors de l'événement. La fonction passera les arguments suivants :

+ +
+
url
+
string. La nouvelle URL pour la fenêtre.
+
+
+
+ +

Compatibilité du navigateur

+ +

{{Compat("webextensions.api.devtools.network.onNavigated")}}

+ +

Exemples

+ +
function handleNavigated(url) {
+  console.log(url);
+}
+
+browser.devtools.network.onNavigated.addListener(handleNavigated);
+ +

{{WebExtExamples}}

+ +

Note :

+ +

Cette API est basée sur l'API chrome.devtools de Chromium.

+ +

Les données de compatibilité de  Microsoft Edge sont fournies par Microsoft Corporation et sont incluses ici sous la licence Creative Commons Attribution 3.0 United States.

+
+ + diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/network/onrequestfinished/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/network/onrequestfinished/index.html deleted file mode 100644 index 10f287569b..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/network/onrequestfinished/index.html +++ /dev/null @@ -1,111 +0,0 @@ ---- -title: devtools.network.onRequestFinished -slug: Mozilla/Add-ons/WebExtensions/API/devtools/network/onRequestFinished -tags: - - API - - Add-ons - - Event - - Extensions - - Reference - - WebExtensions - - devtools.network - - onRequestFinished -translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.network/onRequestFinished -original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.network/onRequestFinished ---- -
{{AddonSidebar()}}
- -

Lancé lorsqu'une requête réseau est terminée et que ses détails sont disponibles pour l'extension.

- -

La requête est donnée en tant qu'objet d'entrée HAR, qui est également doté d'une méthode getContent() asynchrone qui récupère le contenu du corps de la réponse.

- -

Notez que bien que votre extension puisse ajouter un écouteur à tout moment,elle commencera seulement à se déclencher après que l'utilisateur a activé le moniteur réseau du navigateur au moins une fois.

- -

Syntaxe

- -
browser.devtools.network.onRequestFinished.addListener(listener)
-browser.devtools.network.onRequestFinished.removeListener(listener)
-browser.devtools.network.onRequestFinished.hasListener(listener)
-
- -

Les événements ont trois fonctions

- -
-
addListener(listener)
-
Ajoute un écouteur à cet événement.
-
removeListener(listener)
-
Arrêtez d'écouter cet événement. L'argument de listener  est l'écouteur à supprimer.
-
hasListener(listener)
-
Vérifiez si listener est enregistré pour cet événement. Renvoie trues'il écoute, sinon false.
-
- -

Syntaxe addListener

- -

Paramètres

- -
-
callback
-
-

Fonction qui sera appelée lorsque cet événement se produit. La fonction recevra les arguments suivants :

- -
-
request
-
object. Un objet représentant la requête. Cet objet est un seul objet d'entrée HAR. Il définit également une méthode getContent() asynchrone, qui renvoie une Promise qui se résout avec le corps de la réponse.
-
-
-
- -

Compatibilité du navigateur

- -

{{Compat("webextensions.api.devtools.network.onRequestFinished")}}

- -

Examples

- -

Ajoutez un écouteur qui consigne l'adresse IP du serveur et le corps de la réponse pour chaque requête réseau.

- -
function handleRequestFinished(request) {
-  console.log("Server IP: ", request.serverIPAddress);
-  request.getContent().then(content => {
-    console.log("Content: ", content);
-  });
-}
-
-browser.devtools.network.onRequestFinished.addListener(handleRequestFinished);
- -

{{WebExtExamples}}

- -

Note :

- -

Cette API est basée sur l'API chrome.devtools de Chromium.

-
- - diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/network/onrequestfinished/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/network/onrequestfinished/index.md new file mode 100644 index 0000000000..10f287569b --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/network/onrequestfinished/index.md @@ -0,0 +1,111 @@ +--- +title: devtools.network.onRequestFinished +slug: Mozilla/Add-ons/WebExtensions/API/devtools/network/onRequestFinished +tags: + - API + - Add-ons + - Event + - Extensions + - Reference + - WebExtensions + - devtools.network + - onRequestFinished +translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.network/onRequestFinished +original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.network/onRequestFinished +--- +
{{AddonSidebar()}}
+ +

Lancé lorsqu'une requête réseau est terminée et que ses détails sont disponibles pour l'extension.

+ +

La requête est donnée en tant qu'objet d'entrée HAR, qui est également doté d'une méthode getContent() asynchrone qui récupère le contenu du corps de la réponse.

+ +

Notez que bien que votre extension puisse ajouter un écouteur à tout moment,elle commencera seulement à se déclencher après que l'utilisateur a activé le moniteur réseau du navigateur au moins une fois.

+ +

Syntaxe

+ +
browser.devtools.network.onRequestFinished.addListener(listener)
+browser.devtools.network.onRequestFinished.removeListener(listener)
+browser.devtools.network.onRequestFinished.hasListener(listener)
+
+ +

Les événements ont trois fonctions

+ +
+
addListener(listener)
+
Ajoute un écouteur à cet événement.
+
removeListener(listener)
+
Arrêtez d'écouter cet événement. L'argument de listener  est l'écouteur à supprimer.
+
hasListener(listener)
+
Vérifiez si listener est enregistré pour cet événement. Renvoie trues'il écoute, sinon false.
+
+ +

Syntaxe addListener

+ +

Paramètres

+ +
+
callback
+
+

Fonction qui sera appelée lorsque cet événement se produit. La fonction recevra les arguments suivants :

+ +
+
request
+
object. Un objet représentant la requête. Cet objet est un seul objet d'entrée HAR. Il définit également une méthode getContent() asynchrone, qui renvoie une Promise qui se résout avec le corps de la réponse.
+
+
+
+ +

Compatibilité du navigateur

+ +

{{Compat("webextensions.api.devtools.network.onRequestFinished")}}

+ +

Examples

+ +

Ajoutez un écouteur qui consigne l'adresse IP du serveur et le corps de la réponse pour chaque requête réseau.

+ +
function handleRequestFinished(request) {
+  console.log("Server IP: ", request.serverIPAddress);
+  request.getContent().then(content => {
+    console.log("Content: ", content);
+  });
+}
+
+browser.devtools.network.onRequestFinished.addListener(handleRequestFinished);
+ +

{{WebExtExamples}}

+ +

Note :

+ +

Cette API est basée sur l'API chrome.devtools de Chromium.

+
+ + diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/create/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/create/index.html deleted file mode 100644 index 4ea3a37efb..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/create/index.html +++ /dev/null @@ -1,109 +0,0 @@ ---- -title: devtools.panels.create() -slug: Mozilla/Add-ons/WebExtensions/API/devtools/panels/create -tags: - - API - - Add-ons - - Create - - Extensions - - Reference - - WebExtensions - - devtools.panels -translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/create -original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/create ---- -
{{AddonSidebar()}}
- -

Ajoute un nouveau panneau aux devtools.

- -

Cette fonction prend : un titre, une URL vers un fichier d'icône et une URL vers un fichier HTML. Il crée un nouveau panneau dans les devtools, dont le contenu est spécifié par le fichier HTML. Il renvoie une Promise qui résout un objet ExtensionPanel représentant le nouveau panneau.

- -

Syntaxe

- -
var creating = browser.devtools.panels.create(
-  title,       // string
-  iconPath,    // string
-  pagePath     // string
-)
-
- -

Parametères

- -
-
title
-
string. Le titre du panneau. Cela apparaitra dans la rangée des onglets le long du haut de la fenêtre des devtools, et c'est la principale façon dont l'utilisateur pourra identifier votre panneau.
-
iconPath
-
string. Spécifie une icône qui sera affichée à côté du titre. Il est fourni sous forme d'URL vers un fichier image qui a été fourni avec votre extension. L'URL est résolue par rapport à la page d'extension courante (sauf si elle est exprimée en url absolue, par exemple "/icons/panel.png").
-
pagePath
-
string. Spécifie un fichier HTML qui définit le contenu réel du panneau. Il est fourni sous la forme d'une URL d'un fichier HTML qui a été regroupé avec votre extension. L'URL est résolue par rapport à la page d'extension courante (sauf si elle est exprimée en url absolue, par exemple "/devtools/panel.html"). Le fichier HTML peut include des fichiers CSS et JavaScript, juste comme une page web normale. Le JavaScript en cours d'éxécution dans le panneau pourra utiliser les API devtools. Voir Extention des outils de développement.
-
- -

Valeur retournée

- -

Une Promise qui sera remplie avec un objet ExtensionPanel représentant le nouveau panneau.

- -

Compatibilité du navigateur

- -

{{Compat("webextensions.api.devtools.panels.create")}}

- -

Exemples

- -

Créer un nouveau panneau, et ajoute des auditeurs à ces événements onShown et  onHidden :

- -
function handleShown() {
-  console.log("panel is being shown");
-}
-
-function handleHidden() {
-  console.log("panel is being hidden");
-}
-
-browser.devtools.panels.create(
-  "My Panel",                 // title
-  "/icons/star.png",           // icon
-  "/devtools/panel/panel.html" // content
-).then((newPanel) => {
-  newPanel.onShown.addListener(handleShown);
-  newPanel.onHidden.addListener(handleHidden);
-});
-
- -

{{WebExtExamples}}

- -

Note :

- -

Cette API est basée sur l'API Chromium chrome.devtools.panels.

- -

Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.

-
- - diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/create/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/create/index.md new file mode 100644 index 0000000000..4ea3a37efb --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/create/index.md @@ -0,0 +1,109 @@ +--- +title: devtools.panels.create() +slug: Mozilla/Add-ons/WebExtensions/API/devtools/panels/create +tags: + - API + - Add-ons + - Create + - Extensions + - Reference + - WebExtensions + - devtools.panels +translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/create +original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/create +--- +
{{AddonSidebar()}}
+ +

Ajoute un nouveau panneau aux devtools.

+ +

Cette fonction prend : un titre, une URL vers un fichier d'icône et une URL vers un fichier HTML. Il crée un nouveau panneau dans les devtools, dont le contenu est spécifié par le fichier HTML. Il renvoie une Promise qui résout un objet ExtensionPanel représentant le nouveau panneau.

+ +

Syntaxe

+ +
var creating = browser.devtools.panels.create(
+  title,       // string
+  iconPath,    // string
+  pagePath     // string
+)
+
+ +

Parametères

+ +
+
title
+
string. Le titre du panneau. Cela apparaitra dans la rangée des onglets le long du haut de la fenêtre des devtools, et c'est la principale façon dont l'utilisateur pourra identifier votre panneau.
+
iconPath
+
string. Spécifie une icône qui sera affichée à côté du titre. Il est fourni sous forme d'URL vers un fichier image qui a été fourni avec votre extension. L'URL est résolue par rapport à la page d'extension courante (sauf si elle est exprimée en url absolue, par exemple "/icons/panel.png").
+
pagePath
+
string. Spécifie un fichier HTML qui définit le contenu réel du panneau. Il est fourni sous la forme d'une URL d'un fichier HTML qui a été regroupé avec votre extension. L'URL est résolue par rapport à la page d'extension courante (sauf si elle est exprimée en url absolue, par exemple "/devtools/panel.html"). Le fichier HTML peut include des fichiers CSS et JavaScript, juste comme une page web normale. Le JavaScript en cours d'éxécution dans le panneau pourra utiliser les API devtools. Voir Extention des outils de développement.
+
+ +

Valeur retournée

+ +

Une Promise qui sera remplie avec un objet ExtensionPanel représentant le nouveau panneau.

+ +

Compatibilité du navigateur

+ +

{{Compat("webextensions.api.devtools.panels.create")}}

+ +

Exemples

+ +

Créer un nouveau panneau, et ajoute des auditeurs à ces événements onShown et  onHidden :

+ +
function handleShown() {
+  console.log("panel is being shown");
+}
+
+function handleHidden() {
+  console.log("panel is being hidden");
+}
+
+browser.devtools.panels.create(
+  "My Panel",                 // title
+  "/icons/star.png",           // icon
+  "/devtools/panel/panel.html" // content
+).then((newPanel) => {
+  newPanel.onShown.addListener(handleShown);
+  newPanel.onHidden.addListener(handleHidden);
+});
+
+ +

{{WebExtExamples}}

+ +

Note :

+ +

Cette API est basée sur l'API Chromium chrome.devtools.panels.

+ +

Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.

+
+ + diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elements/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elements/index.html deleted file mode 100644 index 13429a0e32..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elements/index.html +++ /dev/null @@ -1,28 +0,0 @@ ---- -title: devtools.panels.elements -slug: Mozilla/Add-ons/WebExtensions/API/devtools/panels/elements -tags: - - API - - Add-ons - - Elements - - Extensions - - Reference - - WebExtensions - - devtools.panels -translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/elements -original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/elements ---- -
{{AddonSidebar()}}
- -

Un objet ElementsPanel qui représente l'inspecteur HTML/CSS du navigateur

- -

Compatibilité du navigateur

- -

{{Compat("webextensions.api.devtools.panels.elements", 10)}}

- -

{{WebExtExamples}}

- -

Note :

- -

Cette API est basée sur l'API Chromium chrome.devtools.panels.

-
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elements/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elements/index.md new file mode 100644 index 0000000000..13429a0e32 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elements/index.md @@ -0,0 +1,28 @@ +--- +title: devtools.panels.elements +slug: Mozilla/Add-ons/WebExtensions/API/devtools/panels/elements +tags: + - API + - Add-ons + - Elements + - Extensions + - Reference + - WebExtensions + - devtools.panels +translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/elements +original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/elements +--- +
{{AddonSidebar()}}
+ +

Un objet ElementsPanel qui représente l'inspecteur HTML/CSS du navigateur

+ +

Compatibilité du navigateur

+ +

{{Compat("webextensions.api.devtools.panels.elements", 10)}}

+ +

{{WebExtExamples}}

+ +

Note :

+ +

Cette API est basée sur l'API Chromium chrome.devtools.panels.

+
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/createsidebarpane/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/createsidebarpane/index.html deleted file mode 100644 index 5725db54ca..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/createsidebarpane/index.html +++ /dev/null @@ -1,107 +0,0 @@ ---- -title: devtools.panels.ElementsPanel.createSidebarPane() -slug: >- - Mozilla/Add-ons/WebExtensions/API/devtools/panels/ElementsPanel/createSidebarPane -tags: - - API - - Add-ons - - DevTools - - Extensions - - Reference - - WebExtensions - - createSidebarPane - - devtools.panels -translation_of: >- - Mozilla/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel/createSidebarPane -original_slug: >- - Mozilla/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel/createSidebarPane ---- -
{{AddonSidebar()}}
- -

Ajoute un nouveau volet à la barre latérale dans l'inspecteur HTML / CSS.

- -

L'inspecteur HTML / CSS, appelé l'inspecteur de page dans Firefox et le panneau éléments dans Chrome, affiche la page DOM dans la partie principale de sa fenêtre et possède une barre latérale qui affiche divers autres aspects de la page HTML / CSS dans une interface à onglets. Par exemple, dans Firefox, la barre latérale peut afficher les règles CSS pour l'élément sélectionné, ou ses polices, ou son modèle de boîte.

- -

La fonction createSidebarPane() ajoute un nouveau volet à la barre latérale. ar exemple, la capture d'écran ci-dessous montre un nouveau volet intitulé "My pane", qui affiche un objet JSON :

- -

- -

Cette fonction prend un argument, qui est une chaîne représentant le titre du volet. Il renvoie une Promise qui se résout en un objet ExtensionSidebarPane représentant le nouveau volet. Vous pouvez utiliser cet objet pour définir le contenu et le comportement du volet.

- -

Syntaxe

- -
var creating = browser.devtools.panels.elements.createSidebarPane(
-  title       // string
-)
-
- -

Paramètres

- -
-
title
-
string. Cela apparaîtra dans la rangée d'onglets en haut de la barre latérale, et c'est la principale façon pour l'utilisateur d'identifier votre panneau.
-
- -

Valeur retournée

- -

Une Promise qui sera remplie avec un objet ExtensionSidebarPane représentant le nouveau volet.

- -

Compatibilité du navigateur

- -

{{Compat("webextensions.api.devtools.panels.ElementsPanel.createSidebarPane", 10)}}

- -

Exemples

- -

Créez un nouveau volet et remplissez-le avec un objet JSON. Vous pouvez exécuter ce code dans un script chargé par la page devtools.

- -
function onCreated(sidebarPane) {
-  sidebarPane.setObject({
-    someBool: true,
-    someString: "hello there",
-    someObject: {
-      someNumber: 42,
-      someOtherString: "this is my pane's content"
-    }
-  });
-}
-
-browser.devtools.panels.elements.createSidebarPane("My pane").then(onCreated);
-
- -

{{WebExtExamples}}

- -

Note :

- -

Cette API est basée sur l'API Chromium chrome.devtools.panels.

-
- - diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/createsidebarpane/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/createsidebarpane/index.md new file mode 100644 index 0000000000..5725db54ca --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/createsidebarpane/index.md @@ -0,0 +1,107 @@ +--- +title: devtools.panels.ElementsPanel.createSidebarPane() +slug: >- + Mozilla/Add-ons/WebExtensions/API/devtools/panels/ElementsPanel/createSidebarPane +tags: + - API + - Add-ons + - DevTools + - Extensions + - Reference + - WebExtensions + - createSidebarPane + - devtools.panels +translation_of: >- + Mozilla/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel/createSidebarPane +original_slug: >- + Mozilla/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel/createSidebarPane +--- +
{{AddonSidebar()}}
+ +

Ajoute un nouveau volet à la barre latérale dans l'inspecteur HTML / CSS.

+ +

L'inspecteur HTML / CSS, appelé l'inspecteur de page dans Firefox et le panneau éléments dans Chrome, affiche la page DOM dans la partie principale de sa fenêtre et possède une barre latérale qui affiche divers autres aspects de la page HTML / CSS dans une interface à onglets. Par exemple, dans Firefox, la barre latérale peut afficher les règles CSS pour l'élément sélectionné, ou ses polices, ou son modèle de boîte.

+ +

La fonction createSidebarPane() ajoute un nouveau volet à la barre latérale. ar exemple, la capture d'écran ci-dessous montre un nouveau volet intitulé "My pane", qui affiche un objet JSON :

+ +

+ +

Cette fonction prend un argument, qui est une chaîne représentant le titre du volet. Il renvoie une Promise qui se résout en un objet ExtensionSidebarPane représentant le nouveau volet. Vous pouvez utiliser cet objet pour définir le contenu et le comportement du volet.

+ +

Syntaxe

+ +
var creating = browser.devtools.panels.elements.createSidebarPane(
+  title       // string
+)
+
+ +

Paramètres

+ +
+
title
+
string. Cela apparaîtra dans la rangée d'onglets en haut de la barre latérale, et c'est la principale façon pour l'utilisateur d'identifier votre panneau.
+
+ +

Valeur retournée

+ +

Une Promise qui sera remplie avec un objet ExtensionSidebarPane représentant le nouveau volet.

+ +

Compatibilité du navigateur

+ +

{{Compat("webextensions.api.devtools.panels.ElementsPanel.createSidebarPane", 10)}}

+ +

Exemples

+ +

Créez un nouveau volet et remplissez-le avec un objet JSON. Vous pouvez exécuter ce code dans un script chargé par la page devtools.

+ +
function onCreated(sidebarPane) {
+  sidebarPane.setObject({
+    someBool: true,
+    someString: "hello there",
+    someObject: {
+      someNumber: 42,
+      someOtherString: "this is my pane's content"
+    }
+  });
+}
+
+browser.devtools.panels.elements.createSidebarPane("My pane").then(onCreated);
+
+ +

{{WebExtExamples}}

+ +

Note :

+ +

Cette API est basée sur l'API Chromium chrome.devtools.panels.

+
+ + diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/index.html deleted file mode 100644 index cb9b7b24be..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/index.html +++ /dev/null @@ -1,74 +0,0 @@ ---- -title: devtools.panels.ElementsPanel -slug: Mozilla/Add-ons/WebExtensions/API/devtools/panels/ElementsPanel -tags: - - API - - Add-ons - - DevTools - - Extensions - - Reference - - WebExtensions - - devtools.panels - - devtools.panelsElementsPanel -translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel -original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel ---- -
{{AddonSidebar()}}
- -

Un ElementsPanel représente l'inspecteur HTML/CSS dans la devtools du navigateur. C'est ce qu'on appelle l'inspecteur de page dans Firefox et le panneau Éléments de Chrome.

- -

Fonctions

- -
-
devtools.panels.ElementsPanel.createSidebarPane()
-
Crée un volet dans la barre latérale de l'inspecteur.
-
- -

Evénements

- -
-
devtools.panels.ElementsPanel.onSelectionChanged
-
Appèle lorsque l'utilisateur sélectionne un élément différent dans la page, par exemple en utilisant l'élément de menu contextuel "inspect élément".
-
- -

Compatibilité du navigateur

- -

{{Compat("webextensions.api.devtools.panels.ElementsPanel", 10)}}

- -

{{WebExtExamples}}

- -

Note :

- -

Cette API est basée sur l'API Chromium chrome.devtools.panels.

-
- - diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/index.md new file mode 100644 index 0000000000..cb9b7b24be --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/index.md @@ -0,0 +1,74 @@ +--- +title: devtools.panels.ElementsPanel +slug: Mozilla/Add-ons/WebExtensions/API/devtools/panels/ElementsPanel +tags: + - API + - Add-ons + - DevTools + - Extensions + - Reference + - WebExtensions + - devtools.panels + - devtools.panelsElementsPanel +translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel +original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel +--- +
{{AddonSidebar()}}
+ +

Un ElementsPanel représente l'inspecteur HTML/CSS dans la devtools du navigateur. C'est ce qu'on appelle l'inspecteur de page dans Firefox et le panneau Éléments de Chrome.

+ +

Fonctions

+ +
+
devtools.panels.ElementsPanel.createSidebarPane()
+
Crée un volet dans la barre latérale de l'inspecteur.
+
+ +

Evénements

+ +
+
devtools.panels.ElementsPanel.onSelectionChanged
+
Appèle lorsque l'utilisateur sélectionne un élément différent dans la page, par exemple en utilisant l'élément de menu contextuel "inspect élément".
+
+ +

Compatibilité du navigateur

+ +

{{Compat("webextensions.api.devtools.panels.ElementsPanel", 10)}}

+ +

{{WebExtExamples}}

+ +

Note :

+ +

Cette API est basée sur l'API Chromium chrome.devtools.panels.

+
+ + diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/onselectionchanged/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/onselectionchanged/index.html deleted file mode 100644 index d04a11bf65..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/onselectionchanged/index.html +++ /dev/null @@ -1,74 +0,0 @@ ---- -title: onSelectionChanged -slug: >- - Mozilla/Add-ons/WebExtensions/API/devtools/panels/ElementsPanel/onSelectionChanged -tags: - - API - - Add-ons - - DevTools - - Extensions - - Reference - - WebExtensions - - devtools.panels - - devtools.panelsElementsPanel -translation_of: >- - Mozilla/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel/onSelectionChanged -original_slug: >- - Mozilla/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel/onSelectionChanged ---- -
{{AddonSidebar()}}
- -

Appelles lorsque l'utilisateur sélectionne un élément de page différent pour l'inspection avec les outils de développement du navigateur, par exemple en sélectionnant l'élément de menu contextuel "Inspect Element" dans Firefox.

- -

Syntaxe

- -
browser.devtools.panels.elements.onSelectionChanged.addListener(listener)
-browser.devtools.panels.elements.onSelectionChanged.removeListener(listener)
-browser.devtools.panels.elements.onSelectionChanged.hasListener(listener)
-
- -

L'événement a trois fonctions :

- -
-
addListener(listener)
-
Ajoute une écoute à cet événement.
-
removeListener(listener)
-
Arrête une écoute à l'événement. L'argument de l'auditeur est un auditeur supprimer.
-
hasListener(listener)
-
Vérifiez si l'auditeur est enregistré pour cet événement. Renvoie la valeur Vrai si elle l'écoute, sinon Faux.
-
- -

Syntaxe addListener

- -

Paramètres

- -
-
callback
-
-

Fonction qui sera appelée lors de l'événement. La fonction ne passera pas d'arguments.

-
-
- -

Compatibilité du navigateur

- -

{{Compat("webextensions.api.devtools.panels.ElementsPanel.onSelectionChanged", 10)}}

- -

Exemples

- -

Ecoutez la sélection des événements modifiés, et enregistrez le contenu du texte de l'élément nouvellement sélectionné :

- -
function handleSelectedElement() {
-  browser.devtools.inspectedWindow.eval("$0.textContent")
-    .then((result) => {
-      console.log(result[0]);
-    });
-}
-
-browser.devtools.panels.elements.onSelectionChanged.addListener(handleSelectedElement);
- -

{{WebExtExamples}}

- -

Note :

- -

Cette API est basée sur l'API Chromium chrome.devtools.

-
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/onselectionchanged/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/onselectionchanged/index.md new file mode 100644 index 0000000000..d04a11bf65 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/elementspanel/onselectionchanged/index.md @@ -0,0 +1,74 @@ +--- +title: onSelectionChanged +slug: >- + Mozilla/Add-ons/WebExtensions/API/devtools/panels/ElementsPanel/onSelectionChanged +tags: + - API + - Add-ons + - DevTools + - Extensions + - Reference + - WebExtensions + - devtools.panels + - devtools.panelsElementsPanel +translation_of: >- + Mozilla/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel/onSelectionChanged +original_slug: >- + Mozilla/Add-ons/WebExtensions/API/devtools.panels/ElementsPanel/onSelectionChanged +--- +
{{AddonSidebar()}}
+ +

Appelles lorsque l'utilisateur sélectionne un élément de page différent pour l'inspection avec les outils de développement du navigateur, par exemple en sélectionnant l'élément de menu contextuel "Inspect Element" dans Firefox.

+ +

Syntaxe

+ +
browser.devtools.panels.elements.onSelectionChanged.addListener(listener)
+browser.devtools.panels.elements.onSelectionChanged.removeListener(listener)
+browser.devtools.panels.elements.onSelectionChanged.hasListener(listener)
+
+ +

L'événement a trois fonctions :

+ +
+
addListener(listener)
+
Ajoute une écoute à cet événement.
+
removeListener(listener)
+
Arrête une écoute à l'événement. L'argument de l'auditeur est un auditeur supprimer.
+
hasListener(listener)
+
Vérifiez si l'auditeur est enregistré pour cet événement. Renvoie la valeur Vrai si elle l'écoute, sinon Faux.
+
+ +

Syntaxe addListener

+ +

Paramètres

+ +
+
callback
+
+

Fonction qui sera appelée lors de l'événement. La fonction ne passera pas d'arguments.

+
+
+ +

Compatibilité du navigateur

+ +

{{Compat("webextensions.api.devtools.panels.ElementsPanel.onSelectionChanged", 10)}}

+ +

Exemples

+ +

Ecoutez la sélection des événements modifiés, et enregistrez le contenu du texte de l'élément nouvellement sélectionné :

+ +
function handleSelectedElement() {
+  browser.devtools.inspectedWindow.eval("$0.textContent")
+    .then((result) => {
+      console.log(result[0]);
+    });
+}
+
+browser.devtools.panels.elements.onSelectionChanged.addListener(handleSelectedElement);
+ +

{{WebExtExamples}}

+ +

Note :

+ +

Cette API est basée sur l'API Chromium chrome.devtools.

+
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionpanel/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionpanel/index.html deleted file mode 100644 index 8dc65df859..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionpanel/index.html +++ /dev/null @@ -1,92 +0,0 @@ ---- -title: devtools.panels.ExtensionPanel -slug: Mozilla/Add-ons/WebExtensions/API/devtools/panels/ExtensionPanel -tags: - - API - - Add-ons - - Extensions - - Reference - - WebExtensions - - devtools.panels -translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionPanel -original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionPanel ---- -
{{AddonSidebar()}}
- -

Une ExtensionPanel représente un panneau ajouté aux devtools. C'est la résolution de la Promise renvoyé par browser.devtools.panels.create().

- -

Type

- -

Les valeurs de ce type sont des objets. Définissez deux événements, onShown et onHidden.

- - - -

Compatibilité du navigateur

- -

{{Compat("webextensions.api.devtools.panels.ExtensionPanel")}}

- -

Exemples

- -

Ce code crée un nouveau panneau, puis ajoute des gestionnaires pour ces événements onShown et onHidden.

- -
function handleShown(e) {
-  console.log(e);
-  console.log("panel is being shown");
-}
-
-function handleHidden(e) {
-  console.log(e);
-  console.log("panel is being hidden");
-}
-
-browser.devtools.panels.create(
-  "My Panel",                 // title
-  "icons/star.png",           // icon
-  "devtools/panel/panel.html" // content
-).then((newPanel) => {
-  newPanel.onShown.addListener(handleShown);
-  newPanel.onHidden.addListener(handleHidden);
-});
- -

{{WebExtExamples}}

- -

Note :

- -

Cette API est basée sur l'API Chromium chrome.devtools.panels.

- -

Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.

-
- - diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionpanel/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionpanel/index.md new file mode 100644 index 0000000000..8dc65df859 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionpanel/index.md @@ -0,0 +1,92 @@ +--- +title: devtools.panels.ExtensionPanel +slug: Mozilla/Add-ons/WebExtensions/API/devtools/panels/ExtensionPanel +tags: + - API + - Add-ons + - Extensions + - Reference + - WebExtensions + - devtools.panels +translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionPanel +original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionPanel +--- +
{{AddonSidebar()}}
+ +

Une ExtensionPanel représente un panneau ajouté aux devtools. C'est la résolution de la Promise renvoyé par browser.devtools.panels.create().

+ +

Type

+ +

Les valeurs de ce type sont des objets. Définissez deux événements, onShown et onHidden.

+ + + +

Compatibilité du navigateur

+ +

{{Compat("webextensions.api.devtools.panels.ExtensionPanel")}}

+ +

Exemples

+ +

Ce code crée un nouveau panneau, puis ajoute des gestionnaires pour ces événements onShown et onHidden.

+ +
function handleShown(e) {
+  console.log(e);
+  console.log("panel is being shown");
+}
+
+function handleHidden(e) {
+  console.log(e);
+  console.log("panel is being hidden");
+}
+
+browser.devtools.panels.create(
+  "My Panel",                 // title
+  "icons/star.png",           // icon
+  "devtools/panel/panel.html" // content
+).then((newPanel) => {
+  newPanel.onShown.addListener(handleShown);
+  newPanel.onHidden.addListener(handleHidden);
+});
+ +

{{WebExtExamples}}

+ +

Note :

+ +

Cette API est basée sur l'API Chromium chrome.devtools.panels.

+ +

Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.

+
+ + diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/index.html deleted file mode 100644 index d56f4b58fc..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/index.html +++ /dev/null @@ -1,90 +0,0 @@ ---- -title: devtools.panels.ExtensionSidebarPane -slug: Mozilla/Add-ons/WebExtensions/API/devtools/panels/ExtensionSidebarPane -tags: - - API - - Add-ons - - DevTools - - Extensions - - Reference - - WebExtensions - - devtools.panels - - devtools.panels.ExtensionSidebarPane -translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane -original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane ---- -
{{AddonSidebar}}
- -

L'objet ExtensionSidebarPane représente un volet qu'une extension a ajouté à la barre latérale dans l'inspecteur HTML/CSS du navigateur.

- -

- -

Pour créer un ExtensionSidebarPane, appelez la fonction browser.devtools.panels.elements.createSidebarane().

- -

Fonctions

- -
-
devtools.panels.ExtensionSidebarPane.setExpression()
-
-

Évaluer une expression JavaScript dans la page Web inspectée par l'inspecteur. Le résultat est affiché dans le volet de la barre latérale.

-
-
devtools.panels.ExtensionSidebarPane.setObject()
-
-

Définit un objet JSON qui sera affiché dans le volet de la barre latérale.

-
-
devtools.panels.ExtensionSidebarPane.setPage()
-
-

Charge la page pointée par l'URL fournie.

-
-
- -

Evénements

- -
-
devtools.panels.ExtensionSidebarPane.onShown
-
Lancé lorsque le volet latéral est affiché.
-
devtools.panels.ExtensionSidebarPane.onHidden
-
Lancé lorsque le volet de la barre latérale est masqué.
-
- -

Compatibilité du navigateur

- -

{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane", 10)}}

- -

{{WebExtExamples("h2")}}

- -

Note :

- -

Cette API est basée sur l'API Chromium chrome.devtools.panels.

-
- - diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/index.md new file mode 100644 index 0000000000..d56f4b58fc --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/index.md @@ -0,0 +1,90 @@ +--- +title: devtools.panels.ExtensionSidebarPane +slug: Mozilla/Add-ons/WebExtensions/API/devtools/panels/ExtensionSidebarPane +tags: + - API + - Add-ons + - DevTools + - Extensions + - Reference + - WebExtensions + - devtools.panels + - devtools.panels.ExtensionSidebarPane +translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane +original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane +--- +
{{AddonSidebar}}
+ +

L'objet ExtensionSidebarPane représente un volet qu'une extension a ajouté à la barre latérale dans l'inspecteur HTML/CSS du navigateur.

+ +

+ +

Pour créer un ExtensionSidebarPane, appelez la fonction browser.devtools.panels.elements.createSidebarane().

+ +

Fonctions

+ +
+
devtools.panels.ExtensionSidebarPane.setExpression()
+
+

Évaluer une expression JavaScript dans la page Web inspectée par l'inspecteur. Le résultat est affiché dans le volet de la barre latérale.

+
+
devtools.panels.ExtensionSidebarPane.setObject()
+
+

Définit un objet JSON qui sera affiché dans le volet de la barre latérale.

+
+
devtools.panels.ExtensionSidebarPane.setPage()
+
+

Charge la page pointée par l'URL fournie.

+
+
+ +

Evénements

+ +
+
devtools.panels.ExtensionSidebarPane.onShown
+
Lancé lorsque le volet latéral est affiché.
+
devtools.panels.ExtensionSidebarPane.onHidden
+
Lancé lorsque le volet de la barre latérale est masqué.
+
+ +

Compatibilité du navigateur

+ +

{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane", 10)}}

+ +

{{WebExtExamples("h2")}}

+ +

Note :

+ +

Cette API est basée sur l'API Chromium chrome.devtools.panels.

+
+ + diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onhidden/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onhidden/index.html deleted file mode 100644 index ac7d1e0aaa..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onhidden/index.html +++ /dev/null @@ -1,80 +0,0 @@ ---- -title: devtools.panels.ExtensionSidebarPane.onHidden -slug: >- - Mozilla/Add-ons/WebExtensions/API/devtools/panels/ExtensionSidebarPane/onHidden -tags: - - API - - Add-ons - - ExtensionSidebarPane - - Extensions - - Reference - - WebExtensions - - devtools.panels - - onHidden -translation_of: >- - Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/onHidden -original_slug: >- - Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/onHidden ---- -
{{AddonSidebar()}}
- -

Appelé lorsque le volet de la barre latérale est masqué, suite à l'abandon de l'utilisateur.

- -

Syntaxe

- -
browser.devtools.panels.onHidden.addListener(listener)
-browser.devtools.panels.onHidden.removeListener(listener)
-browser.devtools.panels.onHidden.hasListener(listener)
-
- -

Les événements ont trois fonctions:

- -
-
addListener(callback)
-
Ajoute un écouteur à cet événement.
-
removeListener(listener)
-
Arrête d'écouter cet événement. L'argument listener est l'écouteur à supprimer.
-
hasListener(listener)
-
Vérifie si listener est enregistré pour cet événement. Renvoie true s'il écoute,  sinon false.
-
- -

Syntaxe addListener

- -

Paramètres

- -
-
callback
-
-

Fonction appelée lorsque cet événement se produit. Cette fonction sera passée sans arguments.

-
-
- -

Compatibilité du navigateur

- -

{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane.onHidden", 10)}}

- -

Exemples

- -

Créez un volet de barre latérale et journal afficher et masquer les événements.

- -
function onCreated(sidebarPane) {
-
-  sidebarPane.onShown.addListener(() => {
-    console.log("Shown");
-  });
-
-  sidebarPane.onHidden.addListener(() => {
-    console.log("Hidden");
-  });
-
-}
-
-browser.devtools.panels.elements.createSidebarPane("My pane").then(onCreated);
-
- -

{{WebExtExamples}}

- -

Note :

- -

Cette API est basée sur l'API Chromium chrome.devtools.panels.

-
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onhidden/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onhidden/index.md new file mode 100644 index 0000000000..ac7d1e0aaa --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onhidden/index.md @@ -0,0 +1,80 @@ +--- +title: devtools.panels.ExtensionSidebarPane.onHidden +slug: >- + Mozilla/Add-ons/WebExtensions/API/devtools/panels/ExtensionSidebarPane/onHidden +tags: + - API + - Add-ons + - ExtensionSidebarPane + - Extensions + - Reference + - WebExtensions + - devtools.panels + - onHidden +translation_of: >- + Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/onHidden +original_slug: >- + Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/onHidden +--- +
{{AddonSidebar()}}
+ +

Appelé lorsque le volet de la barre latérale est masqué, suite à l'abandon de l'utilisateur.

+ +

Syntaxe

+ +
browser.devtools.panels.onHidden.addListener(listener)
+browser.devtools.panels.onHidden.removeListener(listener)
+browser.devtools.panels.onHidden.hasListener(listener)
+
+ +

Les événements ont trois fonctions:

+ +
+
addListener(callback)
+
Ajoute un écouteur à cet événement.
+
removeListener(listener)
+
Arrête d'écouter cet événement. L'argument listener est l'écouteur à supprimer.
+
hasListener(listener)
+
Vérifie si listener est enregistré pour cet événement. Renvoie true s'il écoute,  sinon false.
+
+ +

Syntaxe addListener

+ +

Paramètres

+ +
+
callback
+
+

Fonction appelée lorsque cet événement se produit. Cette fonction sera passée sans arguments.

+
+
+ +

Compatibilité du navigateur

+ +

{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane.onHidden", 10)}}

+ +

Exemples

+ +

Créez un volet de barre latérale et journal afficher et masquer les événements.

+ +
function onCreated(sidebarPane) {
+
+  sidebarPane.onShown.addListener(() => {
+    console.log("Shown");
+  });
+
+  sidebarPane.onHidden.addListener(() => {
+    console.log("Hidden");
+  });
+
+}
+
+browser.devtools.panels.elements.createSidebarPane("My pane").then(onCreated);
+
+ +

{{WebExtExamples}}

+ +

Note :

+ +

Cette API est basée sur l'API Chromium chrome.devtools.panels.

+
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onshown/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onshown/index.html deleted file mode 100644 index e1338a1d19..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onshown/index.html +++ /dev/null @@ -1,77 +0,0 @@ ---- -title: devtools.panels.ExtensionSidebarPane.onShown -slug: Mozilla/Add-ons/WebExtensions/API/devtools/panels/ExtensionSidebarPane/onShown -tags: - - API - - Add-ons - - Extensions - - ExtesionsSidebarPane - - Reference - - WebExtensions - - devtools.panels - - onShown -translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/onShown -original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/onShown ---- -
{{AddonSidebar()}}
- -

Lancé lorsque le volet latéral devient visible suite à un changement d'utilisateur.

- -

Syntaxe

- -
browser.devtools.panels.onShown.addListener(listener)
-browser.devtools.panels.onShown.removeListener(listener)
-browser.devtools.panels.onShown.hasListener(listener)
-
- -

Les événements ont trois fonctions :

- -
-
addListener(callback)
-
Ajoute un écouteur à cet événement.
-
removeListener(listener)
-
Arrêtez d'écouter cet événement. L'argument de listener est l'écouteur à supprimer.
-
hasListener(listener)
-
Vérifiez si listener est enregistré pour cet événement. Renvoie true s'il écoute, sinon false.
-
- -

Syntaxe addListener

- -

Paramètres

- -
-
callback
-
-

Fonction qui sera appelée lorsque cet événement se produit. La fonction sera passée sans arguments.

-
-
- -

Compatibilité du navigateur

- -

{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane.onShown", 10)}}

- -

Exemples

- -

Créez un volet de barre latérale et journal afficher et masquer les événements.

- -
function onCreated(sidebarPane) {
-
-  sidebarPane.onShown.addListener(() => {
-    console.log("Shown");
-  });
-
-  sidebarPane.onHidden.addListener(() => {
-    console.log("Hidden");
-  });
-
-}
-
-browser.devtools.panels.elements.createSidebarPane("My pane").then(onCreated);
-
- -

{{WebExtExamples}}

- -

Note :

- -

Cette API est basée sur l'API Chromium chrome.devtools.panels.

-
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onshown/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onshown/index.md new file mode 100644 index 0000000000..e1338a1d19 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/onshown/index.md @@ -0,0 +1,77 @@ +--- +title: devtools.panels.ExtensionSidebarPane.onShown +slug: Mozilla/Add-ons/WebExtensions/API/devtools/panels/ExtensionSidebarPane/onShown +tags: + - API + - Add-ons + - Extensions + - ExtesionsSidebarPane + - Reference + - WebExtensions + - devtools.panels + - onShown +translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/onShown +original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/onShown +--- +
{{AddonSidebar()}}
+ +

Lancé lorsque le volet latéral devient visible suite à un changement d'utilisateur.

+ +

Syntaxe

+ +
browser.devtools.panels.onShown.addListener(listener)
+browser.devtools.panels.onShown.removeListener(listener)
+browser.devtools.panels.onShown.hasListener(listener)
+
+ +

Les événements ont trois fonctions :

+ +
+
addListener(callback)
+
Ajoute un écouteur à cet événement.
+
removeListener(listener)
+
Arrêtez d'écouter cet événement. L'argument de listener est l'écouteur à supprimer.
+
hasListener(listener)
+
Vérifiez si listener est enregistré pour cet événement. Renvoie true s'il écoute, sinon false.
+
+ +

Syntaxe addListener

+ +

Paramètres

+ +
+
callback
+
+

Fonction qui sera appelée lorsque cet événement se produit. La fonction sera passée sans arguments.

+
+
+ +

Compatibilité du navigateur

+ +

{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane.onShown", 10)}}

+ +

Exemples

+ +

Créez un volet de barre latérale et journal afficher et masquer les événements.

+ +
function onCreated(sidebarPane) {
+
+  sidebarPane.onShown.addListener(() => {
+    console.log("Shown");
+  });
+
+  sidebarPane.onHidden.addListener(() => {
+    console.log("Hidden");
+  });
+
+}
+
+browser.devtools.panels.elements.createSidebarPane("My pane").then(onCreated);
+
+ +

{{WebExtExamples}}

+ +

Note :

+ +

Cette API est basée sur l'API Chromium chrome.devtools.panels.

+
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setexpression/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setexpression/index.html deleted file mode 100644 index 0098ac9f7a..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setexpression/index.html +++ /dev/null @@ -1,106 +0,0 @@ ---- -title: devtools.panels.ElementsPanel.setExpression() -slug: >- - Mozilla/Add-ons/WebExtensions/API/devtools/panels/ExtensionSidebarPane/setExpression -tags: - - API - - Add-ons - - Extensions - - Reference - - WebExtensions - - devtools.panels - - setExpression -translation_of: >- - Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/setExpression -original_slug: >- - Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/setExpression ---- -
{{AddonSidebar()}}
- -

Evalue une expression dans le contexte de la page inspectée et affiche le résultat dans le volet de la barre latérale d'extension.

- -

Le contexte d'exécution de l'expression est le même que celui de inspectedWindow.eval().

- -

 Les objets JSON et les noeuds DOM sont affichés en tant qu'arborescence extensible, comme dans la visionneuse jSON dans Firefox. Vous pouvez éventuellement spécifier une chaîne rootTitle : elle sera affichée comme le titre de la racine de l'arbre.

- -

C'est une fonction asynchrone qui renvoie une Promise.

- -

Syntaxe

- -
var evaluating = browser.devtools.panels.setExpression(
-  expression,       // string
-  rootTitle         // string
-)
-
- -

Paramètres

- -
-
expression
-
string. L'expression à évaluer.
-
rootTitle {{optional_inline}}
-
string. Le titre de la racine de l'arbre dans lequel les résultats sont affichés.
-
- -

Valeur retournée

- -

Une Promise sera remplie sans arguments, une fois l'expression évaluée.

- -

Compatibilité du navigateur

- -

{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane.setExpression", 10)}}

- -

Exemples

- -

Ce code crée un volet de barre latérale qui affiche le tagName de l'élément actuellement sélectionné :

- -
function onCreated(sidebarPane) {
-
-  browser.devtools.panels.elements.onSelectionChanged.addListener(() => {
-    const exp = "$0 && $0.tagName";
-    const title = "Selected Element tagName";
-    sidebarPane.setExpression(exp, title);
-  });
-
-}
-
-browser.devtools.panels.elements.createSidebarPane("My pane").then(onCreated);
-
- -

{{WebExtExamples}}

- -

Note :

- -

Cette API est basée sur l'API Chromium chrome.devtools.panels.

-
- - diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setexpression/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setexpression/index.md new file mode 100644 index 0000000000..0098ac9f7a --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setexpression/index.md @@ -0,0 +1,106 @@ +--- +title: devtools.panels.ElementsPanel.setExpression() +slug: >- + Mozilla/Add-ons/WebExtensions/API/devtools/panels/ExtensionSidebarPane/setExpression +tags: + - API + - Add-ons + - Extensions + - Reference + - WebExtensions + - devtools.panels + - setExpression +translation_of: >- + Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/setExpression +original_slug: >- + Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/setExpression +--- +
{{AddonSidebar()}}
+ +

Evalue une expression dans le contexte de la page inspectée et affiche le résultat dans le volet de la barre latérale d'extension.

+ +

Le contexte d'exécution de l'expression est le même que celui de inspectedWindow.eval().

+ +

 Les objets JSON et les noeuds DOM sont affichés en tant qu'arborescence extensible, comme dans la visionneuse jSON dans Firefox. Vous pouvez éventuellement spécifier une chaîne rootTitle : elle sera affichée comme le titre de la racine de l'arbre.

+ +

C'est une fonction asynchrone qui renvoie une Promise.

+ +

Syntaxe

+ +
var evaluating = browser.devtools.panels.setExpression(
+  expression,       // string
+  rootTitle         // string
+)
+
+ +

Paramètres

+ +
+
expression
+
string. L'expression à évaluer.
+
rootTitle {{optional_inline}}
+
string. Le titre de la racine de l'arbre dans lequel les résultats sont affichés.
+
+ +

Valeur retournée

+ +

Une Promise sera remplie sans arguments, une fois l'expression évaluée.

+ +

Compatibilité du navigateur

+ +

{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane.setExpression", 10)}}

+ +

Exemples

+ +

Ce code crée un volet de barre latérale qui affiche le tagName de l'élément actuellement sélectionné :

+ +
function onCreated(sidebarPane) {
+
+  browser.devtools.panels.elements.onSelectionChanged.addListener(() => {
+    const exp = "$0 && $0.tagName";
+    const title = "Selected Element tagName";
+    sidebarPane.setExpression(exp, title);
+  });
+
+}
+
+browser.devtools.panels.elements.createSidebarPane("My pane").then(onCreated);
+
+ +

{{WebExtExamples}}

+ +

Note :

+ +

Cette API est basée sur l'API Chromium chrome.devtools.panels.

+
+ + diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setobject/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setobject/index.html deleted file mode 100644 index dda73e1faa..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setobject/index.html +++ /dev/null @@ -1,104 +0,0 @@ ---- -title: devtools.panels.ExtensionSidebarPane.setObject() -slug: >- - Mozilla/Add-ons/WebExtensions/API/devtools/panels/ExtensionSidebarPane/setObject -tags: - - API - - Add-ons - - Extensions - - Reference - - WebExtensions - - devtools.panels - - setObject -translation_of: >- - Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/setObject -original_slug: >- - Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/setObject ---- -
{{AddonSidebar()}}
- -

Affiche un objet JSON dans le volet de la barre latérale de l'extension.

- -

L'objet est affiché en tant qu'arborescence extensible, comme dans le JSON viewer dans Firefox. Vous pouvez éventuellement spécifier une chaîne rootTitle : elle sera affichée comme le titre de la racine de l'arbre.

- -

C'est une fonction asynchrone qui renvoie une Promise.

- -

Syntaxe

- -
var setting = browser.devtools.panels.setObject(
-  jsonObject,       // string, array, or JSON object
-  rootTitle         // string
-)
-
- -

Paramètres

- -
-
jsonObject
-
String ou Array ou Object. L'objet à afficher. S'il s'agit d'un objet JSON-serialized, donc les propriétés comme les fonctions seront omises.
-
rootTitle {{optional_inline}}
-
String. Le titre de la racine de l'arbre dans lequel l'objet est affiché.
-
- -

Valeur retournée

- -

Une Promise qui sera accomplie sans arguments, une fois l'objet défini.

- -

Compatibilité du navigateur

- -

{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane.setObject", 10)}}

- -

Exemples

- -

Créez un nouveau volet et remplissez-le avec un objet JSON. Vous pouvez exécuter ce code dans un script chargé par la page devtools. de votre extension

- -
function onCreated(sidebarPane) {
-  sidebarPane.setObject({
-    someBool: true,
-    someString: "hello there",
-    someObject: {
-      someNumber: 42,
-      someOtherString: "this is my pane's content"
-    }
-  });
-}
-
-browser.devtools.panels.elements.createSidebarPane("My pane").then(onCreated);
- -

{{WebExtExamples}}

- -

Note :

- -

Cette API est basée sur l'API Chromium chrome.devtools.panels.

-
- - diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setobject/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setobject/index.md new file mode 100644 index 0000000000..dda73e1faa --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setobject/index.md @@ -0,0 +1,104 @@ +--- +title: devtools.panels.ExtensionSidebarPane.setObject() +slug: >- + Mozilla/Add-ons/WebExtensions/API/devtools/panels/ExtensionSidebarPane/setObject +tags: + - API + - Add-ons + - Extensions + - Reference + - WebExtensions + - devtools.panels + - setObject +translation_of: >- + Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/setObject +original_slug: >- + Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/setObject +--- +
{{AddonSidebar()}}
+ +

Affiche un objet JSON dans le volet de la barre latérale de l'extension.

+ +

L'objet est affiché en tant qu'arborescence extensible, comme dans le JSON viewer dans Firefox. Vous pouvez éventuellement spécifier une chaîne rootTitle : elle sera affichée comme le titre de la racine de l'arbre.

+ +

C'est une fonction asynchrone qui renvoie une Promise.

+ +

Syntaxe

+ +
var setting = browser.devtools.panels.setObject(
+  jsonObject,       // string, array, or JSON object
+  rootTitle         // string
+)
+
+ +

Paramètres

+ +
+
jsonObject
+
String ou Array ou Object. L'objet à afficher. S'il s'agit d'un objet JSON-serialized, donc les propriétés comme les fonctions seront omises.
+
rootTitle {{optional_inline}}
+
String. Le titre de la racine de l'arbre dans lequel l'objet est affiché.
+
+ +

Valeur retournée

+ +

Une Promise qui sera accomplie sans arguments, une fois l'objet défini.

+ +

Compatibilité du navigateur

+ +

{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane.setObject", 10)}}

+ +

Exemples

+ +

Créez un nouveau volet et remplissez-le avec un objet JSON. Vous pouvez exécuter ce code dans un script chargé par la page devtools. de votre extension

+ +
function onCreated(sidebarPane) {
+  sidebarPane.setObject({
+    someBool: true,
+    someString: "hello there",
+    someObject: {
+      someNumber: 42,
+      someOtherString: "this is my pane's content"
+    }
+  });
+}
+
+browser.devtools.panels.elements.createSidebarPane("My pane").then(onCreated);
+ +

{{WebExtExamples}}

+ +

Note :

+ +

Cette API est basée sur l'API Chromium chrome.devtools.panels.

+
+ + diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setpage/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setpage/index.html deleted file mode 100644 index 7d3651cbeb..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setpage/index.html +++ /dev/null @@ -1,86 +0,0 @@ ---- -title: devtools.panels.ExtensionSidebarPane.setPage() -slug: Mozilla/Add-ons/WebExtensions/API/devtools/panels/ExtensionSidebarPane/setPage -tags: - - API - - Add-ons - - Extensions - - Reference - - WebExtensions - - setPage -translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/setPage -original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/setPage ---- -

Définit une page HTML à afficher dans le volet latéral.

- -

C'est une fonction asynchrone qui renvoie une Promise.

- -

Syntaxe

- -
browser.devtools.panels.setPage(
-  path // string containing relative path to page
-)
-
- -

Paramètres

- -
-
extensionPageURL
-
string. Le chemin relatif d'une page HTML à afficher dans la barre latérale.
-
- -

Valeur retournée

- -

Une Promise qui sera tenue sans arguments, une fois l'URL définie.

- -

La page sélectionnée ne sera pas chargée tant que l'utilisateur n'aura pas sélectionné la barre latérale devtools.

- -

Exemples

- -

Créez un nouveau volet et remplissez-le d'une page HTML. Vous pouvez exécuter ce code dans un script chargé par la page devtools de votre extension.

- -
function onCreated(sidebarPane) {
-  sidebarPane.setPage('sidebar/sidebar.html');
-}
-
- -

{{WebExtExamples}}

- -

Compatibilité du navigateur

- -

{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane.setPage", 10)}}

- -

Note :

- -

Cette API est basée sur l'API Chromium chrome.devtools.panels.

-
- - diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setpage/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setpage/index.md new file mode 100644 index 0000000000..7d3651cbeb --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/extensionsidebarpane/setpage/index.md @@ -0,0 +1,86 @@ +--- +title: devtools.panels.ExtensionSidebarPane.setPage() +slug: Mozilla/Add-ons/WebExtensions/API/devtools/panels/ExtensionSidebarPane/setPage +tags: + - API + - Add-ons + - Extensions + - Reference + - WebExtensions + - setPage +translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/setPage +original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/ExtensionSidebarPane/setPage +--- +

Définit une page HTML à afficher dans le volet latéral.

+ +

C'est une fonction asynchrone qui renvoie une Promise.

+ +

Syntaxe

+ +
browser.devtools.panels.setPage(
+  path // string containing relative path to page
+)
+
+ +

Paramètres

+ +
+
extensionPageURL
+
string. Le chemin relatif d'une page HTML à afficher dans la barre latérale.
+
+ +

Valeur retournée

+ +

Une Promise qui sera tenue sans arguments, une fois l'URL définie.

+ +

La page sélectionnée ne sera pas chargée tant que l'utilisateur n'aura pas sélectionné la barre latérale devtools.

+ +

Exemples

+ +

Créez un nouveau volet et remplissez-le d'une page HTML. Vous pouvez exécuter ce code dans un script chargé par la page devtools de votre extension.

+ +
function onCreated(sidebarPane) {
+  sidebarPane.setPage('sidebar/sidebar.html');
+}
+
+ +

{{WebExtExamples}}

+ +

Compatibilité du navigateur

+ +

{{Compat("webextensions.api.devtools.panels.ExtensionSidebarPane.setPage", 10)}}

+ +

Note :

+ +

Cette API est basée sur l'API Chromium chrome.devtools.panels.

+
+ + diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/index.html deleted file mode 100644 index b144733c9b..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/index.html +++ /dev/null @@ -1,104 +0,0 @@ ---- -title: devtools.panels -slug: Mozilla/Add-ons/WebExtensions/API/devtools/panels -tags: - - API - - Add-ons - - Extensions - - Reference - - WebExtensions - - devtools.panels -translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels -original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels ---- -
{{AddonSidebar}}
- -
-

Note : Bien que les API soient basées sur les APIs de devtools de Chrome, il existe encore de nombreuses fonctionnalités qui ne sont pas encore implémentées dans Firefox et ne sont donc pas documentées ici. Pour voir les fonctionnalités actuellement manquantes, regarder  Limitations des APIs devtools.

-
- -

L'API devtools.panels permet à une extension devtools de définir son interface utilisateur à l'intérieur de la fenêtre devtools.

- -

La fenêtre devtools héberge un certain nombre d'outils distincts - le débogueur JavaScript, le moniteur réseau, etc. Une rangée d'onglets sur le haut permet à l'utilisateur de basculer entre les différents outils. La fenêtre hébergeant l'interface utilisateur de chaque outil s'appelle un "panneau".

- -

Avec l'API devtools.panels, vous pouvez créer de nouveaux panneaux dans la fenêtre des devtools.

- -

Comme toutes les API de devtools, cette API est uniquement disponible pour le code exécuté dans le document défini dans la clé devtools_page du manifest.json, ou dans d'autres documents de déploiement créés par une extension (tel que le document du panneau). Voir Extension des outils de développement pour plus for d'informations.

- -

Types

- -
-
devtools.panels.ElementsPanel
-
Représente l'inspecteur HTML/CSS dans le devtools du navigateur
-
devtools.panels.ExtensionPanel
-
Représente un panneau de déploiement créé par l'extension.
-
devtools.panels.ExtensionSidebarPane
-
Représente un volet ajouté par une extension à l'inspecteur HTML/CC dans les devtools du navigateur.
-
- -

Propriétés

- -
-
devtools.panels.elements
-
Une référence à un objet ElementsPanel.
-
devtools.panels.themeName
-
Le nom du thème actuel des devtools.
-
- -

Fonctions

- -
-
devtools.panels.create()
-
Créé un nouveau panneau de développement
-
- -

Evénements

- -
-
devtools.panels.onThemeChanged
-
Mise en place lorsque le thème Devtools change.
-
- -

Compatibilité du navigateur

- -

{{Compat("webextensions.api.devtools.panels", 2)}}

- -

{{WebExtExamples("h2")}}

- -

Note :

- -

Cette API est basée sur l'API Chromium chrome.devtools.panels.

- -

Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.

-
- - diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/index.md new file mode 100644 index 0000000000..b144733c9b --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/index.md @@ -0,0 +1,104 @@ +--- +title: devtools.panels +slug: Mozilla/Add-ons/WebExtensions/API/devtools/panels +tags: + - API + - Add-ons + - Extensions + - Reference + - WebExtensions + - devtools.panels +translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels +original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels +--- +
{{AddonSidebar}}
+ +
+

Note : Bien que les API soient basées sur les APIs de devtools de Chrome, il existe encore de nombreuses fonctionnalités qui ne sont pas encore implémentées dans Firefox et ne sont donc pas documentées ici. Pour voir les fonctionnalités actuellement manquantes, regarder  Limitations des APIs devtools.

+
+ +

L'API devtools.panels permet à une extension devtools de définir son interface utilisateur à l'intérieur de la fenêtre devtools.

+ +

La fenêtre devtools héberge un certain nombre d'outils distincts - le débogueur JavaScript, le moniteur réseau, etc. Une rangée d'onglets sur le haut permet à l'utilisateur de basculer entre les différents outils. La fenêtre hébergeant l'interface utilisateur de chaque outil s'appelle un "panneau".

+ +

Avec l'API devtools.panels, vous pouvez créer de nouveaux panneaux dans la fenêtre des devtools.

+ +

Comme toutes les API de devtools, cette API est uniquement disponible pour le code exécuté dans le document défini dans la clé devtools_page du manifest.json, ou dans d'autres documents de déploiement créés par une extension (tel que le document du panneau). Voir Extension des outils de développement pour plus for d'informations.

+ +

Types

+ +
+
devtools.panels.ElementsPanel
+
Représente l'inspecteur HTML/CSS dans le devtools du navigateur
+
devtools.panels.ExtensionPanel
+
Représente un panneau de déploiement créé par l'extension.
+
devtools.panels.ExtensionSidebarPane
+
Représente un volet ajouté par une extension à l'inspecteur HTML/CC dans les devtools du navigateur.
+
+ +

Propriétés

+ +
+
devtools.panels.elements
+
Une référence à un objet ElementsPanel.
+
devtools.panels.themeName
+
Le nom du thème actuel des devtools.
+
+ +

Fonctions

+ +
+
devtools.panels.create()
+
Créé un nouveau panneau de développement
+
+ +

Evénements

+ +
+
devtools.panels.onThemeChanged
+
Mise en place lorsque le thème Devtools change.
+
+ +

Compatibilité du navigateur

+ +

{{Compat("webextensions.api.devtools.panels", 2)}}

+ +

{{WebExtExamples("h2")}}

+ +

Note :

+ +

Cette API est basée sur l'API Chromium chrome.devtools.panels.

+ +

Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.

+
+ + diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/onthemechanged/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/onthemechanged/index.html deleted file mode 100644 index 757f74684b..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/onthemechanged/index.html +++ /dev/null @@ -1,71 +0,0 @@ ---- -title: devtools.panels.onThemeChanged -slug: Mozilla/Add-ons/WebExtensions/API/devtools/panels/onThemeChanged -tags: - - API - - Add-ons - - DevTools - - Reference - - WebExtensions - - devtools.panels - - onThemeChanged -translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/onThemeChanged -original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/onThemeChanged ---- -
{{AddonSidebar()}}
- -

Remplacement quand le thème de devtools change

- -

Syntaxe

- -
browser.devtools.panels.onThemeChanged.addListener(listener)
-browser.devtools.panels.onThemeChanged.removeListener(listener)
-browser.devtools.panels.onThemeChanged.hasListener(listener)
-
- -

Les événements ont trois fonctions :

- -
-
addListener(callback)
-
Ajoute un auditeur à cet événement
-
removeListener(listener)
-
Arrêtez d'écouter cet événement. L'argument de l'auditeur est l'auditeur à supprimer.
-
hasListener(listener)
-
Vérifiez si l'auditeur est enregistré pour cet événement. Renvoie Vrai si elle écoute, sinon Faux.
-
- -

Syntaxe addListener

- -

Paramètres

- -
-
callback
-
-

Function qui sera appelée lors de l'événement. La fonction passera les arguments suivants :

- -
-
themeName
-
string. Nom du nouveau thème : ce sera l'une des valeurs autorisées pour  devtools.panels.themeName.
-
-
-
- -

Compatibilité du navigateur

- -

{{Compat("webextensions.api.devtools.panels.onThemeChanged")}}

- -

Exemples

- -
browser.devtools.panels.onThemeChanged.addListener((newThemeName) => {
-  console.log(`New theme: ${newThemeName}`);
-});
-
- -

{{WebExtExamples}}

- -

Note :

- -

Cette API est basée sur l'API Chromium chrome.devtools.panels.

- -

Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.

-
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/onthemechanged/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/onthemechanged/index.md new file mode 100644 index 0000000000..757f74684b --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/onthemechanged/index.md @@ -0,0 +1,71 @@ +--- +title: devtools.panels.onThemeChanged +slug: Mozilla/Add-ons/WebExtensions/API/devtools/panels/onThemeChanged +tags: + - API + - Add-ons + - DevTools + - Reference + - WebExtensions + - devtools.panels + - onThemeChanged +translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/onThemeChanged +original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/onThemeChanged +--- +
{{AddonSidebar()}}
+ +

Remplacement quand le thème de devtools change

+ +

Syntaxe

+ +
browser.devtools.panels.onThemeChanged.addListener(listener)
+browser.devtools.panels.onThemeChanged.removeListener(listener)
+browser.devtools.panels.onThemeChanged.hasListener(listener)
+
+ +

Les événements ont trois fonctions :

+ +
+
addListener(callback)
+
Ajoute un auditeur à cet événement
+
removeListener(listener)
+
Arrêtez d'écouter cet événement. L'argument de l'auditeur est l'auditeur à supprimer.
+
hasListener(listener)
+
Vérifiez si l'auditeur est enregistré pour cet événement. Renvoie Vrai si elle écoute, sinon Faux.
+
+ +

Syntaxe addListener

+ +

Paramètres

+ +
+
callback
+
+

Function qui sera appelée lors de l'événement. La fonction passera les arguments suivants :

+ +
+
themeName
+
string. Nom du nouveau thème : ce sera l'une des valeurs autorisées pour  devtools.panels.themeName.
+
+
+
+ +

Compatibilité du navigateur

+ +

{{Compat("webextensions.api.devtools.panels.onThemeChanged")}}

+ +

Exemples

+ +
browser.devtools.panels.onThemeChanged.addListener((newThemeName) => {
+  console.log(`New theme: ${newThemeName}`);
+});
+
+ +

{{WebExtExamples}}

+ +

Note :

+ +

Cette API est basée sur l'API Chromium chrome.devtools.panels.

+ +

Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.

+
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/themename/index.html b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/themename/index.html deleted file mode 100644 index 12aab2c1b1..0000000000 --- a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/themename/index.html +++ /dev/null @@ -1,38 +0,0 @@ ---- -title: devtools.panels.themeName -slug: Mozilla/Add-ons/WebExtensions/API/devtools/panels/themeName -tags: - - API - - Add-ons - - DevTools - - Reference - - WebExtensions - - devtools.panels - - themeName -translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/themeName -original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/themeName ---- -
{{AddonSidebar()}}
- -

Le nom du thème de devtools actuellement sélectionné.

- -

Il s'agit d'une chaîne dont les valeurs possibles sont :

- - - -

Compatibilité du navigateur

- -

{{Compat("webextensions.api.devtools.panels.themeName")}}

- -

{{WebExtExamples}}

- -

Note :

- -

Cette API est basée sur l'API Chromium chrome.devtools.panels.

- -

Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.

-
diff --git a/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/themename/index.md b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/themename/index.md new file mode 100644 index 0000000000..12aab2c1b1 --- /dev/null +++ b/files/fr/mozilla/add-ons/webextensions/api/devtools/panels/themename/index.md @@ -0,0 +1,38 @@ +--- +title: devtools.panels.themeName +slug: Mozilla/Add-ons/WebExtensions/API/devtools/panels/themeName +tags: + - API + - Add-ons + - DevTools + - Reference + - WebExtensions + - devtools.panels + - themeName +translation_of: Mozilla/Add-ons/WebExtensions/API/devtools.panels/themeName +original_slug: Mozilla/Add-ons/WebExtensions/API/devtools.panels/themeName +--- +
{{AddonSidebar()}}
+ +

Le nom du thème de devtools actuellement sélectionné.

+ +

Il s'agit d'une chaîne dont les valeurs possibles sont :

+ + + +

Compatibilité du navigateur

+ +

{{Compat("webextensions.api.devtools.panels.themeName")}}

+ +

{{WebExtExamples}}

+ +

Note :

+ +

Cette API est basée sur l'API Chromium chrome.devtools.panels.

+ +

Les données de compatibilité relatives à Microsoft Edge sont fournies par Microsoft Corporation et incluses ici sous la licence Creative Commons Attribution 3.0 pour les États-Unis.

+
-- cgit v1.2.3-54-g00ecf