Add-ons

sidebarAction.setPanel()

Sets the HTML document that defines the content of this sidebar.

Syntax

browser.sidebarAction.setPanel(
  details // object
)

Parameters

details
object.
tabIdOptional
integer. Sets the document only for a specific tab.
panel
string. The document to load into the sidebar, specified as a URL.
This can point to a file packaged within the extension (for example, created using extension.getURL), or a remote document (e.g. https://example.org/). It must be a valid URL, and an empty string is not allowed.

Browser compatibility

ChromeEdgeFirefoxFirefox for AndroidOpera
Basic supportNoNo54NoYes

Examples

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

var thisPanel = browser.extension.getURL("/this.html");
var thatPanel = browser.extension.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);
});

Acknowledgements

This API is based on Opera's chrome.sidebarAction API.

Microsoft Edge compatibility data is supplied by Microsoft Corporation and is included here under the Creative Commons Attribution 3.0 United States License.

Document Tags and Contributors

 Contributors to this page: wbamberg
 Last updated by: wbamberg,