fullscreen-css-invalidation.html (987B)
1 <!DOCTYPE html> 2 <title>Invalidate :fullscreen based style</title> 3 <script src="/resources/testharness.js"></script> 4 <script src="/resources/testharnessreport.js"></script> 5 <script src="/resources/testdriver.js"></script> 6 <script src="/resources/testdriver-vendor.js"></script> 7 <style> 8 #pass { 9 color: red; 10 } 11 :root:fullscreen #pass { 12 color: green; 13 } 14 </style> 15 <div id="pass">Should be green</div> 16 <script> 17 async_test(t => { 18 document.onfullscreenchange = t.step_func_done(() => { 19 assert_equals(document.fullscreenElement, document.documentElement); 20 assert_equals(getComputedStyle(pass).color, "rgb(0, 128, 0)", "Green when :root is fullscreened."); 21 }); 22 document.documentElement.addEventListener('click', t.step_func(() => { 23 document.documentElement.requestFullscreen(); 24 }), {once: true}); 25 assert_equals(getComputedStyle(pass).color, "rgb(255, 0, 0)", "Initially red."); 26 test_driver.click(document.documentElement); 27 }); 28 </script>