registered-property-value-009.https.html (1378B)
1 <!DOCTYPE html> 2 <html class="reftest-wait"> 3 <title>Values of <length-percentage>-properties reach worklet</title> 4 <link rel="help" href="https://drafts.css-houdini.org/css-paint-api/"> 5 <link rel="match" href="parse-input-arguments-ref.html"> 6 <script src="/common/reftest-wait.js"></script> 7 <script src="/common/worklet-reftest.js"></script> 8 <script src="./resources/utils.js"></script> 9 <body> 10 <div id="target"></div> 11 <script> 12 try { 13 CSS.registerProperty({ 14 name: '--prop-1', 15 syntax: '<length-percentage>', 16 initialValue: '0', 17 inherits: false 18 }); 19 20 CSS.registerProperty({ 21 name: '--prop-2', 22 syntax: '<length-percentage>', 23 initialValue: '0', 24 inherits: false 25 }); 26 27 CSS.registerProperty({ 28 name: '--prop-3', 29 syntax: '<length-percentage>', 30 initialValue: '0', 31 inherits: false 32 }); 33 34 target.style.setProperty('--prop-1', '10%'); 35 target.style.setProperty('--prop-2', '10px'); 36 target.style.setProperty('--prop-3', 'calc(10% + 10px)'); 37 38 expectWorkletValues(target, { 39 '--prop-1': ['[CSSUnitValue 10%]'], 40 '--prop-2': ['[CSSUnitValue 10px]'], 41 '--prop-3': ['[CSSMathSum calc(10% + 10px)]'], 42 }); 43 } catch(e) { 44 document.body.textContent = e; 45 takeScreenshot(); 46 } 47 </script> 48 </body> 49 </html>