tor-browser

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

helper_bug1162771.html (3163B)


      1 <!DOCTYPE HTML>
      2 <html>
      3 <head>
      4  <meta charset="utf-8">
      5  <meta name="viewport" content="width=device-width; initial-scale=1.0">
      6  <title>Test for touchend on media elements</title>
      7  <script type="application/javascript" src="apz_test_native_event_utils.js"></script>
      8  <script type="application/javascript" src="apz_test_utils.js"></script>
      9  <script src="/tests/SimpleTest/paint_listener.js"></script>
     10  <script type="application/javascript">
     11 
     12 async function handleTouchStart() {
     13  let v = document.getElementById("video");
     14  let d = document.getElementById("div");
     15 
     16  let e = await new Promise(resolve => {
     17    document.body.addEventListener("touchstart", resolve, {once: true});
     18  });
     19 
     20  if (e.target === v || e.target === d) {
     21    e.target.style.display = "none";
     22    ok(true, "Set display to none on #" + e.target.id);
     23  } else {
     24    ok(false, "Got unexpected touchstart on " + e.target);
     25  }
     26  await promiseAllPaintsDone();
     27 }
     28 
     29 async function handleTouchEnd() {
     30  let v = document.getElementById("video");
     31  let d = document.getElementById("div");
     32 
     33  let e = await new Promise(resolve => {
     34    document.body.addEventListener("touchend", resolve, {once: true});
     35  });
     36 
     37  if (e.target === v || e.target === d) {
     38    e.target._gotTouchend = true;
     39    ok(true, "Got touchend event on #" + e.target.id);
     40  }
     41 }
     42 
     43 async function test() {
     44  var v = document.getElementById("video");
     45  var d = document.getElementById("div");
     46 
     47  var utils = SpecialPowers.getDOMWindowUtils(window);
     48 
     49  let startHandledPromise = handleTouchStart();
     50  let endHandledPromise = handleTouchEnd();
     51  var pt = await coordinatesRelativeToScreen({ offsetX: 25, offsetY: 5, target: v });
     52  utils.sendNativeTouchPoint(0, SpecialPowers.DOMWindowUtils.TOUCH_CONTACT, pt.x, pt.y, 1, 90, null);
     53  await startHandledPromise;
     54  utils.sendNativeTouchPoint(0, SpecialPowers.DOMWindowUtils.TOUCH_REMOVE, pt.x, pt.y, 1, 90, null);
     55  await endHandledPromise;
     56  ok(v._gotTouchend, "Touchend was received on video element");
     57 
     58  startHandledPromise = handleTouchStart();
     59  endHandledPromise = handleTouchEnd();
     60  pt = await coordinatesRelativeToScreen({ offsetX: 25, offsetY: 5, target: d });
     61  utils.sendNativeTouchPoint(0, SpecialPowers.DOMWindowUtils.TOUCH_CONTACT, pt.x, pt.y, 1, 90, null);
     62  await startHandledPromise;
     63  utils.sendNativeTouchPoint(0, SpecialPowers.DOMWindowUtils.TOUCH_REMOVE, pt.x, pt.y, 1, 90, null);
     64  await endHandledPromise;
     65  ok(d._gotTouchend, "Touchend was received on div element");
     66 }
     67 
     68 waitUntilApzStable()
     69 .then(test)
     70 .then(subtestDone, subtestFailed);
     71 
     72  </script>
     73  <style>
     74    * {
     75      font-size: 24px;
     76      box-sizing: border-box;
     77    }
     78 
     79    #video {
     80      display:block;
     81      position:absolute;
     82      top: 100px;
     83      left:0;
     84      width: 50%;
     85      height: 100px;
     86      border:solid black 1px;
     87      background-color: #8a8;
     88    }
     89 
     90    #div {
     91      display:block;
     92      position:absolute;
     93      top: 100px;
     94      left: 50%;
     95      width: 50%;
     96      height: 100px;
     97      border:solid black 1px;
     98      background-color: #88a;
     99    }
    100  </style>
    101 </head>
    102 <body>
    103 <p>Tap on the colored boxes to hide them.</p>
    104 <video id="video"></video>
    105 <div id="div"></div>
    106 </body>
    107 </html>