tor-browser

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

browser_webconsole_object_inspector.js (3147B)

      1 /* Any copyright is dedicated to the Public Domain.
      2 * http://creativecommons.org/publicdomain/zero/1.0/ */
      3 
      4 "use strict";
      5 
      6 // Check expanding/collapsing object inspector in the console.
      7 const TEST_URI =
      8  "data:text/html;charset=utf8,<!DOCTYPE html><h1>test Object Inspector</h1>";
      9 
     10 add_task(async function () {
     11  const hud = await openNewTabAndConsole(TEST_URI);
     12 
     13  logAllStoreChanges(hud);
     14 
     15  await SpecialPowers.spawn(gBrowser.selectedBrowser, [], function () {
     16    content.wrappedJSObject.console.log("oi-test", [1, 2, { a: "a", b: "b" }], {
     17      c: "c",
     18      d: [3, 4],
     19      length: 987,
     20    });
     21  });
     22 
     23  const node = await waitFor(() => findConsoleAPIMessage(hud, "oi-test"));
     24  const objectInspectors = [...node.querySelectorAll(".tree")];
     25  is(
     26    objectInspectors.length,
     27    2,
     28    "There is the expected number of object inspectors"
     29  );
     30 
     31  const [arrayOi, objectOi] = objectInspectors;
     32 
     33  await expandObjectInspectorNode(arrayOi.querySelector(".tree-node"));
     34 
     35  let arrayOiNodes = arrayOi.querySelectorAll(".tree-node");
     36 
     37  // The object inspector now looks like:
     38  // ▼ […]
     39  // |  0: 1
     40  // |  1: 2
     41  // |  ▶︎ 2: {a: "a", b: "b"}
     42  // |  length: 3
     43  // |  ▶︎ <prototype>
     44  is(
     45    arrayOiNodes.length,
     46    6,
     47    "There is the expected number of nodes in the tree"
     48  );
     49 
     50  info("Expanding a leaf of the array object inspector");
     51  let arrayOiNestedObject = arrayOiNodes[3];
     52  await expandObjectInspectorNode(arrayOiNestedObject);
     53 
     54  arrayOiNodes = arrayOi.querySelectorAll(".node");
     55 
     56  // The object inspector now looks like:
     57  // ▼ […]
     58  // |  0: 1
     59  // |  1: 2
     60  // |  ▼ 2: {…}
     61  // |  |  a: "a"
     62  // |  |  b: "b"
     63  // |  |  ▶︎ <prototype>
     64  // |  length: 3
     65  // |  ▶︎ <prototype>
     66  is(
     67    arrayOiNodes.length,
     68    9,
     69    "There is the expected number of nodes in the tree"
     70  );
     71 
     72  info("Collapsing the root");
     73  const onArrayOiMutation = waitForNodeMutation(arrayOi, {
     74    childList: true,
     75  });
     76  arrayOi.querySelector(".theme-twisty").click();
     77  await onArrayOiMutation;
     78 
     79  is(
     80    arrayOi.querySelector(".theme-twisty").classList.contains("open"),
     81    false,
     82    "The arrow of the root node of the tree is collapsed after clicking on it"
     83  );
     84 
     85  arrayOiNodes = arrayOi.querySelectorAll(".node");
     86  is(arrayOiNodes.length, 1, "Only the root node is visible");
     87 
     88  info("Expanding the root again");
     89  await expandObjectInspectorNode(arrayOi.querySelector(".tree-node"));
     90 
     91  arrayOiNodes = arrayOi.querySelectorAll(".node");
     92  arrayOiNestedObject = arrayOiNodes[3];
     93  ok(
     94    arrayOiNestedObject
     95      .querySelector(".theme-twisty")
     96      .classList.contains("open"),
     97    "The object tree is still expanded"
     98  );
     99 
    100  is(
    101    arrayOiNodes.length,
    102    9,
    103    "There is the expected number of nodes in the tree"
    104  );
    105 
    106  await expandObjectInspectorNode(objectOi.querySelector(".tree-node"));
    107 
    108  const objectOiNodes = objectOi.querySelectorAll(".node");
    109  // The object inspector now looks like:
    110  // ▼ {…}
    111  // |  c: "c"
    112  // |  ▶︎ d: [3, 4]
    113  // |  length: 987
    114  // |  ▶︎ <prototype>
    115  is(
    116    objectOiNodes.length,
    117    5,
    118    "There is the expected number of nodes in the tree"
    119  );
    120 });