tor-browser

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

file_childIframe.html (4710B)


      1 <!DOCTYPE HTML>
      2 <html>
      3 <!--
      4 https://bugzilla.mozilla.org/show_bug.cgi?id=633602
      5 -->
      6 <head>
      7  <title>Bug 633602 - file_childIframe.html</title>
      8  <script src="/tests/SimpleTest/SimpleTest.js">
      9  </script>
     10  <script src="/tests/SimpleTest/EventUtils.js"></script>
     11  <script type="application/javascript" src="pointerlock_utils.js"></script>
     12  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
     13  <style>
     14    #parent, #childDiv, #iframe, #table, #table td {
     15      margin: 0;
     16      padding: 0;
     17      border: none;
     18    }
     19    #iframe, #table {
     20      background-color: red;
     21      width: 100%;
     22      height: 100%;
     23    }
     24    #childDiv, #table td {
     25      background-color: blue;
     26      width: 50%;
     27      height: 50%;
     28    }
     29  </style>
     30 </head>
     31 <body>
     32  <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=633602">
     33    Mozilla Bug 633602
     34  </a>
     35 
     36  <div id="parent">
     37    <table id="childTable">
     38      <tr>
     39        <td>
     40          <iframe id="iframe" src="iframe_differentDOM.html">
     41          </iframe>
     42        </td>
     43        <td>
     44          <div id="childDiv">
     45          </div>
     46        </td>
     47      </tr>
     48    </table>
     49  </div>
     50 
     51  <pre id="test">
     52    <script type="application/javascript">
     53      /*
     54       * Test for Bug 633602
     55       * Check if pointer is locked when over a child iframe of
     56       * the locked element
     57       * Check if pointer is being repositioned back to center of
     58       * the locked element even when pointer goes over a child iframe
     59       */
     60 
     61      SimpleTest.waitForExplicitFinish();
     62 
     63      var parent = document.getElementById("parent")
     64        , childDiv = document.getElementById("childDiv")
     65        , iframe = document.getElementById("iframe");
     66 
     67      function MovementStats(aEvent) {
     68        this.movementX = aEvent.movementX;
     69        this.movementY = aEvent.movementY;
     70      }
     71 
     72      var hoverIframe;
     73      var firstMove, secondMove;
     74 
     75      function runTests () {
     76        ok(
     77          hoverIframe,
     78          "Pointer should be locked even when pointer hovers over a child iframe"
     79        );
     80        is(
     81          firstMove?.movementX,
     82          secondMove?.movementX,
     83          "MovementX of first move to childDiv should be equal to movementX of second move to child div"
     84        );
     85        is(
     86          firstMove?.movementY,
     87          secondMove?.movementY,
     88          "MovementY of first move to childDiv should be equal to movementY of second move to child div"
     89        );
     90      }
     91 
     92      var firstMoveChild = function (e) {
     93        info(`got firstMoveChild called: { screenX: ${e.screenX}, screenY: ${
     94          e.screenY
     95        }, movementX: ${e.movementX}, movementY: ${e.movementY} }`);
     96 
     97        firstMove = new MovementStats(e);
     98 
     99        parent.removeEventListener("mousemove", firstMoveChild);
    100 
    101        requestAnimationFrame(() => {
    102          parent.addEventListener("mousemove", moveIframe);
    103          synthesizeMouseAtCenter(iframe, {type: "mousemove"}, window);
    104        });
    105      };
    106 
    107      var moveIframe = function (e) {
    108        info(`got moveIframe called: { screenX: ${e.screenX}, screenY: ${
    109          e.screenY
    110        }, movementX: ${e.movementX}, movementY: ${e.movementY} }`);
    111 
    112        hoverIframe = !!document.pointerLockElement;
    113 
    114        parent.removeEventListener("mousemove", moveIframe);
    115 
    116        requestAnimationFrame(() => {
    117          parent.addEventListener("mousemove", secondMoveChild);
    118          synthesizeMouseAtCenter(childDiv, {type: "mousemove"}, window);
    119        });
    120      };
    121 
    122      var secondMoveChild = function (e) {
    123        info(`got secondMoveChild called: { screenX: ${e.screenX}, screenY: ${
    124          e.screenY
    125        }, movementX: ${e.movementX}, movementY: ${e.movementY} }`);
    126 
    127        secondMove = new MovementStats(e);
    128        parent.removeEventListener("mousemove", secondMoveChild);
    129 
    130        addFullscreenChangeContinuation("exit", function() {
    131          runTests();
    132          SimpleTest.finish();
    133        });
    134        info("Calling exitFullscreen()...");
    135        document.exitFullscreen();
    136      };
    137 
    138      document.addEventListener("pointerlockchange", function () {
    139        info(`Got pointerlockchange: pointerLockElement:\n${document.pointerLockElement?.outerHTML}`);
    140        if (document.pointerLockElement === parent) {
    141          parent.addEventListener("mousemove", firstMoveChild);
    142          synthesizeMouseAtCenter(childDiv, {type: "mousemove"}, window);
    143        }
    144      });
    145 
    146      function start() {
    147        addFullscreenChangeContinuation("enter", function() {
    148          info("Calling requestPointerLock()...");
    149          parent.requestPointerLock();
    150        });
    151        info("Calling requestFullscreen()...");
    152        parent.requestFullscreen();
    153      }
    154    </script>
    155  </pre>
    156 </body>
    157 </html>