tor-browser

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

pointermove-becomes-drag.html (2065B)


      1 <!DOCTYPE html>
      2 <title>Layout Instability: no shift in pointerdown becoming dragging</title>
      3 <link rel="help" href="https://wicg.github.io/layout-instability/" />
      4 <style>
      5 
      6 body { margin: 0; }
      7 #draggable {
      8  top:50px;
      9  left:50px;
     10  width:50px;
     11  height:50px;
     12  background-color:blue;
     13  position:absolute
     14 }
     15 
     16 </style>
     17 <div id="draggable" ></div>
     18 <script src="/resources/testharness.js"></script>
     19 <script src="/resources/testharnessreport.js"></script>
     20 <script src="/resources/testdriver.js"></script>
     21 <script src="/resources/testdriver-actions.js"></script>
     22 <script src="/resources/testdriver-vendor.js"></script>
     23 <script src="resources/util.js"></script>
     24 <script>
     25 
     26 const draggable = document.getElementById("draggable");
     27 draggable.addEventListener('touchmove', function(event) {
     28  let touch = event.targetTouches[0];
     29 
     30  // Move the element when the finger moves.
     31  draggable.style.top = touch.pageY - 25 + 'px';
     32  event.preventDefault();
     33 }, false);
     34 
     35 generateTouchDragSequence = () => new test_driver.Actions()
     36    .addPointer("touch1", "touch")
     37    .pointerMove(0, 0, {origin: draggable})
     38    .pointerDown()
     39    .pointerMove(0, 15, {origin: draggable})
     40    .pause(100)
     41    .pointerMove(0, 30, {origin: draggable})
     42    .pause(100)
     43    .pointerMove(0, 45, {origin: draggable})
     44    .pause(100)
     45    .pointerUp()
     46    .pause(100);
     47 
     48 promise_test(async(test) => {
     49  const watcher = new ScoreWatcher;
     50  let eventWatcher = new EventWatcher(test, draggable, ["pointerup"]);
     51  let donePromise = eventWatcher.wait_for(["pointerup"], { record: 'all' });
     52 
     53  // Wait for the initial render to complete.
     54  await waitForAnimationFrames(2);
     55 
     56  // Send pointer events for a touch drag.
     57  await generateTouchDragSequence().send();
     58 
     59  // wait for pointerUp before running the test
     60  await donePromise;
     61 
     62  // Touch moves which drag the objects should be counted as the excluding inputs
     63  // for the layout shift.
     64  assert_greater_than(watcher.score, 0);
     65  assert_equals(watcher.scoreWithInputExclusion, 0);
     66 
     67 }, "No Shift in pointerdown reported when it becomes a touch drag.");
     68 
     69 </script>