Un popup è un'azione che mostra una finestra in cui gli utenti possono richiamare più funzionalità dell'estensione. Viene attivata tramite una scorciatoia da tastiera, facendo clic sull'icona dell'azione dell'estensione o chiamando chrome.action.openPopup(). I popup si chiudono automaticamente quando l'utente attiva lo stato attivo su una parte del browser esterna al popup. Non è possibile mantenere aperto il popup dopo che l'utente ha fatto clic.
L'immagine seguente, tratta dall'esempio Evento bevi acqua, mostra un popup con le opzioni del timer disponibili. Gli utenti impostano una sveglia facendo clic su uno dei pulsanti.
Registra un popup nel file manifest sotto la chiave "action".
{
"name": "Drink Water Event",
...
"action": {
"default_popup": "popup.html"
}
...
}
Implementa il popup come faresti con quasi qualsiasi altra pagina web. Tieni presente che qualsiasi codice JavaScript utilizzato in un popup deve essere contenuto in un file separato.
<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>
Puoi anche creare popup in modo dinamico chiamando 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'});
}
});