Criar um menu de contexto

É exibido um menu de contexto para o clique alternativo (frequentemente chamado de clique com o botão 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 chave "icons" para mostrar um ícone ao lado de um item de menu. Neste exemplo, o item de menu da extensão "Pesquisa Google global" usa um ícone de 16 x 16.

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

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

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

O exemplo mostra isso chamando contextMenus.create() no service worker de extensão. Os itens de submenu são importados do arquivo locales.js. Em seguida, 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'],
    });
  }
});