Is there an event for when a Chrome Extension popup is closed?

Question

I've already tried window.unload, window.beforeunload, etc. I'm looking for a way to notify my background page once the popup is closed.

Have you tried [`chrome.tabs.onRemoved`](http://developer.chrome.com/extensions/tabs.html#event-onRemoved) or maybe [`chrome.windows.onRemoved`](http://developer.chrome.com/extensions/windows.html#event-onRemoved) if it counts as a window? — BeardFist, Apr 03 '13 at 22:12
See also: [Does onbeforeunload event trigger for popup.html in a google chrome extension?](http://stackoverflow.com/q/2315863/405550) — Zaz, Oct 17 '16 at 14:39

score 35 · Accepted Answer · answered Apr 04 '13 at 01:55

35

You can try this. Connect to your background page with chrome.runtime.connect (or chrome.extension.connect before Chrome 26) and port.onDisconnect will be fired in your background page when the popup is closed.

answered Apr 04 '13 at 01:55

方觉

4,042
1
24
28

`port.onDisconnect` fires when the extension is removed/deleted not when the user stops using it, and the popup closes. – Mudlabs Aug 15 '17 at 02:54
@Mudlabs actually it does fire when the popup closes. – Dmitry Davydov Jun 17 '19 at 06:14
@DmitryDavydov Hmm, it's not firing for me either. – David Callanan Jan 16 '20 at 19:58
Doesn't fire for me either, when popup closed. – HerrimanCoder Nov 26 '20 at 23:12
1

FYI This use case is now broken in manifest v3 as ports will be closed automatically after some time and you'll get errors saying you're trying to connected a disconnected port object. – Eric Uldall Oct 21 '22 at 00:11

gignu · Answer 2 · 2021-07-09T06:35:08.150

It's as simple as that:

// popup.js
chrome.runtime.connect({ name: "popup" });

// background.js
chrome.runtime.onConnect.addListener(function(port) {
    if (port.name === "popup") {
        port.onDisconnect.addListener(function() {
           console.log("popup has been closed")
        });
    }
});

Note that there are some edge cases where this method doesn't work. E.g. when having the popup open and then switching tabs by using a keyboard shortcut such as ctrl + t for example.

score 9 · Answer 3 · answered Apr 15 '18 at 15:15

9

Probably a hacky way, but in the popup page you can listen to

  window.onblur = function(){}

and send a message to active tab.

answered Apr 15 '18 at 15:15

nxtwrld

1,942
14
15

Unfortunately this triggers when switching app even with the popup still remaining open, but does not trigger when actually closing the popup by clicking the extension icon or current tab – Nick Cardoso Jul 01 '19 at 07:41
On Safari Web Extension, only this way works! – WillBC Feb 10 '21 at 03:44

user7610 · Answer 4 · 2019-07-26T14:43:09.780

There is currently no way to figure out when the browser action popup was closed as window.unonload is triggered immediately when the popup finished loading, not when it's closed. There is a bug crbug.com/31262 for this.

Three work arounds available are well described here. They include the port.onDisconnect trick and periodically polling chrome.extension.getViews() from either the popup or a background page.

score 2 · Answer 5 · answered Dec 16 '21 at 18:33

2

I'm surprised noone mentioned this (I've tested it on Firefox Nightly and it works there):

window.addEventListener("pagehide", function(event) {
    console.log(event);
 });

answered Dec 16 '21 at 18:33

Petr L.

414
5
13

Doesn't work for me in Chrome 96.0.4664.110. I've also tried `visibilitychange` event but it works inconsistently. Moving back to port.onDisconnect hack. – Dmitry Davydov Jan 04 '22 at 03:37

score 1 · Answer 6 · answered Apr 01 '22 at 20:27

1

Try to use the visibilitychange event on the document object. It works fine for me:

document.addEventListener('visibilitychange', MyFunction, false);

answered Apr 01 '22 at 20:27

Murillo

19
1

score 1 · Answer 7 · edited Aug 25 '22 at 08:07

1

This is the solution I used for manifest V3:

Set up a connection in your popup's JavaScript file

chrome.runtime.connect();

In background.js, use onConnect to listen for the event

chrome.runtime.onConnect.addListener(port => {
  port.onDisconnect.addListener(()=>{
    //Your event will be fired in here
  })
})

edited Aug 25 '22 at 08:07

Sachin Jain

21,353
33
103
168

answered Aug 21 '22 at 03:49

zinzin

19
2

score 0 · Answer 8 · answered Nov 29 '17 at 06:08

0

Finally found the solution. Put below code in background.js/eventPage.js:

chrome.windows.onFocusChanged.addListener(function(window) {
    //handle close event
});

answered Nov 29 '17 at 06:08

GorvGoyl

42,508
29
229
225

4

This will fire when any window or extension gets or loses focus. Doesn't answer the question. – Joe Martella Mar 20 '18 at 21:27
Helped with my related issue, so it's at least indirectly relevant IMHO... – robertdavid Jul 08 '21 at 21:32

Is there an event for when a Chrome Extension popup is closed?

8 Answers8

Linked

Related