JavaScript: Listening for browser tab change

Question

I'm trying to trigger an event on browser tab change in JavaScript. MDN advertises a browser.tabs.onActivated() function, and shows full support in Chrome, but my Chrome console barks when I try to access either browser or tabs global variables.

Does anyone know how to trigger an event on change of browser tab? I'm looking for a vanilla solution without external library dependencies.

browser.tabs.onActivated is a part of API for create browser add-ons. The API methods can't be called from a client-side code on simple web page. — karavanjo, Dec 13 '19 at 18:50
Add-ons or extensions - take a look https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons — karavanjo, Dec 13 '19 at 18:56

score 2 · Accepted Answer · answered Dec 13 '19 at 18:53

2

I ended up using:

document.addEventListener('visibilitychange', function() {
  console.log('the tab hath changed');
})

answered Dec 13 '19 at 18:53

duhaime

25,611
17
169
224

score 1 · Answer 2 · answered Dec 13 '19 at 19:14

1

use 'visibilitychange' event and 'hidden' attribute.

document.addEventListener('visibilitychange', () => console.log(document.hidden));

answered Dec 13 '19 at 19:14

Han Xiao

46
2

JavaScript: Listening for browser tab change

2 Answers2