tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

browser_inspector_addSidebarTab.js (1863B)

      1 /* Any copyright is dedicated to the Public Domain.
      2   http://creativecommons.org/publicdomain/zero/1.0/ */
      3 "use strict";
      4 
      5 const TEST_URI =
      6  "data:text/html;charset=UTF-8," + "<h1>browser_inspector_addtabbar.js</h1>";
      7 
      8 const CONTENT_TEXT = "Hello World!";
      9 
     10 /**
     11 * Verify InspectorPanel.addSidebarTab() API that can be consumed
     12 * by DevTools extensions as well as DevTools code base.
     13 */
     14 add_task(async function () {
     15  const { inspector } = await openInspectorForURL(TEST_URI);
     16 
     17  const { Component, createFactory } = inspector.React;
     18  const dom = require("resource://devtools/client/shared/vendor/react-dom-factories.js");
     19  const { div } = dom;
     20 
     21  info("Adding custom panel.");
     22 
     23  // Define custom side-panel.
     24  class myTabPanel extends Component {
     25    render() {
     26      return div({ className: "my-tab-panel" }, CONTENT_TEXT);
     27    }
     28  }
     29  let tabPanel = createFactory(myTabPanel);
     30 
     31  // Append custom panel (tab) into the Inspector panel and
     32  // make sure it's selected by default (the last arg = true).
     33  inspector.addSidebarTab("myPanel", "My Panel", tabPanel, true);
     34  is(
     35    inspector.sidebar.getCurrentTabID(),
     36    "myPanel",
     37    "My Panel is selected by default"
     38  );
     39 
     40  // Define another custom side-panel.
     41  class myTabPanel2 extends Component {
     42    render() {
     43      return div({ className: "my-tab-panel2" }, "Another Content");
     44    }
     45  }
     46  tabPanel = createFactory(myTabPanel2);
     47 
     48  // Append second panel, but don't select it by default.
     49  inspector.addSidebarTab("myPanel", "My Panel", tabPanel, false);
     50  is(
     51    inspector.sidebar.getCurrentTabID(),
     52    "myPanel",
     53    "My Panel is selected by default"
     54  );
     55 
     56  // Check the the panel content is properly rendered.
     57  const tabPanelNode = inspector.panelDoc.querySelector(".my-tab-panel");
     58  is(
     59    tabPanelNode.textContent,
     60    CONTENT_TEXT,
     61    "Side panel content has been rendered."
     62  );
     63 });