if-style-invalidation.html (975B)
1 <!DOCTYPE html> 2 <title>CSS Values and Units Test: if() style() condition invalidation</title> 3 <meta name="assert" content="Test if() style() condition invalidation"> 4 <link rel="help" href="https://drafts.csswg.org/css-values-5/#if-notation"> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 <style> 8 html { 9 --x: 3; 10 } 11 #test { 12 --prop: if(style(--x: 3): true_value; else: false_value;); 13 } 14 </style> 15 16 <html> 17 <body> 18 <div id="test"></div> 19 </body> 20 </html> 21 22 <script> 23 setup({ single_test: true }); 24 let elem = document.getElementById('test'); 25 let old_value = window.getComputedStyle(elem).getPropertyValue('--prop'); 26 assert_equals(old_value, "true_value"); 27 28 document.documentElement.style.setProperty('--x', '0'); 29 let new_value = window.getComputedStyle(elem).getPropertyValue('--prop'); 30 assert_equals( new_value, "false_value"); 31 assert_not_equals(new_value, old_value); 32 done(); 33 </script>