tor-browser

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

browser_inspector_highlighter-cssgrid_01.js (2402B)

      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 // Test the creation of the canvas highlighter element of the css grid highlighter.
      8 
      9 const TEST_URL = `
     10  <style type='text/css'>
     11    #grid {
     12      display: grid;
     13    }
     14    #cell1 {
     15      grid-column: 1;
     16      grid-row: 1;
     17    }
     18    #cell2 {
     19      grid-column: 2;
     20      grid-row: 1;
     21    }
     22    #cell3 {
     23      grid-column: 1;
     24      grid-row: 2;
     25    }
     26    #cell4 {
     27      grid-column: 2;
     28      grid-row: 2;
     29    }
     30  </style>
     31  <div id="grid">
     32    <div id="cell1">cell1</div>
     33    <div id="cell2">cell2</div>
     34    <div id="cell3">cell3</div>
     35    <div id="cell4">cell4</div>
     36  </div>
     37 `;
     38 
     39 const { TYPES } = ChromeUtils.importESModule(
     40  "resource://devtools/shared/highlighters.mjs"
     41 );
     42 const HIGHLIGHTER_TYPE = TYPES.GRID;
     43 
     44 add_task(async function () {
     45  const { inspector, highlighterTestFront } = await openInspectorForURL(
     46    "data:text/html;charset=utf-8," + encodeURIComponent(TEST_URL)
     47  );
     48  const front = inspector.inspectorFront;
     49  const highlighter = await front.getHighlighterByType(HIGHLIGHTER_TYPE);
     50 
     51  await isHiddenByDefault(highlighterTestFront, highlighter);
     52  await isVisibleWhenShown(highlighterTestFront, inspector, highlighter);
     53 
     54  await highlighter.finalize();
     55 });
     56 
     57 async function isHiddenByDefault(highlighterTestFront, highlighterFront) {
     58  info("Checking that the highlighter is hidden by default");
     59 
     60  const hidden = await highlighterTestFront.getHighlighterNodeAttribute(
     61    "css-grid-canvas",
     62    "hidden",
     63    highlighterFront
     64  );
     65  ok(hidden, "The highlighter is hidden by default");
     66 }
     67 
     68 async function isVisibleWhenShown(
     69  highlighterTestFront,
     70  inspector,
     71  highlighterFront
     72 ) {
     73  info("Asking to show the highlighter on the test node");
     74 
     75  const node = await getNodeFront("#grid", inspector);
     76  await highlighterFront.show(node);
     77 
     78  let hidden = await highlighterTestFront.getHighlighterNodeAttribute(
     79    "css-grid-canvas",
     80    "hidden",
     81    highlighterFront
     82  );
     83  ok(!hidden, "The highlighter is visible");
     84 
     85  info("Hiding the highlighter");
     86  await highlighterFront.hide();
     87 
     88  hidden = await highlighterTestFront.getHighlighterNodeAttribute(
     89    "css-grid-canvas",
     90    "hidden",
     91    highlighterFront
     92  );
     93  ok(hidden, "The highlighter is hidden");
     94 }