tor-browser

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

helper_fission_tap.html (3124B)


      1 <!DOCTYPE HTML>
      2 <html>
      3 <head>
      4  <meta charset="utf-8">
      5  <meta name="viewport" content="width=device-width,initial-scale=1">
      6  <title>Test to ensure events get untransformed properly for OOP iframes</title>
      7  <script src="/tests/SimpleTest/SimpleTest.js"></script>
      8  <script src="/tests/SimpleTest/paint_listener.js"></script>
      9  <script src="helper_fission_utils.js"></script>
     10  <script src="apz_test_utils.js"></script>
     11  <script src="apz_test_native_event_utils.js"></script>
     12  <script>
     13 
     14    // Copied from helper_fission_transforms.html, except for the
     15    // synthesis function.
     16 
     17    async function test() {
     18      const iframe = document.querySelector("iframe");
     19      await setupCrossOriginIFrame(iframe, "helper_fission_plain.html");
     20 
     21      let readyPromise = new Promise(resolve => {
     22        window.addEventListener("message", event => {
     23          if (event.data === "listenerready") {
     24            resolve();
     25          }
     26        });
     27      });
     28 
     29      let result = await SpecialPowers.spawn(iframe, [], async () => {
     30        content.document.addEventListener("click", (e) => {
     31          let data = JSON.stringify({
     32            type: "clicked",
     33            coords: {
     34              offsetX: e.clientX,
     35              offsetY: e.clientY
     36            }
     37          });
     38          content.window.parent.postMessage(data, "*");
     39        });
     40 
     41        content.window.parent.postMessage("listenerready", "*");
     42 
     43        return true;
     44      });
     45      ok(result, "Successfully installed event listener in OOP iframe");
     46 
     47      await readyPromise;
     48 
     49      let childMessagePromise = new Promise(resolve => {
     50        window.addEventListener("message", event => {
     51          if (typeof event.data === 'string') {
     52            let data = JSON.parse(event.data);
     53            if ("type" in data && data.type == "clicked") {
     54              let coordinates = {
     55                offsetX: data.coords.offsetX,
     56                offsetY: data.coords.offsetY
     57              };
     58              resolve(coordinates);
     59            }
     60          }
     61        });
     62      });
     63 
     64      await synthesizeNativeTap(document.body, 200, 200, function () {
     65        dump("Finished synthesizing click, waiting for OOPIF message...\n");
     66      });
     67 
     68      let clickCoordsInChild = await childMessagePromise;
     69      let expected_coord = 100 / Math.sqrt(2); // because the iframe is rotated 45 deg
     70      ok(Math.abs(clickCoordsInChild.offsetX - expected_coord) < 3,
     71        `x-coord ${clickCoordsInChild.offsetX} landed near expected value ${expected_coord}`);
     72      ok(Math.abs(clickCoordsInChild.offsetY - expected_coord) < 3,
     73        `y-coord ${clickCoordsInChild.offsetY} landed near expected value ${expected_coord}`);
     74    }
     75 
     76    waitUntilApzStable()
     77      .then(test)
     78      .then(subtestDone, subtestFailed);
     79 
     80  </script>
     81  <style>
     82    body,
     83    html {
     84      margin: 0;
     85    }
     86 
     87    div {
     88      transform-origin: top left;
     89      transform: translateX(200px) scale(2) rotate(45deg);
     90      width: 250px;
     91    }
     92 
     93    iframe {
     94      width: 200px;
     95      height: 150px;
     96      border: solid 1px black;
     97    }
     98  </style>
     99 </head>
    100 <body>
    101  <div><iframe id="testframe"></iframe></div>
    102 </body>
    103 </html>