summaryrefslogtreecommitdiffstats
path: root/layout/style/test/test_text_decoration_shorthands.html
blob: aff21e1d8e3f3cb32b71c0891f83fe367185c632 (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
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
<!DOCTYPE html>
<html>
<head>
  <meta charset=utf-8>
  <title>Test parsing of text-decoration shorthands</title>
  <script src="/resources/testharness.js"></script>
  <script src="/resources/testharnessreport.js"></script>
  <link rel='stylesheet' href='/resources/testharness.css'>
</head>
<body>

<script>

var initial_values = {
    textDecorationColor: "rgb(255, 0, 255)",
    textDecorationLine: "none",
    textDecorationStyle: "solid",
};

// For various specified values of the text-decoration shorthand,
// test the computed values of the corresponding longhands.
var text_decoration_test_cases = [
    {
        specified: "none",
    },
    {
        specified: "red",
        textDecorationColor: "rgb(255, 0, 0)",
    },
    {
        specified: "line-through",
        textDecorationLine: "line-through",
    },
    {
        specified: "dotted",
        textDecorationStyle: "dotted",
    },
    {
        specified: "#00ff00 underline",
        textDecorationColor: "rgb(0, 255, 0)",
        textDecorationLine: "underline",
    },
    {
        specified: "#ffff00 wavy",
        textDecorationColor: "rgb(255, 255, 0)",
        textDecorationStyle: "wavy",
    },
    {
        specified: "overline double",
        textDecorationLine: "overline",
        textDecorationStyle: "double",
    },
    {
        specified: "red underline solid",
        textDecorationColor: "rgb(255, 0, 0)",
        textDecorationLine: "underline",
        textDecorationStyle: "solid",
    },
    {
        specified: "double overline blue",
        textDecorationColor: "rgb(0, 0, 255)",
        textDecorationLine: "overline",
        textDecorationStyle: "double",
    },
];

function run_tests(test_cases, shorthand, subproperties) {
    test_cases.forEach(function(test_case) {
        test(function() {
            var element = document.createElement('div');
            document.body.appendChild(element);
            // Set text color to test initial value of text-decoration-color
            // (currentColor).
            element.style.color = "#ff00ff";
            element.style[shorthand] = test_case.specified;
            var computed = window.getComputedStyle(element);
            subproperties.forEach(function(longhand) {
                assert_equals(
                    computed[longhand],
                    test_case[longhand] || initial_values[longhand],
                    longhand
                );
            });
        }, "test parsing of 'text-decoration: " + test_case.specified + "'");
    });
}

run_tests(text_decoration_test_cases, "textDecoration", [
    "textDecorationColor", "textDecorationLine", "textDecorationStyle"]);

</script>
</body>
</html>