select-appearance-custom-button.html (822B)
1 <!DOCTYPE html> 2 <html class=reftest-wait> 3 <meta name=fuzzy content="maxDifference=0-3;totalPixels=0-1"> 4 <link rel=author href="mailto:jarhar@chromium.org"> 5 <link rel=help href="https://github.com/whatwg/html/issues/9799"> 6 <link rel=match href="select-appearance-button-ref.html"> 7 <script src="/resources/testdriver.js"></script> 8 <script src="/resources/testdriver-vendor.js"></script> 9 10 <style> 11 select, select::picker(select) { 12 appearance: base-select; 13 } 14 </style> 15 16 <select> 17 <button>one</button> 18 <option>one</option> 19 <option>two</option> 20 </select> 21 22 <script> 23 (async () => { 24 await new Promise(requestAnimationFrame); 25 await test_driver.bless(); 26 document.querySelector('select').showPicker(); 27 await new Promise(requestAnimationFrame); 28 document.documentElement.classList.remove('reftest-wait'); 29 })(); 30 </script>