popover-minimum-role.html (1922B)
1 <!DOCTYPE html> 2 <meta charset="utf-8" /> 3 <title>Popover minimum role</title> 4 <link rel="author" href="mailto:masonf@chromium.org"> 5 <link rel=help href="https://www.w3.org/TR/html-aam-1.0/#att-popover"> 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-vendor.js"></script> 10 <script src="resources/popover-utils.js"></script> 11 12 <body> 13 <script> 14 async function assertRoleEquals(element,expectedRole,message) { 15 const actualRole = await test_driver.get_computed_role(element); 16 assert_equals(actualRole,expectedRole,message); 17 } 18 function initPopover(t) { 19 const popover = document.createElement('div'); 20 t.add_cleanup(() => popover.remove()); 21 document.body.appendChild(popover); 22 popover.popover = 'auto'; 23 return popover; 24 } 25 promise_test(async (t) => { 26 const popover = initPopover(t); 27 await assertRoleEquals(popover,'none','role starts as none'); 28 popover.showPopover(); 29 await assertRoleEquals(popover,'group','When the popover is showing, minimum role is group'); 30 },'The popover attribute, on an element with no implicit role, then the element\'s role instead maps to group.'); 31 32 promise_test(async (t) => { 33 const popover = initPopover(t); 34 await assertRoleEquals(popover,'none','role starts as none'); 35 popover.style='display:block'; // Force visible 36 assert_true(isElementVisible(popover),'element is visible due to display:block'); 37 await assertRoleEquals(popover,'group','With popover attribute, when visible (even before showPopover()), role is group'); 38 popover.showPopover(); 39 await assertRoleEquals(popover,'group','When showing as a popover, role is still group'); 40 popover.removeAttribute('style'); 41 await assertRoleEquals(popover,'group','Including with style rule removed'); 42 },'Dynamic changes to popover attribute should change the role.'); 43 </script>