viewport-units-scroll-no-cycles-001.tentative.html (1335B)
1 <!doctype html> 2 <html> 3 <title>CSS Values and Units Test: Viewport units and scrollbars</title> 4 <link rel="help" href="http://www.w3.org/TR/css3-values/#viewport-relative-lengths"> 5 <link rel="help" href="https://github.com/w3c/csswg-drafts/issues/13189"> 6 <link rel="help" href="https://crbug.com/467164228"> 7 <meta name="assert" content="Ensure that a viewport unit cycle in an if() condition causes the if() to be invalid at computed value time."> 8 <script src="/resources/testharness.js"></script> 9 <script src="/resources/testharnessreport.js"></script> 10 11 <style> 12 iframe { 13 width: 100px; 14 height: 100px; 15 } 16 </style> 17 <iframe id="iframe" srcdoc="<!doctype html> 18 <style> 19 @property --vw-tracker { 20 syntax: '<length>'; 21 initial-value: 0px; 22 inherits: false; 23 } 24 25 :root { 26 --vw-tracker: 100vw; 27 overflow: if( 28 style(--vw-tracker = 100px): scroll; 29 else: hidden; 30 ); 31 } 32 </style> 33 "></iframe> 34 <script> 35 function waitForLoad(w) { 36 return new Promise(resolve => w.addEventListener('load', resolve)); 37 } 38 39 promise_test(async () => { 40 await waitForLoad(window); 41 const root = iframe.contentDocument.documentElement; 42 const win = iframe.contentWindow; 43 const style = win.getComputedStyle(root); 44 // overflow should be its default value of 'visible'. 45 assert_equals(style.overflow, 'visible'); 46 }); 47 </script>