tor-browser

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

browser_inspector_infobar_05.js (3296B)

      1 /* This Source Code Form is subject to the terms of the Mozilla Public
      2 * License, v. 2.0. If a copy of the MPL was not distributed with this
      3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
      4 
      5 "use strict";
      6 
      7 // Bug 1521188 - Indicate grid/flex container/item in infobar
      8 // Check the text content of the highlighter nodeinfo bar.
      9 const HighlightersBundle = new Localization(
     10  ["devtools/shared/highlighters.ftl"],
     11  true
     12 );
     13 
     14 const TEST_URI = URL_ROOT + "doc_inspector_infobar_04.html";
     15 
     16 const CLASS_GRID_TYPE = "box-model-infobar-grid-type";
     17 const CLASS_FLEX_TYPE = "box-model-infobar-flex-type";
     18 
     19 const FLEX_CONTAINER_TEXT =
     20  HighlightersBundle.formatValueSync("flextype-container");
     21 const FLEX_ITEM_TEXT = HighlightersBundle.formatValueSync("flextype-item");
     22 const FLEX_DUAL_TEXT = HighlightersBundle.formatValueSync("flextype-dual");
     23 const GRID_CONTAINER_TEXT =
     24  HighlightersBundle.formatValueSync("gridtype-container");
     25 const GRID_ITEM_TEXT = HighlightersBundle.formatValueSync("gridtype-item");
     26 const GRID_DUAL_TEXT = HighlightersBundle.formatValueSync("gridtype-dual");
     27 
     28 const TEST_DATA = [
     29  {
     30    selector: "#flex-container",
     31    flexText: FLEX_CONTAINER_TEXT,
     32    gridText: "",
     33  },
     34  {
     35    selector: "#flex-item",
     36    flexText: FLEX_ITEM_TEXT,
     37    gridText: "",
     38  },
     39  {
     40    selector: "#flex-container-item",
     41    flexText: FLEX_DUAL_TEXT,
     42    gridText: "",
     43  },
     44  {
     45    selector: "#grid-container",
     46    flexText: "",
     47    gridText: GRID_CONTAINER_TEXT,
     48  },
     49  {
     50    selector: "#grid-item",
     51    flexText: "",
     52    gridText: GRID_ITEM_TEXT,
     53  },
     54  {
     55    selector: "#grid-container-item",
     56    flexText: "",
     57    gridText: GRID_DUAL_TEXT,
     58  },
     59  {
     60    selector: "#flex-item-grid-container",
     61    flexText: FLEX_ITEM_TEXT,
     62    gridText: GRID_CONTAINER_TEXT,
     63  },
     64 ];
     65 
     66 const TEST_TEXT_DATA = [
     67  {
     68    selector: "#flex-text-container",
     69    flexText: FLEX_ITEM_TEXT,
     70    gridText: "",
     71  },
     72  {
     73    selector: "#grid-text-container",
     74    flexText: "",
     75    gridText: GRID_ITEM_TEXT,
     76  },
     77 ];
     78 
     79 add_task(async function () {
     80  const { inspector, highlighterTestFront } =
     81    await openInspectorForURL(TEST_URI);
     82 
     83  for (const currentTest of TEST_DATA) {
     84    info("Testing " + currentTest.selector);
     85    await testTextContent(currentTest, inspector, highlighterTestFront);
     86  }
     87 
     88  for (const currentTest of TEST_TEXT_DATA) {
     89    info("Testing " + currentTest.selector);
     90    await testTextNodeTextContent(currentTest, inspector, highlighterTestFront);
     91  }
     92 });
     93 
     94 async function testTextContent(
     95  { selector, gridText, flexText },
     96  inspector,
     97  highlighterTestFront
     98 ) {
     99  await selectAndHighlightNode(selector, inspector);
    100 
    101  const gridType =
    102    await highlighterTestFront.getHighlighterNodeTextContent(CLASS_GRID_TYPE);
    103  const flexType =
    104    await highlighterTestFront.getHighlighterNodeTextContent(CLASS_FLEX_TYPE);
    105 
    106  is(gridType, gridText, "node " + selector + ": grid type matches.");
    107  is(flexType, flexText, "node " + selector + ": flex type matches.");
    108 }
    109 
    110 async function testTextNodeTextContent(test, inspector, highlighterTestFront) {
    111  const { walker } = inspector;
    112  const div = await walker.querySelector(walker.rootNode, test.selector);
    113  const { nodes } = await walker.children(div);
    114  test.selector = nodes[0];
    115  await testTextContent(test, inspector, highlighterTestFront);
    116 }