tor-browser

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

pointerlock_indefinite-manual.html (3568B)

      1 <!DOCTYPE html>
      2 <html>
      3 <body>
      4 <meta name="timeout" content="long">
      5 <script src="/resources/testharness.js"></script>
      6 <script src="/resources/testharnessreport.js"></script>
      7 <meta name='flags' content='interact'>
      8 <style type="text/css">
      9    button {
     10        color: blue;
     11    }
     12 
     13    #target-wrap {
     14        position: relative;
     15        background-color: lightgrey;
     16        width: 400px;
     17        height: 150px;
     18        border: grey 1px solid;
     19    }
     20 
     21    #target-wrap span, #status-log {
     22        color: green;
     23    }
     24 </style>
     25 </head>
     26 <body>
     27    <h2>Description</h2>
     28    <p>This test validates that movementX/Y provided indefinitely even when the mouse cursor would have otherwise hit the edge of a screen.</p>
     29    <hr/>
     30 
     31    <h2>Manual Test Steps:</h2>
     32    <p>
     33        <ol>
     34            <li>Click the "lockTarget" button to request a pointer lock.</li>
     35            <li>Move the pointer constantly in a diagonal direction (e.g. up and right).</li>
     36            <li>Test is done.</li>
     37        </ol>
     38    </p>
     39    <hr/>
     40 
     41    <button onclick="lockTarget();">lockTarget</button>
     42 
     43    <div id="target-wrap">
     44        <div id="status-log">Click the "lockTarget" button.</div>
     45        <p>screenSize: <span id="screenSize-log">NaN</span></p>
     46        <p>movementX_sum: <span id="movementX_sum-log">NaN</span></p>
     47        <p>movementY_sum: <span id="movementY_sum-log">NaN</span></p>
     48    </div>
     49    <hr/>
     50 
     51    <div id="log"></div>
     52 
     53    <script type="text/javascript" >
     54        var screenSize_log = document.querySelector('#screenSize-log'),
     55            movementX_sum_log = document.querySelector('#movementX_sum-log'),
     56            movementY_sum_log = document.querySelector('#movementY_sum-log'),
     57            status_log = document.querySelector('#status-log'),
     58            target = document.querySelector('#target-wrap');
     59        var movementX_sum = 0,
     60            movementY_sum = 0;
     61        var screenWidth = screen.width,
     62            screenHeight = screen.height;
     63 
     64        var enable_logging = false;
     65 
     66        screenSize_log.innerHTML = "width: " + screenWidth + " px, " + "height: " + screenHeight + " px"
     67 
     68        var movementXYIndefiniteTest = async_test("Test that movementX/Y provided indefinitely even when the mouse cursor would have otherwise hit the edge of a screen.");
     69 
     70    document.addEventListener("pointerlockchange", function() {
     71        if(document.pointerLockElement) {
     72            status_log.innerHTML = "Keep moving...";
     73            enable_logging = true;
     74        }
     75    });
     76 
     77    document.addEventListener("mousemove", function (e) {
     78        if(enable_logging) {
     79            movementX_sum += Math.abs(e.movementX);
     80            movementY_sum += Math.abs(e.movementY);
     81 
     82            movementX_sum_log.innerHTML = movementX_sum + "px";
     83            movementY_sum_log.innerHTML = movementY_sum + "px";
     84 
     85            if(movementX_sum > 2 * screen.width && movementY_sum > 2 * screen.height) {
     86                movementXYIndefiniteTest.step(function() {
     87                    assert_greater_than(movementX_sum, 2 * screenWidth, "Sum of movementX is greater than 2 times of screen width");
     88                    assert_greater_than(movementY_sum, 2 * screenHeight, "Sum of movementY is greater than 2 times of screen height");
     89                });
     90 
     91                movementXYIndefiniteTest.done();
     92 
     93                status_log.innerHTML = "Test succeeds...";
     94 
     95                enable_logging = false;
     96 
     97                document.exitPointerLock();
     98            }
     99        }
    100        });
    101 
    102    function lockTarget() {
    103        target.requestPointerLock();
    104    }
    105    </script>
    106    </body>
    107 </html>