tor-browser

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

light-dismiss-event-ordering.tentative.html (2898B)

      1 <!DOCTYPE html>
      2 <link rel=author href="mailto:jarhar@chromium.org">
      3 <link rel=help href="https://chromium-review.googlesource.com/c/chromium/src/+/4023021">
      4 <link rel=help href="https://github.com/whatwg/html/pull/8221#discussion_r1041135388">
      5 <script src="/resources/testharness.js"></script>
      6 <script src="/resources/testharnessreport.js"></script>
      7 <script src="/resources/testdriver.js"></script>
      8 <script src="/resources/testdriver-vendor.js"></script>
      9 <script src="/resources/testdriver-actions.js"></script>
     10 <script src="resources/popover-utils.js"></script>
     11 
     12 <button id=target>target</button>
     13 <div id=popover popover=auto>popover</div>
     14 
     15 <script>
     16 for (const capture of [true, false]) {
     17  for (const eventName of ['pointerdown', 'pointerup', 'mousedown', 'mouseup', 'click']) {
     18    promise_test(async t => {
     19      t.add_cleanup(() => {
     20        try {
     21          popover.hidePopover();
     22        } catch {}
     23      });
     24 
     25      popover.showPopover();
     26      document.addEventListener(eventName, event => {
     27        event.preventDefault();
     28      }, {capture, once: true});
     29      // Click away from the popover to activate light dismiss.
     30      await clickOn(target);
     31      assert_equals(document.querySelectorAll(':popover-open').length, 0,
     32        'The popover should be closed via light dismiss even when preventDefault is called.');
     33 
     34      popover.showPopover();
     35      document.addEventListener(eventName, event => {
     36        event.stopPropagation();
     37      }, {capture, once: true});
     38      // Click away from the popover to activate light dismiss.
     39      await clickOn(target);
     40      assert_equals(document.querySelectorAll(':popover-open').length, 0,
     41        'The popover should be closed via light dismiss even when stopPropagation is called.');
     42 
     43    }, `Tests the interactions between popover light dismiss and pointer/mouse events. eventName: ${eventName}, capture: ${capture}`);
     44  }
     45 }
     46 
     47 promise_test(async t => {
     48  t.add_cleanup(() => {
     49    try {
     50      popover.hidePopover();
     51    } catch {}
     52  });
     53  popover.showPopover();
     54 
     55  const expectedEvents = [
     56    'pointerdown',
     57    'mousedown',
     58    'pointerup',
     59    'mouseup',
     60    'beforetoggle newState: closed',
     61    'click'
     62  ];
     63  const events = [];
     64 
     65  for (const eventName of ['pointerdown', 'pointerup', 'mousedown', 'mouseup', 'click']) {
     66    document.addEventListener(eventName, () => events.push(eventName));
     67  }
     68  popover.addEventListener('beforetoggle', event => {
     69    events.push('beforetoggle newState: ' + event.newState);
     70  });
     71 
     72  // Click away from the popover to activate light dismiss.
     73  await clickOn(target);
     74 
     75  assert_array_equals(events, expectedEvents,
     76    'pointer and popover events should be fired in the correct order.');
     77 
     78  assert_equals(document.querySelectorAll(':popover-open').length, 0,
     79    'The popover should be closed via light dismiss.');
     80 
     81 }, 'Tests the order of pointer/mouse events during popover light dismiss.');
     82 </script>