Sets the sidebar's panel: that is, the HTML document that defines the content of this sidebar.

Types of panel

Sidebars always have a"manifest panel", which is the panel defined in thesidebar_action manifest key.

If you set a new panel usingsetPanel(), and include thetabId option, then the panel is set only for the given tab. This panel is referred to as the"tab-specific panel".

If you set a new panel usingsetPanel(), and include thewindowId option, then the panel is set only for the given window. This panel is referred to as the"window-specific panel", and will appear in all tabs of that window that do not have a tab-specific panel set.

If you set a new panel usingsetPanel(), and omit both thetabId andwindowId options, then this sets the"global panel". The global panel will then appear in all tabs that do not have a tab-specific panel set and whose window does not have a window-specific panel.

Syntax

browser.sidebarAction.setPanel(  details // object)

Parameters

details

object. An object with the following properties:

panel

string ornull. The panel to load into the sidebar, specified as a URL pointing to an HTML document, ornull, or an empty string.

This can point to a file packaged within the extension (for example, created usingruntime.getURL), or a remote document (e.g.,https://example.org/). It must be a valid URL.

Ifpanel isnull or"", then a previously set panel will be removed, so that:

• IftabId is specified, and the tab has a tab-specific panel set, then the tab will inherit the panel from the window it belongs to.
• IfwindowId is specified, and the window has a window-specific panel set, then the window will inherit the global panel.
• Otherwise, the global panel will be reset to the manifest panel.

tabIdOptional

integer. Sets the panel only for the given tab.

windowIdOptional

integer. Sets the panel only for the given window.

• IfwindowId andtabId are both specified, the function fails and the panel is not set.
• IfwindowId andtabId are both omitted, the global panel is set.

Examples

This code toggles the sidebar document when the user clicks a browser action:

let thisPanel = browser.runtime.getURL("/this.html");let thatPanel = browser.runtime.getURL("/that.html");function toggle(panel) {  if (panel === thisPanel) {    browser.sidebarAction.setPanel({ panel: thatPanel });  } else {    browser.sidebarAction.setPanel({ panel: thisPanel });  }}browser.browserAction.onClicked.addListener(() => {  browser.sidebarAction.getPanel({}).then(toggle);});

Browser compatibility