| <!DOCTYPE html> |
| <meta charset="utf-8"> |
| <title>calc() expressions with parentheses</title> |
| <link rel="help" href="https://drafts.csswg.org/css-values-4/#calc-func"> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <!-- Regression test for https://github.com/jsdom/jsdom/issues/3538 --> |
| |
| <p id="p1" style="width: calc(1px);"></p> |
| <p id="p2" style="width: calc((1px));"></p> |
| <p id="p3" style="width: calc(1px + 4px);"></p> |
| <p id="p4" style="width: calc(1px + (4px));"></p> |
| <p id="p5" style="width: calc(1px + 4px / 2);"></p> |
| <p id="p6" style="width: calc(1px + (7px - 3px) / 2);"></p> |
| |
| <script> |
| "use strict"; |
| |
| test(() => { |
| const style = window.getComputedStyle(document.getElementById("p1")); |
| assert_equals(style.width, "1px"); |
| }, "calc(1px)"); |
| |
| test(() => { |
| const style = window.getComputedStyle(document.getElementById("p2")); |
| assert_equals(style.width, "1px"); |
| }, "calc((1px))"); |
| |
| test(() => { |
| const style = window.getComputedStyle(document.getElementById("p3")); |
| assert_equals(style.width, "5px"); |
| }, "calc(1px + 4px)"); |
| |
| test(() => { |
| const style = window.getComputedStyle(document.getElementById("p4")); |
| assert_equals(style.width, "5px"); |
| }, "calc(1px + (4px))"); |
| |
| test(() => { |
| const style = window.getComputedStyle(document.getElementById("p5")); |
| assert_equals(style.width, "3px"); |
| }, "calc(1px + 4px / 2)"); |
| |
| test(() => { |
| const style = window.getComputedStyle(document.getElementById("p6")); |
| assert_equals(style.width, "3px"); |
| }, "calc(1px + (7px - 3px) / 2)"); |
| </script> |
