popover-open-in-beforetoggle.html (2711B)
1 <!DOCTYPE html> 2 <meta charset="utf-8" /> 3 <title>Popover beforetoggle event opening new popovers</title> 4 <link rel="author" href="mailto:masonf@chromium.org"> 5 <link rel=help href="https://html.spec.whatwg.org/multipage/indices.html#event-beforetoggle"> 6 <script src="/resources/testharness.js"></script> 7 <script src="/resources/testharnessreport.js"></script> 8 <script src="/resources/testdriver.js"></script> 9 <script src="/resources/testdriver-actions.js"></script> 10 <script src="/resources/testdriver-vendor.js"></script> 11 <script src="resources/popover-utils.js"></script> 12 13 <div popover id=p1>Popover 1 14 <div popover id=p2>Popover 2 15 <div popover id=p3>Popover 3</div> 16 </div> 17 </div> 18 <div id=outside>Outside</div> 19 <dialog id=dialog>Dialog</dialog> 20 21 <script> 22 function getSignal(t) { 23 const controller = new AbortController(); 24 t.add_cleanup(() => controller.abort()); 25 return controller.signal; 26 } 27 28 test((t) => { 29 p1.showPopover(); 30 p1.addEventListener('beforetoggle',() => p2.showPopover(),{signal: getSignal(t)}); 31 p1.hidePopover(); // Potential crash here 32 assert_false(p1.matches(':popover-open')); 33 assert_false(p2.matches(':popover-open')); 34 },'Open popover from closing beforetoggle event'); 35 36 test((t) => { 37 p1.showPopover(); 38 p1.addEventListener('beforetoggle',() => p2.showPopover(),{signal: getSignal(t)}); 39 p2.addEventListener('beforetoggle',() => p3.showPopover(),{signal: getSignal(t)}); 40 p1.hidePopover(); // Potential crash here 41 assert_false(p1.matches(':popover-open')); 42 assert_false(p2.matches(':popover-open')); 43 assert_false(p3.matches(':popover-open')); 44 },'Open double-nested popovers from closing beforetoggle event'); 45 46 test(t => { 47 p1.showPopover(); 48 p1.addEventListener('beforetoggle',() => p2.showPopover(),{signal: getSignal(t)}); 49 p2.addEventListener('beforetoggle',() => p3.showPopover(),{signal: getSignal(t)}); 50 dialog.showModal(); // Potential crash here 51 assert_false(p1.matches(':popover-open')); 52 assert_false(p2.matches(':popover-open')); 53 assert_false(p3.matches(':popover-open')); 54 dialog.close(); 55 },'Open double-nested popovers from closing beforetoggle event, dialog open'); 56 57 promise_test(async t => { 58 p1.showPopover(); 59 p1.addEventListener('beforetoggle',() => p2.showPopover(),{signal: getSignal(t)}); 60 p2.addEventListener('beforetoggle',() => p3.showPopover(),{signal: getSignal(t)}); 61 await clickOn(outside); // Potential crash here 62 assert_false(p1.matches(':popover-open')); 63 assert_false(p2.matches(':popover-open')); 64 assert_false(p3.matches(':popover-open')); 65 },'Open double-nested popovers from closing beforetoggle event, light dismiss'); 66 </script>