tor-browser

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

click-order.html (2514B)


      1 <!DOCTYPE html>
      2 <html>
      3  <head>
      4    <meta charset="utf-8">
      5    <title>Click-related events should fire in the correct order</title>
      6    <link rel="help" href="https://w3c.github.io/uievents/#events-clickevent-event-order">
      7    <script src="/resources/testharness.js"></script>
      8    <script src="/resources/testharnessreport.js"></script>
      9    <script src="/resources/testdriver.js"></script>
     10    <script src="/resources/testdriver-actions.js"></script>
     11    <script src="/resources/testdriver-vendor.js"></script>
     12    <script src="/uievents/resources/eventrecorder.js"></script>
     13  </head>
     14  <body>
     15    <ol>
     16      <li>Double-click into the blue area.</li>
     17      <li>Click the "Done" button.</li>
     18    </ol>
     19    <div id="blue" style="width:400px; height:300px; background-color: blue;"></div>
     20    <button type="button" id="done">Done</button>
     21 </body>
     22 <script>
     23 setup({explicit_timeout: true});
     24 
     25 function bubbles(e) {
     26  assert_true(e.bubbles);
     27 }
     28 
     29 var relevantEvents = [
     30  "mousedown",
     31  "mouseup",
     32  "mousemove",
     33  "click",
     34  "dblclick"
     35 ];
     36 
     37 window.onload = async function () {
     38  var blue = document.getElementById("blue");
     39  var button = document.getElementById("done");
     40  var inputs = [blue];
     41  EventRecorder.configure({
     42    mergeEventTypes: ["mousemove"],
     43    objectMap: {
     44      "blue": blue
     45    }
     46  });
     47 
     48  EventRecorder.addEventListenersForNodes(relevantEvents, inputs, bubbles);
     49  var expected = [
     50    {type: "mousemove", target: "blue", optional: true},
     51    {type: "mousedown", target: "blue"},
     52    {type: "mousemove", target: "blue", optional: true},
     53    {type: "mouseup", target: "blue"},
     54    {type: "click", target: "blue"},
     55    {type: "mousemove", target: "blue", optional: true},
     56    {type: "mousedown", target: "blue"},
     57    {type: "mousemove", target: "blue", optional: true},
     58    {type: "mouseup", target: "blue"},
     59    {type: "click", target: "blue"},
     60    {type: "dblclick", target: "blue"},
     61    {type: "mousemove", target: "blue", optional: true}
     62  ];
     63 
     64  async_test(function(t) {
     65    button.addEventListener("click", function () {
     66      t.step(function () {
     67        assert_true(EventRecorder.checkRecords(expected));
     68        t.done();
     69      });
     70    }, false);
     71  }, "Click-related events should fire in the correct order");
     72  EventRecorder.start();
     73 
     74  await new test_driver.Actions()
     75    .pointerMove(0, 0, {origin: blue})
     76    .pointerDown()
     77    .pointerUp()
     78    .pointerDown()
     79    .pointerUp()
     80    .pointerMove(0, 0, {origin: button})
     81    .pointerDown()
     82    .pointerUp()
     83    .send();
     84 };
     85    </script>
     86 </html>