test_variables_loop.html (720B)
1 <!DOCTYPE html> 2 <title>CSS variables loop resolving</title> 3 <script src="/tests/SimpleTest/SimpleTest.js"></script> 4 <link rel="stylesheet" href="/tests/SimpleTest/test.css" type="text/css"> 5 <style id="test"> 6 #outer { 7 --a: a; 8 --b: b; 9 --c: c; 10 --d: d; 11 --e: e; 12 } 13 #inner { 14 --a: var(--d, ad); 15 --b: var(--d, ad); 16 --c: var(--d, ad); 17 --d: var(--e, de); 18 --e: var(--a, ea) var(--b, eb) var(--c, ec); 19 } 20 </style> 21 <div id="outer"> 22 <div id="inner"></div> 23 </div> 24 <script> 25 let inner_cs = getComputedStyle(document.getElementById("inner")); 26 for (let v of ['a', 'b', 'c', 'd', 'e']) { 27 is(inner_cs.getPropertyValue(`--${v}`), "", 28 `Variable --${v} should be eliminated`); 29 } 30 </script>