tor-browser

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

browser_layoutHelpers_getBoxQuads2.js (6444B)


      1 /* Any copyright is dedicated to the Public Domain.
      2 * http://creativecommons.org/publicdomain/zero/1.0/ */
      3 
      4 // Tests that getBoxQuadsFromWindowOrigin works across process
      5 // boundaries.
      6 //
      7 // The test forces a fission window, because there is some
      8 // imprecision in the APZ transforms for non-fission windows,
      9 // and the getBoxQuadsFromWindowOrigin is designed specifically
     10 // to be used by a fission browser.
     11 //
     12 // This test embeds a number of documents within iframes,
     13 // with a variety of borders and padding. Each iframe hosts
     14 // a document in different domain than its container.
     15 //
     16 // The innermost documents have a 50px x 50px div with a
     17 // 50px margin. So relative to its own iframe, the offset
     18 // for the div should be 50, 50.
     19 //
     20 // Here's the embedding diagram:
     21 // +-- A -----------------------------------------------------+
     22 // |                                                          |
     23 // | +- div -----+                                            |
     24 // | | 100 x 100 |                                            |
     25 // | +-----------+                                            |
     26 // |                                                          |
     27 // | +- div 20px margin ------------------------------------+ |
     28 // | |                                                      | |
     29 // | | +- B: iframe 10px border -+ +- D: iframe 40px pad -+ | |
     30 // | | |     250 x 250           | |     250 x 250        | | |
     31 // | | |     50px margin         | |     50px margin      | | |
     32 // | | |                         | |                      | | |
     33 // | | | +- C: iframe ---+       | | +- E: iframe ---+    | | |
     34 // | | | |     150 x 150 |       | | |     150 x 150 |    | | |
     35 // | | | +---------------+       | | +---------------+    | | |
     36 // | | +-------------------------+ +----------------------+ | |
     37 // | +------------------------------------------------------+ |
     38 // +----------------------------------------------------------+
     39 //
     40 // The following checks are made:
     41 // C-div relative to A should have offset 130, 230.
     42 // E-div relative to A should have offset 430, 260.
     43 //
     44 // This tests the most likely cases for the code that handles
     45 // relativeToTopLevelBrowsingContextId. It does not check these
     46 // cases:
     47 // 1) A css-transform'ed iframe.
     48 // 2) An abspos iframe.
     49 // 3) An iframe embedded in an SVG.
     50 
     51 "use strict";
     52 /* import-globals-from ../../../../gfx/layers/apz/test/mochitest/apz_test_utils.js */
     53 
     54 const TEST_URI = TEST_URI_ROOT_SSL + "doc_layoutHelpers_getBoxQuads2-a.html";
     55 
     56 add_task(async function () {
     57  info("Opening a fission window.");
     58  const fissionWin = await BrowserTestUtils.openNewBrowserWindow({
     59    remote: true,
     60    fission: true,
     61  });
     62 
     63  info("Load APZ test utils.");
     64  loadHelperScript(
     65    "../../../../gfx/layers/apz/test/mochitest/apz_test_utils.js"
     66  );
     67  info("Load paint_listener.");
     68  loadHelperScript("../../../../../tests/SimpleTest/paint_listener.js");
     69 
     70  info("Open a new tab.");
     71  const tab = await BrowserTestUtils.openNewForegroundTab(
     72    fissionWin.gBrowser,
     73    TEST_URI
     74  );
     75 
     76  info("Running tests");
     77 
     78  ok(waitUntilApzStable, "waitUntilApzStable is defined.");
     79  await waitUntilApzStable();
     80 
     81  await ContentTask.spawn(tab.linkedBrowser, null, async function () {
     82    const win = content.window;
     83    const doc = content.document;
     84    const refNode = doc.documentElement;
     85    const iframeB = doc.getElementById("b");
     86    const iframeD = doc.getElementById("d");
     87 
     88    // Get the offset of the reference node to the window origin. We'll use
     89    // this offset later to adjust the quads we get from the iframes.
     90    const refQuad = refNode.getBoxQuadsFromWindowOrigin()[0];
     91    const offsetX = refQuad.p1.x;
     92    const offsetY = refQuad.p1.y;
     93    info(`Reference node is offset (${offsetX}, ${offsetY}) from window.`);
     94 
     95    function postAndReceiveMessage(iframe) {
     96      return new Promise(resolve => {
     97        const onmessage = event => {
     98          if (event.data.quad) {
     99            win.removeEventListener("message", onmessage);
    100            resolve(event.data.quad);
    101          }
    102        };
    103        win.addEventListener("message", onmessage, { capture: false });
    104        iframe.contentWindow.postMessage({ callGetBoxQuads: true }, "*");
    105      });
    106    }
    107 
    108    // Bug 1624659: Our checks are not always precise, though for these test
    109    // cases they should align precisely to css pixels. For now we use an
    110    // epsilon and a locally-defined isfuzzy to compensate. We can't use
    111    // SimpleTest.isfuzzy, because it's not bridged to the ContentTask.
    112    // If that is ever bridged, we can remove the isfuzzy definition here and
    113    // everything should "just work".
    114    function isfuzzy(actual, expected, epsilon, msg) {
    115      if (actual >= expected - epsilon && actual <= expected + epsilon) {
    116        ok(true, msg);
    117      } else {
    118        // This will trigger the usual failure message for is.
    119        is(actual, expected, msg);
    120      }
    121    }
    122 
    123    const ADDITIVE_EPSILON = 1;
    124    const checksToMake = [
    125      {
    126        msg: "C-div",
    127        iframe: iframeB,
    128        left: 130,
    129        top: 230,
    130        right: 180,
    131        bottom: 280,
    132      },
    133      {
    134        msg: "E-div",
    135        iframe: iframeD,
    136        left: 430,
    137        top: 260,
    138        right: 480,
    139        bottom: 310,
    140      },
    141    ];
    142 
    143    for (const { msg, iframe, left, top, right, bottom } of checksToMake) {
    144      info("Checking " + msg + ".");
    145      const quad = await postAndReceiveMessage(iframe);
    146      const bounds = quad.getBounds();
    147      info(
    148        `Quad bounds is (${bounds.left}, ${bounds.top}) to (${bounds.right}, ${bounds.bottom}).`
    149      );
    150      isfuzzy(
    151        bounds.left - offsetX,
    152        left,
    153        ADDITIVE_EPSILON,
    154        msg + " quad left position is as expected."
    155      );
    156      isfuzzy(
    157        bounds.top - offsetY,
    158        top,
    159        ADDITIVE_EPSILON,
    160        msg + " quad top position is as expected."
    161      );
    162      isfuzzy(
    163        bounds.right - offsetX,
    164        right,
    165        ADDITIVE_EPSILON,
    166        msg + " quad right position is as expected."
    167      );
    168      isfuzzy(
    169        bounds.bottom - offsetY,
    170        bottom,
    171        ADDITIVE_EPSILON,
    172        msg + " quad bottom position is as expected."
    173      );
    174    }
    175  });
    176 
    177  fissionWin.gBrowser.removeCurrentTab();
    178 
    179  await BrowserTestUtils.closeWindow(fissionWin);
    180 
    181  // Clean up the properties added to window by paint_listener.js.
    182  delete window.waitForAllPaintsFlushed;
    183  delete window.waitForAllPaints;
    184  delete window.promiseAllPaintsDone;
    185 });