select-option-focusable.tentative.html (1484B)
1 <!DOCTYPE html> 2 <html lang="en"> 3 <title>select element: option focusable</title> 4 <link rel="author" title="Ionel Popescu" href="mailto:iopopesc@microsoft.com"> 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-actions.js"></script> 9 <script src="/resources/testdriver-vendor.js"></script> 10 11 <select id="select0"> 12 <option>one</option> 13 <option id="select0-option2">two</option> 14 <option>three</option> 15 </select> 16 17 <style> 18 select, ::picker(select) { 19 appearance: base-select; 20 } 21 </style> 22 23 <script> 24 function clickOn(element) { 25 const actions = new test_driver.Actions(); 26 return actions.pointerMove(0, 0, {origin: element}) 27 .pointerDown({button: actions.ButtonType.LEFT}) 28 .pointerUp({button: actions.ButtonType.LEFT}) 29 .send(); 30 } 31 32 promise_test(async t => { 33 const select = document.querySelector("#select0"); 34 assert_false(select.matches(':open'), "select should not be initially open"); 35 36 await clickOn(select); 37 assert_true(select.matches(':open')); 38 assert_equals(select.value, "one"); 39 40 const option2 = document.querySelector('#select0-option2'); 41 option2.focus(); 42 assert_equals(document.activeElement, option2); 43 44 const kEnter = '\uE007'; 45 await test_driver.send_keys(option2, kEnter); 46 assert_equals(select.value, "two"); 47 }, "Validate <option> is focusable when is a descendant of <select>"); 48 </script>