tor-browser

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

helper_fission_transforms.html (3029B)

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