Créer un menu contextuel

Un menu contextuel apparaît pour le clic alternatif (souvent appelé clic droit) de la souris. Pour créer un menu contextuel, commencez par ajouter l'autorisation "contextMenus" au fichier manifest.json.

manifest.json:

  "permissions": [
    "contextMenus"
  ],

Vous pouvez également utiliser la touche "icons" pour afficher une icône à côté d'un élément de menu. Dans cet exemple, l'élément de menu de l'extension "Recherche Google globale" utilise une icône 16 x 16.

Élément de menu contextuel avec une icône 16 x 16.

Le reste de cet exemple est tiré de l'exemple de menu contextuel de la recherche Google globale, qui propose plusieurs options de menu contextuel. Lorsqu'une extension contient plusieurs menus contextuels, Chrome les réduit automatiquement en un seul menu parent, comme illustré ci-dessous:

Figure 4: Menu contextuel et sous-menu imbriqué

L'exemple montre cela en appelant contextMenus.create() dans le service worker de l'extension. Les éléments de sous-menu sont importés à partir du fichier locales.js. Ensuite, runtime.onInstalled les itère.

service-worker.js:

const tldLocales = {
  'com.au': 'Australia',
  'com.br': 'Brazil',
  ...
}

chrome.runtime.onInstalled.addListener(async () => {
  for (let [tld, locale] of Object.entries(tldLocales)) {
    chrome.contextMenus.create({
      id: tld,
      title: locale,
      type: 'normal',
      contexts: ['selection'],
    });
  }
});