summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/css/cssom/serialization-CSSDeclaration-with-important.html
blob: 804885a74a17f23e18f4c073099c26b2e9f80532 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<!doctype html>
<meta charset=utf-8>
<title>cssom - Serialization of CSS declaration with "important" flag</title>
<link rel="help" href="https://drafts.csswg.org/cssom/#serialize-a-css-declaration">
<script src=/resources/testharness.js></script>
<script src=/resources/testharnessreport.js></script>
<div id="noWhitespace" style="display: inline !important;"></div>
<div id="whitespace" style="background-color: blue !important; color: red ! important;"></div>
<div id="dinamicallyStyle"></div>
<script>
    test(function () {
        var css_style = document.querySelector('#noWhitespace').style.cssText;
        assert_equals(css_style, "display: inline !important;");
    }, "Inline style declaration without whitespace between '!' and 'important'.");

    test(function () {
        var css_style = document.querySelector('#whitespace').style.cssText;
        assert_equals(css_style, "background-color: blue !important; color: red !important;");
    }, "Inline style declaration with whitespace between '!' and 'important'.");

    test(function () {
        document.querySelector('#dinamicallyStyle').style.cssText = "color: black !important;";
        var css_style = document.querySelector('#dinamicallyStyle').style.cssText;
        assert_equals(css_style, "color: black !important;");
    }, "Style set dynamically via cssText without whitespace between '!' and 'important'.");

    test(function () {
        document.querySelector('#dinamicallyStyle').style.cssText = "color: black ! important;";
        var css_style = document.querySelector('#dinamicallyStyle').style.cssText;
        assert_equals(css_style, "color: black !important;");
    }, "Style set dynamically via cssText with whitespace between '!' and 'important'.");
</script>