Adicionar um pop-up

Um pop-up é uma ação que mostra uma janela para que os usuários invoquem vários recursos da extensão. Ela é acionada por um atalho de teclado, ao clicar no ícone de ação da extensão ou chamar chrome.action.openPopup(). Os pop-ups são fechados automaticamente quando o usuário foca em alguma parte do navegador fora do pop-up. Não será possível manter o pop-up aberto depois que o usuário sair.

A imagem a seguir, retirada do exemplo Drink Water Event, mostra um pop-up que exibe as opções de timer disponíveis. Os usuários definem um alarme clicando em um dos botões.

Exemplo de pop-up.
Um exemplo de pop-up.

Registre um pop-up no manifesto com a chave "action".

{  "name": "Drink Water Event",  ...  "action": {    "default_popup": "popup.html"  }  ... } 

Implemente o pop-up como faria com quase qualquer outra página da Web. Qualquer JavaScript usado em um pop-up precisa estar em um arquivo separado.

<html>  <head>    <title>Water Popup</title>  </head>  <body>      <img src="./stay_hydrated.png" id="hydrateImage">      <button id="sampleSecond" value="0.1">Sample Second</button>      <button id="min15" value="15">15 Minutes</button>      <button id="min30" value="30">30 Minutes</button>      <button id="cancelAlarm">Cancel Alarm</button>    <script src="popup.js"></script>  </body> </html> 

Também é possível criar pop-ups dinamicamente chamando action.setPopup().

chrome.storage.local.get('signed_in', (data) => {   if (data.signed_in) {     chrome.action.setPopup({popup: 'popup.html'});   } else {     chrome.action.setPopup({popup: 'popup_sign_in.html'});   } });