<!DOCTYPE html> <meta charset="utf-8"> <title>Declarations trim whitespace from their beginning/ending</title> <meta name="author" title="Tab Atkins-Bittner"> <link rel=help href="https://drafts.csswg.org/css-syntax/#consume-declaration"> <script src="/resources/testharness.js"></script> <script src="/resources/testharnessreport.js"></script> <body> <div id="log"></div> <style id="style-el"> #foo { --foo-1:bar; --foo-2: bar; --foo-3:bar ; --foo-4: bar ; --foo-5: bar !important; --foo-6: bar !important ; --foo-7:bar!important; --foo-8:bar!important ; --foo-9:bar } </style> <p id=foo>foo</p> <script> let stylesheet = getComputedStyle(document.querySelector("#foo")); let canonical = "bar"; test(function() { assert_equals(stylesheet.getPropertyValue("--foo-1"), canonical); }, "--foo-1:bar;"); test(function() { assert_equals(stylesheet.getPropertyValue("--foo-2"), canonical); }, "--foo-2: bar;"); test(function() { assert_equals(stylesheet.getPropertyValue("--foo-3"), canonical); }, "--foo-3:bar ;"); test(function() { assert_equals(stylesheet.getPropertyValue("--foo-4"), canonical); }, "--foo-4: bar ;"); test(function() { assert_equals(stylesheet.getPropertyValue("--foo-5"), canonical); }, "--foo-5: bar !important;"); test(function() { assert_equals(stylesheet.getPropertyValue("--foo-6"), canonical); }, "--foo-6: bar !important ;"); test(function() { assert_equals(stylesheet.getPropertyValue("--foo-7"), canonical); }, "--foo-7:bar!important;"); test(function() { assert_equals(stylesheet.getPropertyValue("--foo-8"), canonical); }, "--foo-8:bar!important ;"); test(function() { assert_equals(stylesheet.getPropertyValue("--foo-9"), canonical); }, "--foo-9:bar (then ws until end of rule)"); </script>