tor-browser

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

browser_inspector_highlighter-rulers_02.js (5511B)

      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 geometry highlighter elements.
      8 
      9 const TEST_URL =
     10  "data:text/html;charset=utf-8," +
     11  "<div style='position:absolute;left: 0; top: 0; " +
     12  "width: 40000px; height: 8000px'></div>";
     13 
     14 const ID = "rulers-highlighter-";
     15 
     16 const { TYPES } = ChromeUtils.importESModule(
     17  "resource://devtools/shared/highlighters.mjs"
     18 );
     19 
     20 add_task(async function () {
     21  const { inspector, highlighterTestFront } =
     22    await openInspectorForURL(TEST_URL);
     23  const front = inspector.inspectorFront;
     24 
     25  const highlighter = await front.getHighlighterByType(TYPES.RULERS);
     26 
     27  // the rulers doesn't need any node, but as highligher it seems mandatory
     28  // ones, so the body is given
     29  const body = await getNodeFront("body", inspector);
     30  await highlighter.show(body);
     31 
     32  await isUpdatedAfterScroll(highlighter, inspector, highlighterTestFront);
     33 
     34  await highlighter.finalize();
     35 });
     36 
     37 async function isUpdatedAfterScroll(
     38  highlighterFront,
     39  inspector,
     40  highlighterTestFront
     41 ) {
     42  info("Check the rulers' position by default");
     43 
     44  let xAxisRulerTransform =
     45    await highlighterTestFront.getHighlighterNodeAttribute(
     46      `${ID}x-axis-ruler`,
     47      "transform",
     48      highlighterFront
     49    );
     50  let xAxisTextTransform =
     51    await highlighterTestFront.getHighlighterNodeAttribute(
     52      `${ID}x-axis-text`,
     53      "transform",
     54      highlighterFront
     55    );
     56  let yAxisRulerTransform =
     57    await highlighterTestFront.getHighlighterNodeAttribute(
     58      `${ID}y-axis-ruler`,
     59      "transform",
     60      highlighterFront
     61    );
     62  let yAxisTextTransform =
     63    await highlighterTestFront.getHighlighterNodeAttribute(
     64      `${ID}y-axis-text`,
     65      "transform",
     66      highlighterFront
     67    );
     68 
     69  is(xAxisRulerTransform, null, "x axis ruler is positioned properly");
     70  is(xAxisTextTransform, null, "x axis text are positioned properly");
     71  is(yAxisRulerTransform, null, "y axis ruler is positioned properly");
     72  is(yAxisTextTransform, null, "y axis text are positioned properly");
     73 
     74  info("Ask the content window to scroll to specific coords");
     75 
     76  const x = 200,
     77    y = 300;
     78 
     79  let data = await SpecialPowers.spawn(
     80    gBrowser.selectedBrowser,
     81    [x, y],
     82    (_x, _y) => {
     83      return new Promise(resolve => {
     84        content.addEventListener(
     85          "scroll",
     86          () => resolve({ x: content.scrollX, y: content.scrollY }),
     87          { once: true }
     88        );
     89        content.scrollTo(_x, _y);
     90      });
     91    }
     92  );
     93 
     94  is(data.x, x, "window scrolled properly horizontally");
     95  is(data.y, y, "window scrolled properly vertically");
     96 
     97  info("Check the rulers are properly positioned after the scrolling");
     98 
     99  xAxisRulerTransform = await highlighterTestFront.getHighlighterNodeAttribute(
    100    `${ID}x-axis-ruler`,
    101    "transform",
    102    highlighterFront
    103  );
    104  xAxisTextTransform = await highlighterTestFront.getHighlighterNodeAttribute(
    105    `${ID}x-axis-text`,
    106    "transform",
    107    highlighterFront
    108  );
    109  yAxisRulerTransform = await highlighterTestFront.getHighlighterNodeAttribute(
    110    `${ID}y-axis-ruler`,
    111    "transform",
    112    highlighterFront
    113  );
    114  yAxisTextTransform = await highlighterTestFront.getHighlighterNodeAttribute(
    115    `${ID}y-axis-text`,
    116    "transform",
    117    highlighterFront
    118  );
    119 
    120  is(
    121    xAxisRulerTransform,
    122    `translate(-${x})`,
    123    "x axis ruler is positioned properly"
    124  );
    125  is(
    126    xAxisTextTransform,
    127    `translate(-${x})`,
    128    "x axis text are positioned properly"
    129  );
    130  is(
    131    yAxisRulerTransform,
    132    `translate(0, -${y})`,
    133    "y axis ruler is positioned properly"
    134  );
    135  is(
    136    yAxisTextTransform,
    137    `translate(0, -${y})`,
    138    "y axis text are positioned properly"
    139  );
    140 
    141  info("Ask the content window to scroll relative to the current position");
    142 
    143  data = await SpecialPowers.spawn(
    144    gBrowser.selectedBrowser,
    145    [-50, -60],
    146    (_deltaX, _deltaY) => {
    147      return new Promise(resolve => {
    148        content.addEventListener(
    149          "scroll",
    150          () => resolve({ x: content.scrollX, y: content.scrollY }),
    151          { once: true }
    152        );
    153        content.scrollBy(_deltaX, _deltaY);
    154      });
    155    }
    156  );
    157 
    158  is(data.x, x - 50, "window scrolled properly horizontally");
    159  is(data.y, y - 60, "window scrolled properly vertically");
    160 
    161  info("Check the rulers are properly positioned after the relative scrolling");
    162 
    163  xAxisRulerTransform = await highlighterTestFront.getHighlighterNodeAttribute(
    164    `${ID}x-axis-ruler`,
    165    "transform",
    166    highlighterFront
    167  );
    168  xAxisTextTransform = await highlighterTestFront.getHighlighterNodeAttribute(
    169    `${ID}x-axis-text`,
    170    "transform",
    171    highlighterFront
    172  );
    173  yAxisRulerTransform = await highlighterTestFront.getHighlighterNodeAttribute(
    174    `${ID}y-axis-ruler`,
    175    "transform",
    176    highlighterFront
    177  );
    178  yAxisTextTransform = await highlighterTestFront.getHighlighterNodeAttribute(
    179    `${ID}y-axis-text`,
    180    "transform",
    181    highlighterFront
    182  );
    183 
    184  is(
    185    xAxisRulerTransform,
    186    `translate(-${x - 50})`,
    187    "x axis ruler is positioned properly"
    188  );
    189  is(
    190    xAxisTextTransform,
    191    `translate(-${x - 50})`,
    192    "x axis text are positioned properly"
    193  );
    194  is(
    195    yAxisRulerTransform,
    196    `translate(0, -${y - 60})`,
    197    "y axis ruler is positioned properly"
    198  );
    199  is(
    200    yAxisTextTransform,
    201    `translate(0, -${y - 60})`,
    202    "y axis text are positioned properly"
    203  );
    204 }