Crea un menú contextual

Aparecerá un menú contextual para el clic alternativo (con frecuencia, llamado clic derecho) del mouse. Para crear un menú contextual, primero agrega el permiso "contextMenus" al archivo manifest.json.

manifest.json:

  "permissions": [
    "contextMenus"
  ],

De manera opcional, usa la tecla "icons" si quieres mostrar un ícono junto a un elemento de menú. En este ejemplo, el elemento de menú de la extensión "Búsqueda global de Google" utiliza un ícono de 16 por 16.

Un elemento de menú contextual con un ícono de 16 por 16
Un elemento de menú contextual con un ícono de 16 por 16

El resto del ejemplo se tomó de la muestra de menú contextual de la Búsqueda global de Google, que proporciona varias opciones de menú contextual. Cuando una extensión contiene más de un menú contextual, Chrome las contrae automáticamente en un solo menú principal, como se muestra a continuación:

Se muestra un menú contextual anidado.
Figura 4: Un menú contextual y un menú secundario anidado.

Para ello, se llama a contextMenus.create() en el service worker de extensión. Los elementos del submenú se importan desde el archivo locales.js. Luego, runtime.onInstalled se itera sobre ellos.

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