tabs.onUpdated
Fired when a tab is updated.
When the user navigates to a new URL in a tab, this typically generates severalonUpdated
events as various properties of thetabs.Tab
object are updated. This includes theurl
, but also potentially thetitle
andfavIconUrl
properties. Thestatus
property will cycle through"loading"
and"complete"
.
This event also fires for changes to a tab's properties that don't involve navigation, such as pinning and unpinning (which updates thepinned
property) and muting or unmuting (which updates theaudible
andmutedInfo
properties).
You can filter this event, making it only fire for tabs whose URLs match specificpatterns, changes to particular properties, changes to a tab or window, or any combinations of these restrictions.
Syntax
browser.tabs.onUpdated.addListener( listener, // function filter // optional object)browser.tabs.onUpdated.removeListener(listener)browser.tabs.onUpdated.hasListener(listener)
Events have three functions:
addListener(callback, filter)
Adds a listener to this event.
removeListener(listener)
Stop listening to this event. The
listener
argument is the listener to remove.hasListener(listener)
Check whether
listener
is registered for this event. Returnstrue
if it is listening,false
otherwise.
addListener syntax
Parameters
listener
The function called when this event occurs. The function is passed these arguments:
tabId
integer
. The ID of the updated tab.changeInfo
object
. Properties of the tab that changed. See thechangeInfo section for more details.tab
tabs.Tab
. The new state of the tab.
filter
Optionalobject
. A set of filters that restrict the events sent to this listener. This object can have one or more of these properties. Events are only sent if they satisfy all the filters provided.urls
Array
. An array ofmatch patterns. Fires the event only for tabs whose currenturl
property matches any one of the patterns.properties
Array
. An array of strings consisting of supportedtabs.Tab
object property names. Fires the event only for changes to one of the properties named in the array. These properties can be used:- "attention"
- "autoDiscardable"
- "audible"
- "discarded"
- "favIconUrl"
- "groupId"
- "hidden"
- "isArticle"
- "mutedInfo"
- "openerTabId"
- "pinned"
- "status"
- "title"
- "url"
Note:The "url" value has been supported since Firefox 88. In Firefox 87 and earlier, "url" changes can be observed by filtering by "status".
tabId
Integer
. Fires this event only for the tab identified by this ID.windowId
Integer
. Fires this event only for tabs in the window identified by this ID.
Additional objects
changeInfo
Lists the changes to the state of the tab that is updated. To learn more about these properties, see thetabs.Tab
documentation. Note that not alltabs.Tab
properties are supported.
attention
Optionalboolean
. Indicates whether the tab is drawing attention. For example,attention
istrue
when the tab displays a modal dialog.audible
Optionalboolean
. The tab's new audible state.autoDiscardable
Optionalboolean
. Whether the tab can be discarded by the browser. The default value istrue
. When set tofalse
, the browser cannot automatically discard the tab. However, the tab can be discarded bytabs.discard
.discarded
Optionalboolean
. Whether the tab is discarded. A discarded tab is one whose content has been unloaded from memory but is visible in the tab strip. Its content gets reloaded the next time it's activated.favIconUrl
Optionalstring
. The tab's new favicon URL. Not included when a tab loses its favicon (navigating from a page with a favicon to a page without one). CheckfavIconUrl
intab instead.groupId
Optionalinteger
. The ID of the group the tabs are in or-1
(tabGroups.TAB_GROUP_ID_NONE
) for ungrouped tabs.hidden
Optionalboolean
. True if the tab ishidden
.isArticle
Optionalboolean
. True if the tab is an article and is therefore eligible for display inReader Mode.mutedInfo
Optionaltabs.MutedInfo
. The tab's new muted state and the reason for the change.openerTabId
Optionalinteger
. The ID of the tab that opened this tab, if any. This property is only present if the opener tab exists and is in the same window.pinned
Optionalboolean
. The tab's new pinned state.status
Optionalstring
. The status of the tab. Can be eitherloading orcomplete.title
Optionalstring
. The tab's new title.url
Optionalstring
. The tab's URL, if it has changed.
Examples
Listen for and log all the change info and new state:
function handleUpdated(tabId, changeInfo, tabInfo) { console.log(`Updated tab: ${tabId}`); console.log("Changed attributes: ", changeInfo); console.log("New tab Info: ", tabInfo);}browser.tabs.onUpdated.addListener(handleUpdated);
Log changes to URLs:
function handleUpdated(tabId, changeInfo, tabInfo) { if (changeInfo.url) { console.log(`Tab: ${tabId} URL changed to ${changeInfo.url}`); }}browser.tabs.onUpdated.addListener(handleUpdated);
Filtering examples
Log changes only to tabs whoseurl
property ismatched byhttps://developer.mozilla.org/*
orhttps://mastodon.social/@mdn
:
const pattern1 = "https://developer.mozilla.org/*";const pattern2 = "https://mastodon.social/@mdn";const filter = { urls: [pattern1, pattern2],};function handleUpdated(tabId, changeInfo, tabInfo) { console.log(`Updated tab: ${tabId}`); console.log("Changed attributes: ", changeInfo); console.log("New tab Info: ", tabInfo);}browser.tabs.onUpdated.addListener(handleUpdated, filter);
Log changes only to thepinned
property of tabs (that is, pin and unpin actions):
const filter = { properties: ["pinned"],};function handleUpdated(tabId, changeInfo, tabInfo) { console.log(`Updated tab: ${tabId}`); console.log("Changed attributes: ", changeInfo); console.log("New tab Info: ", tabInfo);}browser.tabs.onUpdated.addListener(handleUpdated, filter);
Combine both the previous filters, log only when thepinned
property of tabs changes for tabs whoseurl
property ismatched byhttps://developer.mozilla.org/*
orhttps://mastodon.social/@mdn
:
const pattern1 = "https://developer.mozilla.org/*";const pattern2 = "https://mastodon.social/@mdn";const filter = { urls: [pattern1, pattern2], properties: ["pinned"],};function handleUpdated(tabId, changeInfo, tabInfo) { console.log(`Updated tab: ${tabId}`); console.log("Changed attributes: ", changeInfo); console.log("New tab Info: ", tabInfo);}browser.tabs.onUpdated.addListener(handleUpdated, filter);
Log changes only when thepinned
property of tabs changes for tabs whoseurl
property ismatched byhttps://developer.mozilla.org/*
orhttps://mastodon.social/@mdn
where the tab was part of the current browser window when the update event fired:
const pattern1 = "https://developer.mozilla.org/*";const pattern2 = "https://mastodon.social/@mdn";const filter = { urls: [pattern1, pattern2], properties: ["pinned"], windowId: browser.windows.WINDOW_ID_CURRENT,};function handleUpdated(tabId, changeInfo, tabInfo) { console.log(`Updated tab: ${tabId}`); console.log("Changed attributes: ", changeInfo); console.log("New tab Info: ", tabInfo);}browser.tabs.onUpdated.addListener(handleUpdated, filter);
Example extensions
Browser compatibility
Note:This API is based on Chromium'schrome.tabs
API. This documentation is derived fromtabs.json
in the Chromium code.