tor-browser

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

browser_console_screenshot.js (3100B)

      1 /* Any copyright is dedicated to the Public Domain.
      2 * http://creativecommons.org/publicdomain/zero/1.0/ */
      3 
      4 // Test that :screenshot command works properly in the Browser Console
      5 
      6 "use strict";
      7 
      8 const COLOR_DIV_1 = "rgb(255, 0, 0)";
      9 const COLOR_DIV_2 = "rgb(0, 200, 0)";
     10 const COLOR_DIV_3 = "rgb(0, 0, 150)";
     11 const COLOR_DIV_4 = "rgb(100, 0, 100)";
     12 
     13 const TEST_URI = `data:text/html,<!DOCTYPE html><meta charset=utf8>
     14    <style>
     15      body {
     16        margin: 0;
     17        height: 100vh;
     18        display: grid;
     19        grid-template-columns: 1fr 1fr;
     20        grid-template-rows: 1fr 1fr;
     21      }
     22      div:nth-child(1) { background-color: ${COLOR_DIV_1}; }
     23      div:nth-child(2) { background-color: ${COLOR_DIV_2}; }
     24      div:nth-child(3) { background-color: ${COLOR_DIV_3}; }
     25      div:nth-child(4) { background-color: ${COLOR_DIV_4}; }
     26    </style>
     27    <body>
     28      <div></div>
     29      <div></div>
     30      <div></div>
     31      <div></div>
     32    </body>`;
     33 
     34 add_task(async function () {
     35  await addTab(TEST_URI);
     36  const hud = await BrowserConsoleManager.toggleBrowserConsole();
     37 
     38  info("Execute :screenshot");
     39  const file = new FileUtils.File(
     40    PathUtils.join(PathUtils.tempDir, "TestScreenshotFile.png")
     41  );
     42  // on some machines, such as macOS, dpr is set to 2. This is expected behavior, however
     43  // to keep tests consistant across OSs we are setting the dpr to 1
     44  const command = `:screenshot ${file.path} --dpr 1`;
     45 
     46  await executeAndWaitForMessageByType(
     47    hud,
     48    command,
     49    `Saved to ${file.path}`,
     50    ".console-api"
     51  );
     52 
     53  info("Create an image using the downloaded file as source");
     54  const image = new Image();
     55  image.src = PathUtils.toFileURI(file.path);
     56  await once(image, "load");
     57 
     58  info(
     59    "Retrieve the position of the elements relatively to the browser viewport"
     60  );
     61  const bodyBounds = await SpecialPowers.spawn(
     62    gBrowser.selectedBrowser,
     63    [],
     64    async () => {
     65      return content.document.body.getBoxQuadsFromWindowOrigin()[0].getBounds();
     66    }
     67  );
     68 
     69  const center = [
     70    bodyBounds.left + bodyBounds.width / 2,
     71    bodyBounds.top + bodyBounds.height / 2,
     72  ];
     73 
     74  info(
     75    "Check that the divs of the content page were rendered on the screenshot"
     76  );
     77  checkImageColorAt({
     78    image,
     79    x: center[0] - 50,
     80    y: center[1] - 50,
     81    expectedColor: COLOR_DIV_1,
     82    label: "The screenshot did render the first div of the content page",
     83  });
     84  checkImageColorAt({
     85    image,
     86    x: center[0] + 50,
     87    y: center[1] - 50,
     88    expectedColor: COLOR_DIV_2,
     89    label: "The screenshot did render the second div of the content page",
     90  });
     91  checkImageColorAt({
     92    image,
     93    x: center[0] - 50,
     94    y: center[1] + 50,
     95    expectedColor: COLOR_DIV_3,
     96    label: "The screenshot did render the third div of the content page",
     97  });
     98  checkImageColorAt({
     99    image,
    100    x: center[0] + 50,
    101    y: center[1] + 50,
    102    expectedColor: COLOR_DIV_4,
    103    label: "The screenshot did render the fourth div of the content page",
    104  });
    105 
    106  info("Remove the downloaded screenshot file and cleanup downloads");
    107  await IOUtils.remove(file.path);
    108  await resetDownloads();
    109 });