{"ScriptPreparationCode":"const section = document.getElementById(\u0022section\u0022);\r\n\r\nsection.style.setProperty(\u0027--translation\u0027, \u0027100\u0027);\r\nsection.style.setProperty(\u0027--translationPx\u0027, \u0027100px\u0027);\r\nsection.style.setProperty(\u0027--translationPercentage\u0027, \u0027100%\u0027);\r\n\r\n\r\nfor (var i = 0; i \u003C 1000; i\u002B\u002B) {\r\n const newDiv = document.createElement(\u0022div\u0022);\r\n const text = document.createTextNode(\u0060${i}\u0060);\r\n newDiv.appendChild(text);\r\n section.appendChild(newDiv);\r\n}\r\n\r\nvar nodes = document.querySelectorAll(\u0022div\u0022);","TestCases":[{"Name":"var(unitless) \u002B calc() \u002B %","Code":"for (var i = 0; i \u003C nodes.length; i\u002B\u002B) {\r\n nodes[i].style = \u0022transform: translateY(calc(var(--translation) * 1%))\u0022\r\n}","IsDeferred":false},{"Name":"var(%) ","Code":"for (var i = 0; i \u003C nodes.length; i\u002B\u002B) {\r\n nodes[i].style = \u0022transform: translateY(var(--translationPercent))\u0022\r\n}","IsDeferred":false},{"Name":"Percentage","Code":"for (var i = 0; i \u003C nodes.length; i\u002B\u002B) {\r\n nodes[i].style = \u0022transform: translateY(100%)\u0022\r\n}","IsDeferred":false},{"Name":"var(unitless) \u002B calc() \u002B px","Code":"for (var i = 0; i \u003C nodes.length; i\u002B\u002B) {\r\n nodes[i].style = \u0022transform: translateY(calc(var(--translation) * 1px))\u0022\r\n}","IsDeferred":false},{"Name":"px","Code":"for (var i = 0; i \u003C nodes.length; i\u002B\u002B) {\r\n nodes[i].style = \u0022transform: translateY(100px)\u0022\r\n}","IsDeferred":false},{"Name":"var(px) ","Code":"for (var i = 0; i \u003C nodes.length; i\u002B\u002B) {\r\n nodes[i].style = \u0022transform: translateY(var(--translationPx))\u0022\r\n}","IsDeferred":false}]}