recursal/MDN huggingface dataset:
onSelectionChanged
==================

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
-------


```js
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é des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Exemples
--------

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


```js
function handleSelectedElement() {
  browser.devtools.inspectedWindow.eval("$0.textContent").then((result) => {
    console.log(result[0]);
  });
}

browser.devtools.panels.elements.onSelectionChanged.addListener(
  handleSelectedElement,
);
```


**Note :**

Cette API est basée sur l'API Chromium `chrome.devtools`.
devtools.panels.ElementsPanel.createSidebarPane()
=================================================

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 :

![](/fr/docs/Mozilla/Add-ons/WebExtensions/API/devtools/panels/ElementsPanel/createSidebarPane/inspector-sidebar.png)

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
-------


```js
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é des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

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.


```js
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);
```


**Note :**

Cette API est basée sur l'API Chromium `chrome.devtools.panels`.
devtools.panels.ElementsPanel.setExpression()
=============================================

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
-------


```js
var evaluating = browser.devtools.panels.setExpression(
  expression, // string
  rootTitle, // string
);
```

### Paramètres

`expression`

`string`. L'expression à évaluer.

`rootTitle` Facultatif

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é des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Exemples
--------

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


```js
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);
```


**Note :**

Cette API est basée sur l'API Chromium `chrome.devtools.panels`.
devtools.panels.ExtensionSidebarPane.onShown
============================================

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

Syntaxe
-------


```js
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é des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Exemples
--------

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


```js
function onCreated(sidebarPane) {
  sidebarPane.onShown.addListener(() => {
    console.log("Shown");
  });

  sidebarPane.onHidden.addListener(() => {
    console.log("Hidden");
  });
}

browser.devtools.panels.elements.createSidebarPane("My pane").then(onCreated);
```


**Note :**

Cette API est basée sur l'API Chromium `chrome.devtools.panels`.
devtools.panels.ExtensionSidebarPane.setObject()
================================================

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
-------


```js
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` Facultatif

`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é des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

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


```js
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);
```


**Note :**

Cette API est basée sur l'API Chromium `chrome.devtools.panels`.
devtools.panels.ExtensionSidebarPane.onHidden
=============================================

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

Syntaxe
-------


```js
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é des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Exemples
--------

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


```js
function onCreated(sidebarPane) {
  sidebarPane.onShown.addListener(() => {
    console.log("Shown");
  });

  sidebarPane.onHidden.addListener(() => {
    console.log("Hidden");
  });
}

browser.devtools.panels.elements.createSidebarPane("My pane").then(onCreated);
```


**Note :**

Cette API est basée sur l'API Chromium `chrome.devtools.panels`.
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
-------


```js
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.


```js
function onCreated(sidebarPane) {
  sidebarPane.setPage("sidebar/sidebar.html");
}
```

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

**Note :**

Cette API est basée sur l'API Chromium `chrome.devtools.panels`.
devtools.inspectedWindow.reload()
=================================

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

Syntaxe
-------


```js
browser.devtools.inspectedWindow.reload(
  reloadOptions, // object
);
```

### Paramètres

`reloadOptions`Facultatif

`object`. Options pour la fonction, comme suit

`ignoreCache`Facultatif

`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`Facultatif

`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 (en-US), et sera renvoyée par les appels à `navigator.userAgent` (en-US) réalisé par des scripts s'exécutant sur la page.

`injectedScript` Facultatif

`string`. Injectez l'expression JavaScript donnée dans toutes les images de la page, avant tout autre script.


Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Exemples
--------

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


```js
const reloadButton = document.querySelector("#reload-button");

reloadButton.addEventListener("click", () => {
  browser.devtools.inspectedWindow.reload({
    injectedScript: "alert(navigator.userAgent);",
    userAgent: "Not a real UA",
  });
});
```


**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.
devtools.inspectedWindow.tabId
==============================

L'ID de `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 `tabs` pour interargir avec l'onglet :


```js
// 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,
  });
});
```



