Creare un menu contestuale

Viene visualizzato un menu contestuale per i clic alternativi (spesso chiamati clic con il tasto destro del mouse). Per creare un menu contestuale, devi prima aggiungere l'autorizzazione "contextMenus" al file manifest.json.

manifest.json:

  "permissions": [
    "contextMenus"
  ],

Se vuoi, puoi usare il tasto "icons" se vuoi mostrare un'icona accanto a una voce del menu. In questo esempio, la voce di menu "Ricerca Google globale" utilizza un'icona 16 x 16.

Una voce del menu contestuale con un'icona di 16 x 16.

La parte restante di questo esempio è tratto dall'esempio di menu contestuale della Ricerca Google globale, che offre diverse opzioni di menu contestuali. Quando un'estensione contiene più di un menu contestuale, Chrome li comprime automaticamente in un unico menu principale, come mostrato di seguito:

Figura 4: un menu contestuale e un sottomenu nidificato.

L'esempio mostra questa operazione chiamando contextMenus.create() nel service worker dell'estensione. Le voci di menu secondario vengono importate dal file locales.js. Poi, runtime.onInstalled esegue l'iterazione.

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'],
    });
  }
});