devtools.panels.ExtensionPanel
An ExtensionPanel represents a panel added to the devtools. It's the resolution of the Promise returned by browser.devtools.panels.create().
Type
Values of this type are objects. The define two events, onShown and onHidden.
onShownis emitted when the panel is shown in the devtools (for example, because the user clicked on the panel's tab in the devtools window).onHiddenis emitted when the panel is hidden (for example, because the user switched to a different tab in the devtools window).
Examples
This code creates a new panel, then adds handlers for its onShown and onHidden events.
js
function handleShown(e) {
console.log(e);
console.log("panel is being shown");
}
function handleHidden(e) {
console.log(e);
console.log("panel is being hidden");
}
browser.devtools.panels
.create(
"My Panel", // title
"icons/star.png", // icon
"devtools/panel/panel.html", // content
)
.then((newPanel) => {
newPanel.onShown.addListener(handleShown);
newPanel.onHidden.addListener(handleHidden);
});
Browser compatibility
| desktop | mobile | ||||||
|---|---|---|---|---|---|---|---|
ExtensionPanel
|
|
|
|
|
|
|
|
createStatusBarButton
|
|
|
|
|
|
|
|
onHidden
|
|
|
|
|
|
|
|
onSearch
|
|
|
|
|
|
|
|
onShown
|
|
|
|
|
|
|
|
Legend
Tip: you can click/tap on a cell for more information.
- Full support
- Full support
- No support
- No support
Note:
This API is based on Chromium's chrome.devtools.panels API.