חלון קופץ הוא פעולה שמציגה חלון שמאפשר למשתמשים להפעיל מספר תכונות של תוספים. הוא מופעל על ידי מקש קיצור או על ידי לחיצה על סמל הפעולה של התוסף. החלונות הקופצים נסגרים באופן אוטומטי כשהמשתמש מתמקד בחלק מסוים של הדפדפן מחוץ לחלון הקופץ. אין דרך להשאיר את החלון הקופץ פתוח לאחר שהמשתמש לחץ ליציאה.
בתמונה הבאה, הלקוחה מהדוגמה של אירוע מים של אלכוהול, מוצג חלון קופץ עם אפשרויות טיימר זמינות. המשתמשים מגדירים התראה על ידי לחיצה על אחד מהלחצנים.
צריך לרשום חלון קופץ במניפסט מתחת למפתח "action".
{
"name": "Drink Water Event",
...
"action": {
"default_popup": "popup.html"
}
...
}
מטמיעים את החלון הקופץ כמו כמעט כל דף אינטרנט אחר. לתשומת ליבך, כל JavaScript שנעשה בו שימוש בחלון קופץ חייב להיות בקובץ נפרד.
<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>
אפשר גם ליצור חלונות קופצים באופן דינמי על ידי קריאה ל-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'});
}
});