devtools.panels

Note: Although the APIs are based on the Chrome devtools APIs, there are still many features that are not yet implemented in Firefox, and therefore are not documented here. To see which features are currently missing please see Limitations of the devtools APIs.

The devtools.panels API lets a devtools extension define its user interface inside the devtools window.

The devtools window hosts a number of separate tools - the JavaScript Debugger, Network Monitor, and so on. A row of tabs across the top lets the user switch between the different tools. The window hosting each tool's user interface is called a "panel".

With the devtools.panels API you can create new panels in the devtools window.

Like all the devtools APIs, this API is only available to code running in the document defined in the devtools_page manifest.json key, or in other devtools documents created by the extension (such as the panel's own document). See Extending the developer tools for more.

Types

devtools.panels.ElementsPanel: Represents the HTML/CSS inspector in the browser's devtools.
devtools.panels.ExtensionPanel: Represents a devtools panel created by the extension.
devtools.panels.ExtensionSidebarPane: Represents a pane that an extension has added to the HTML/CSS inspector in the browser's devtools.

Properties

devtools.panels.elements: A reference to an ElementsPanel object.
devtools.panels.themeName: The name of the current devtools theme.

Functions

devtools.panels.create(): Creates a new devtools panel.

Events

devtools.panels.onThemeChanged: Fired when the devtools theme changes.

Example extensions

devtools-panels

Browser compatibility

	desktop					mobile
	Chrome	Edge	Firefox	Opera	Safari	Firefox for Android	Safari on iOS
`panels`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – Full support Firefox 54 (Release date: 2017-06-13) footnote Full support	Opera – Full support Opera 41 (Release date: 2016-10-25) footnote Full support	Safari – Full support Safari 16 (Release date: 2022-09-12) footnote Full support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`Button`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – No support Firefox footnote No support	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote Full support	Safari – Full support Safari 16 (Release date: 2022-09-12) footnote Full support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`ElementsPanel`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – Full support Firefox 56 (Release date: 2017-09-28) footnote Full support	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote Full support	Safari – No support Safari footnote No support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`ElementsPanel.createSidebarPane`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – Full support Firefox 57 (Release date: 2017-11-14) footnote Full support	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote Full support	Safari – No support Safari footnote No support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`ElementsPanel.onSelectionChanged`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – Full support Firefox 56 (Release date: 2017-09-28) footnote Full support	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote Full support	Safari – No support Safari footnote No support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`ExtensionPanel`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – Full support Firefox 54 (Release date: 2017-06-13) footnote Full support	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote Full support	Safari – Full support Safari 16 (Release date: 2022-09-12) footnote Full support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`ExtensionPanel.createStatusBarButton`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – No support Firefox footnote No support	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote Full support	Safari – Full support Safari 16 (Release date: 2022-09-12) footnote Full support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`ExtensionPanel.onHidden`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – Full support Firefox 54 (Release date: 2017-06-13) footnote Full support	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote Full support	Safari – Full support Safari 16 (Release date: 2022-09-12) footnote Full support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`ExtensionPanel.onSearch`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – No support Firefox footnote No support	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote Full support	Safari – No support Safari footnote No support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`ExtensionPanel.onShown`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – Full support Firefox 54 (Release date: 2017-06-13) footnote Full support	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote Full support	Safari – Full support Safari 16 (Release date: 2022-09-12) footnote Full support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`ExtensionSidebarPane`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – Full support Firefox 57 (Release date: 2017-11-14) footnote Full support	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote Full support	Safari – No support Safari footnote No support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`ExtensionSidebarPane.onHidden`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – Full support Firefox 57 (Release date: 2017-11-14) footnote footnote This event is only fired when the user switches between sidebar panes, not when the user switches between devtools panels. See bug 1412317.	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote Full support	Safari – No support Safari footnote No support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`ExtensionSidebarPane.onShown`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – Full support Firefox 57 (Release date: 2017-11-14) footnote footnote This event is only fired when the user switches between sidebar panes, not when the user switches between devtools panels. See bug 1412317.	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote Full support	Safari – No support Safari footnote No support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`ExtensionSidebarPane.setExpression`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote footnote The expression must evaluate to a JavaScript object or a DOM node, or nothing is shown in the sidebar.	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote footnote The expression must evaluate to a JavaScript object or a DOM node, or nothing is shown in the sidebar.	Firefox – Full support Firefox 57 (Release date: 2017-11-14) footnote footnote Before Firefox 60, the expression must evaluate to an object that can be serialized to JSON, or nothing was shown in the sidebar. In particular, JavaScript cyclic objects and DOM nodes were not supported. See bug 1403130.	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote footnote The expression must evaluate to a JavaScript object or a DOM node, or nothing is shown in the sidebar.	Safari – No support Safari footnote No support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`ExtensionSidebarPane.setHeight`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – No support Firefox footnote No support	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote Full support	Safari – No support Safari footnote No support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`ExtensionSidebarPane.setObject`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote footnote If the `jsonObject` parameter is a string, it is not displayed.	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote footnote If the `jsonObject` parameter is a string, it is not displayed.	Firefox – Full support Firefox 57 (Release date: 2017-11-14) footnote footnote If the `jsonObject` is a string, then `rootTitle` must also be given, or `jsonObject` will not be displayed. See bug 1412310.	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote footnote If the `jsonObject` parameter is a string, it is not displayed.	Safari – No support Safari footnote No support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`ExtensionSidebarPane.setPage`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – Full support Firefox 57 (Release date: 2017-11-14) footnote Full support	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote Full support	Safari – No support Safari footnote No support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`SourcesPanel`	Chrome – No support Chrome 18 – 37 (Release date: 2012-03-28) altname altname Alternate name: ScriptsPanel Chrome – Full support Chrome 38 (Release date: 2014-10-07) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – No support Firefox footnote No support	Opera – No support Opera 15 – 24 (Release date: 2013-07-02) altname altname Alternate name: ScriptsPanel Opera – Full support Opera 25 (Release date: 2014-10-15) footnote Full support	Safari – No support Safari footnote No support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`SourcesPanel.createSidebarPane`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – No support Firefox footnote No support	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote Full support	Safari – No support Safari footnote No support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`SourcesPanel.onSelectionChanged`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – No support Firefox footnote No support	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote Full support	Safari – No support Safari footnote No support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`create`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – Full support Firefox 54 (Release date: 2017-06-13) footnote Full support	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote Full support	Safari – Full support Safari 16 (Release date: 2022-09-12) footnote Full support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`create.iconPath`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote footnote URL always resolved as absolute.	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote footnote URL always resolved as absolute.	Firefox – Full support Firefox 54 (Release date: 2017-06-13) footnote footnote URL is resolved as relative to the current extension page (unless expressed as an absolute URL, e.g. '/icons/panel.png').	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote footnote URL always resolved as absolute.	Safari – Full support Safari 16 (Release date: 2022-09-12) footnote footnote URL always resolved as absolute.	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`create.pagePath`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote footnote URL always resolved as absolute.	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote footnote URL always resolved as absolute.	Firefox – Full support Firefox 54 (Release date: 2017-06-13) footnote footnote URL is resolved as relative to the current extension page (unless expressed as an absolute URL, e.g. '/icons/panel.png').	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote footnote URL always resolved as absolute.	Safari – Full support Safari 16 (Release date: 2022-09-12) footnote footnote URL always resolved as absolute.	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`create.title`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – Full support Firefox 54 (Release date: 2017-06-13) footnote Full support	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote Full support	Safari – Full support Safari 16 (Release date: 2022-09-12) footnote Full support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`elements`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – Full support Firefox 56 (Release date: 2017-09-28) footnote Full support	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote Full support	Safari – Full support Safari 16 (Release date: 2022-09-12) footnote Full support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`onThemeChanged`	Chrome – No support Chrome footnote No support	Edge – No support Edge footnote No support	Firefox – Full support Firefox 55 (Release date: 2017-08-08) footnote Full support	Opera – No support Opera footnote No support	Safari – Full support Safari 16 (Release date: 2022-09-12) footnote Full support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`openResource`	Chrome – Full support Chrome 45 (Release date: 2015-09-01) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – No support Firefox footnote No support	Opera – Full support Opera 32 (Release date: 2015-09-15) footnote Full support	Safari – Full support Safari 16 (Release date: 2022-09-12) footnote Full support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`openResource.columnNumber`	Chrome – Full support Chrome 114 (Release date: 2023-05-30) footnote Full support	Edge – Full support Edge 114 (Release date: 2023-06-02) footnote Full support	Firefox – No support Firefox footnote No support	Opera – Full support Opera 100 (Release date: 2023-06-29) footnote Full support	Safari – Full support Safari 16 (Release date: 2022-09-12) footnote Full support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`openResource.lineNumber`	Chrome – Full support Chrome 45 (Release date: 2015-09-01) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – No support Firefox footnote No support	Opera – Full support Opera 32 (Release date: 2015-09-15) footnote Full support	Safari – Full support Safari 16 (Release date: 2022-09-12) footnote Full support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`openResource.url`	Chrome – Full support Chrome 45 (Release date: 2015-09-01) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – No support Firefox footnote No support	Opera – Full support Opera 32 (Release date: 2015-09-15) footnote Full support	Safari – Full support Safari 16 (Release date: 2022-09-12) footnote Full support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`setOpenResourceHandler`	Chrome – Full support Chrome 18 (Release date: 2012-03-28) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – No support Firefox footnote No support	Opera – Full support Opera 15 (Release date: 2013-07-02) footnote Full support	Safari – Full support Safari 16 (Release date: 2022-09-12) footnote Full support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`sources`	Chrome – No support Chrome 18 – 37 (Release date: 2012-03-28) altname altname Alternate name: scripts Chrome – Full support Chrome 38 (Release date: 2014-10-07) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – No support Firefox footnote No support	Opera – No support Opera 15 – 24 (Release date: 2013-07-02) altname altname Alternate name: scripts Opera – Full support Opera 25 (Release date: 2014-10-15) footnote Full support	Safari – Full support Safari 16 (Release date: 2022-09-12) footnote Full support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support
`themeName`	Chrome – Full support Chrome 59 (Release date: 2017-06-05) footnote Full support	Edge – Full support Edge 79 (Release date: 2020-01-15) footnote Full support	Firefox – Full support Firefox 55 (Release date: 2017-08-08) footnote Full support	Opera – Full support Opera 41 (Release date: 2016-10-25) footnote Full support	Safari – Full support Safari 16 (Release date: 2022-09-12) footnote Full support	Firefox for Android – No support Firefox for Android footnote No support	Safari on iOS – No support Safari on iOS footnote No support

Tip: you can click/tap on a cell for more information.

Full support: Full support
No support: No support
: See implementation notes.
: Uses a non-standard name
: Has more compatibility info.

Note: This API is based on Chromium's chrome.devtools.panels API.

This page was last modified on Jul 17, 2025 by MDN contributors.

Visit Mozilla Corporation’s not-for-profit parent, the Mozilla Foundation.
Portions of this content are ©1998–2026 by individual mozilla.org contributors. Content available under a Creative Commons license.