tor-browser

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

browser_inspector_highlighter-eyedropper-zoom.js (2147B)

      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 "use strict";
      5 
      6 // Test that the eye dropper works as expected when the page is zoomed-in.
      7 
      8 const COLOR_1 = "#aa0000";
      9 const COLOR_2 = "#0bb000";
     10 const COLOR_3 = "#00cc00";
     11 const COLOR_4 = "#000dd0";
     12 
     13 const HTML = `
     14 <style>
     15  body {
     16    margin: 0;
     17  }
     18  div {
     19    height: 50px;
     20    width: 50px;
     21  }
     22 </style>
     23 <div style="background-color: ${COLOR_1};"></div>
     24 <div style="background-color: ${COLOR_2};"></div>
     25 <div style="background-color: ${COLOR_3};"></div>
     26 <div style="background-color: ${COLOR_4};"></div>`;
     27 const TEST_URI = `http://example.com/document-builder.sjs?html=${encodeURIComponent(
     28  HTML
     29 )}`;
     30 
     31 add_task(async function () {
     32  const { inspector, highlighterTestFront } =
     33    await openInspectorForURL(TEST_URI);
     34 
     35  info("Zoom in the page");
     36  setContentPageZoomLevel(2);
     37 
     38  const toggleButton = inspector.panelDoc.querySelector(
     39    "#inspector-eyedropper-toggle"
     40  );
     41  toggleButton.click();
     42  await TestUtils.waitForCondition(() =>
     43    highlighterTestFront.isEyeDropperVisible()
     44  );
     45 
     46  ok(true, "Eye dropper is visible");
     47 
     48  const checkColorAt = (...args) =>
     49    checkEyeDropperColorAt(highlighterTestFront, ...args);
     50 
     51  // ⚠️ Note that we need to check the regular position, not the zoomed-in ones.
     52 
     53  await checkColorAt(
     54    25,
     55    10,
     56    COLOR_1,
     57    "The eyedropper holds the expected color for the first div"
     58  );
     59 
     60  await checkColorAt(
     61    25,
     62    60,
     63    COLOR_2,
     64    "The eyedropper holds the expected color for the second div"
     65  );
     66 
     67  await checkColorAt(
     68    25,
     69    110,
     70    COLOR_3,
     71    "The eyedropper holds the expected color for the third div"
     72  );
     73 
     74  await checkColorAt(
     75    25,
     76    160,
     77    COLOR_4,
     78    "The eyedropper holds the expected color for the fourth div"
     79  );
     80 
     81  info("Hide the eyedropper");
     82  toggleButton.click();
     83  await TestUtils.waitForCondition(async () => {
     84    const visible = await highlighterTestFront.isEyeDropperVisible();
     85    return !visible;
     86  });
     87  setContentPageZoomLevel(1);
     88 });