```js
// background.js

function handleMessage(request, sender, sendResponse) {
  browser.tabs.executeScript(request.tabId, {
    code: request.script,
  });
}

browser.runtime.onMessage.addListener(handleMessage);
```

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

**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.
devtools.network.onNavigated
============================

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

Syntaxe
-------


```js
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é des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Exemples
--------


```js
function handleNavigated(url) {
  console.log(url);
}

browser.devtools.network.onNavigated.addListener(handleNavigated);
```


**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.
devtools.network.getHAR()
=========================

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

C'est une fonction asynchrone qui renvoie une `Promise`.

Syntaxe
-------


```js
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é des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Exemples
--------

Consignez les URL des demandes contenues dans le journal HAR :


```js
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);
```


**Note :**

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

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
-------


```js
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 `true`s'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é des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Examples
--------

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


```js
function handleRequestFinished(request) {
  console.log("Server IP: ", request.serverIPAddress);
  request.getContent().then((content) => {
    console.log("Content: ", content);
  });
}

browser.devtools.network.onRequestFinished.addListener(handleRequestFinished);
```


**Note :**

Cette API est basée sur l'API `chrome.devtools` de Chromium.
permissions.remove()
====================

Demander d'abandonner les permissions listées dans l'objet `permissions.Permissions`.

L'argument `Permissions` peut contenir soit une propriété `origins` ,qui est un tableau de permissions d'hôte , ou une propriété `permissions`, qui est un tableau de permissions d'API, ou les deux. Les permissions doivent provenir de l'ensemble des permissions définies dans la clé `optional_permissions` du manifest.json.

Il s'agit d'une fonction asynchrone qui renvoie une `Promesse`.

Syntaxe
-------


```js
var removing = browser.permissions.remove(
  permissions, // Permissions object
);
```

### Paramètres

`permissions`

Un objet `permissions.Permissions`.

### Valeur retournée

Une `Promesse` qui sera remplie avec `true` si les permissions répertoriées dans l'argument `permissions` ont été supprimées, ou `false` dans le cas contraire.

Exemples
--------

Ce code ajoute un gestionnaire de clic qui supprime une permission donnée.


```js
const permissionToRemove = {
  permissions: ["history"],
};

function remove() {
  console.log("removing");
  browser.permissions.remove(permissionToRemove).then((result) => {
    console.log(result);
  });
}

document.querySelector("#remove").addEventListener("click", remove);
```

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

### Example extensions

* dnr-dynamic-with-options
* dnr-redirect-url
* permissions

**Note :**

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

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.
permissions.onAdded
===================

Activé lorsque l'extension a accordé de nouvelles permissions.

Syntaxe
-------


```js
browser.permissions.onAdded.addListener(listener);
browser.permissions.onAdded.removeListener(listener);
browser.permissions.onAdded.hasListener(listener);
```


Les événements ont trois fonctions :

`addListener(callback)`

Ajoute une écouteur à cet événement.

`removeListener(listener)`

Arrêtez d'écouter cet événement. L'argument `listener` est l'écouteur à supprimer.

`hasListener(listener)`

Vérifier si le `listener` est enregistré pour cet événement. Retourne `true` s'il écoute, sinon `false`.

Syntaxe addListener
-------------------

### Paramètres

`callback`

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

`permissions`

Objet `permissions.Permissions` contenant les permissions qui ont été accordées.


Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Exemples
--------


```js
function handleAdded(permissions) {
  console.log(`New API permissions: ${permissions.permissions}`);
  console.log(`New host permissions: ${permissions.origins}`);
}

browser.permissions.onAdded.addListener(handleAdded);
```


**Note :**

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

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.
Permissions
===========

Un objet `Permissions` représente une collection de permissions.

Type
----

Un `object` avec les propriétés suivantes :

`origins`Facultatif

Un tableau de modèles de correspondance, représentant les permissions de l'hôte.

`permissions`Facultatif

Un tableau de permissions nommées, y compris les permissions d'API et les permissions du presse-papiers.

Compatibilité des navigateurs
-----------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

**Note :**

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

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.