Values of this type are objects. The define two events, onShown and onHidden.

• onShown is emitted when the panel is shown in the devtools (for example, because the user clicked on the panel's tab in the devtools window).
• onHidden is emitted when the panel is hidden (for example, because the user switched to a different tab in the devtools window).

This code creates a new panel, then adds handlers for its onShown and onHidden events.

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);
});