Criar um menu de contexto

Um menu de contexto aparece para o clique alternativo (frequentemente chamado de clique direito) de um mouse. Para criar um menu de contexto, primeiro adicione a permissão "contextMenus" ao arquivo manifest.json.

manifest.json:

  "permissions": [
    "contextMenus"
  ],

Também é possível usar a tecla "icons" para mostrar um ícone ao lado de um item de menu. Neste exemplo, o item de menu da opção "Pesquisa Google usa um ícone de 16 por 16.

Um item de menu de contexto com um ícone de 16 por 16.
Um item de menu de contexto com um ícone de 16 por 16.

O restante deste exemplo foi retirado da amostra do menu de contexto da Pesquisa Google global, que oferece várias opções de menu de contexto. Quando uma extensão contém mais de um menu de contexto, o Google Chrome os recolhe automaticamente em um único menu principal, como mostrado aqui:

Um menu de contexto aninhado.
Figura 4: um menu de contexto e um submenu aninhado.

O exemplo mostra isso chamando contextMenus.create() no worker de serviço de extensão. Os itens de submenu são importados do arquivo locales.js. Depois, runtime.onInstalled faz a iteração delas.

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