select-appearance-switching-invalidation.html (943B)
1 <!DOCTYPE html> 2 <html class=reftest-wait> 3 <meta name=fuzzy content="maxDifference=0-41;totalPixels=0-2"> 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-switching-invalidation-ref.html"> 7 <script src="/resources/testdriver.js"></script> 8 <script src="/resources/testdriver-vendor.js"></script> 9 10 <style> 11 .blue { 12 color: blue; 13 } 14 select.base, select.base::picker(select) { 15 appearance: base-select; 16 } 17 </style> 18 19 <select> 20 <button>button</button> 21 <option> 22 <span class=blue>option</span> one 23 </option> 24 <option> 25 <span class=blue>option</span> two 26 </option> 27 </select> 28 29 <script> 30 requestAnimationFrame(async () => { 31 await test_driver.bless(); 32 const select = document.querySelector('select'); 33 select.classList.add('base'); 34 select.showPicker(); 35 document.documentElement.classList.remove('reftest-wait'); 36 }); 37 </script>