Creare un menu contestuale

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

manifest.json:

  "permissions": [
    "contextMenus"
  ],

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

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

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

Figura 4: un menu contestuale e un sottomenu nidificato.

Nell'esempio, ciò si verifica chiamando contextMenus.create() nel service worker dell'estensione. Le voci del sottomenu vengono importate dal file locales.js. quindi 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'],
    });
  }
});