summaryrefslogtreecommitdiffstats
path: root/layout/style/test/test_priority_preservation.html
blob: 080a4651c767a81a0d3368cfec074b396b1b4a2d (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
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
<!DOCTYPE HTML>
<html>
<head>
  <title>Test for property priority preservation</title>
  <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
</head>
<body>
<p id="display"></p>
<div id="content" style="display: none">
  
</div>
<pre id="test">
<script type="application/javascript">

/**
 * Test that priorities are preserved correctly when setProperty is
 * called, and during declaration block expansion/compression when other
 * properties are manipulated.
 */

var div = document.getElementById("content");
var s = div.style;

s.setProperty("text-decoration", "underline", "");
is(s.getPropertyValue("text-decoration"), "underline",
   "text-decoration stored");
is(s.getPropertyPriority("text-decoration"), "",
   "text-decoration priority stored");
s.setProperty("z-index", "7", "important");
is(s.getPropertyValue("z-index"), "7",
   "z-index stored");
is(s.getPropertyPriority("z-index"), "important",
   "z-index priority stored");
s.setProperty("z-index", "3", "");
is(s.getPropertyValue("z-index"), "3",
   "z-index overridden by setting non-important");
is(s.getPropertyPriority("z-index"), "",
   "z-index priority overridden by setting non-important");
is(s.getPropertyValue("text-decoration"), "underline",
   "text-decoration still stored");
is(s.getPropertyPriority("text-decoration"), "",
   "text-decoration priority still stored");
s.setProperty("text-decoration", "overline", "");
is(s.getPropertyValue("text-decoration"), "overline",
   "text-decoration stored");
is(s.getPropertyPriority("text-decoration"), "",
   "text-decoration priority stored");
is(s.getPropertyValue("z-index"), "3",
   "z-index still stored");
is(s.getPropertyPriority("z-index"), "",
   "z-index priority still stored");
s.setProperty("text-decoration", "line-through", "important");
is(s.getPropertyValue("text-decoration"), "line-through",
   "text-decoration stored at new priority");
is(s.getPropertyPriority("text-decoration"), "important",
   "text-decoration priority overridden");
is(s.getPropertyValue("z-index"), "3",
   "z-index still stored");
is(s.getPropertyPriority("z-index"), "",
   "z-index priority still stored");

  // also test setting a shorthand
s.setProperty("font", "italic bold 12px/30px serif", "important");
is(s.getPropertyValue("font-style"), "italic", "font-style stored");
is(s.getPropertyPriority("font-style"), "important",
   "font-style priority stored");
is(s.getPropertyValue("font-weight"), "bold", "font-weight stored");
is(s.getPropertyPriority("font-weight"), "important",
   "font-weight priority stored");
is(s.getPropertyValue("font-size"), "12px", "font-size stored");
is(s.getPropertyPriority("font-size"), "important",
   "font-size priority stored");
is(s.getPropertyValue("line-height"), "30px", "line-height stored");
is(s.getPropertyPriority("line-height"), "important",
   "line-height priority stored");
is(s.getPropertyValue("font-family"), "serif", "font-family stored");
is(s.getPropertyPriority("font-family"), "important",
   "font-family priority stored");

is(s.getPropertyValue("text-decoration"), "line-through",
   "text-decoration still stored");
is(s.getPropertyPriority("text-decoration"), "important",
   "text-decoration priority still stored");
is(s.getPropertyValue("z-index"), "3",
   "z-index still stored");
is(s.getPropertyPriority("z-index"), "",
   "z-index priority still stored");

  // and overriding one element of that shorthand with some longhand
  // test omitting the third argument to setProperty too (bug 655478)
s.setProperty("font-style", "normal");

is(s.getPropertyValue("font-style"), "normal", "font-style overridden");
is(s.getPropertyPriority("font-style"), "", "font-style priority overridden");

is(s.getPropertyValue("font-weight"), "bold", "font-weight unchanged");
is(s.getPropertyPriority("font-weight"), "important",
   "font-weight priority unchanged");
is(s.getPropertyValue("font-size"), "12px", "font-size unchanged");
is(s.getPropertyPriority("font-size"), "important",
   "font-size priority unchanged");
is(s.getPropertyValue("line-height"), "30px", "line-height unchanged");
is(s.getPropertyPriority("line-height"), "important",
   "line-height priority unchanged");
is(s.getPropertyValue("font-family"), "serif", "font-family unchanged");
is(s.getPropertyPriority("font-family"), "important",
   "font-family priority unchanged");

is(s.getPropertyValue("text-decoration"), "line-through",
   "text-decoration still stored");
is(s.getPropertyPriority("text-decoration"), "important",
   "text-decoration priority still stored");
is(s.getPropertyValue("z-index"), "3",
   "z-index still stored");
is(s.getPropertyPriority("z-index"), "",
   "z-index priority still stored");

s.setProperty("border-radius", "2em", "");
is(s.getPropertyValue("border-radius"), "2em",
   "border-radius serialization 1")

s.setProperty("border-top-left-radius", "3em 4em", "");
is(s.getPropertyValue("border-radius"),
   "3em 2em 2em / 4em 2em 2em",
   "border-radius serialization 2");

s.setProperty("border-radius", "2em / 3em", "");
is(s.getPropertyValue("border-radius"),
   "2em / 3em",
   "border-radius serialization 3")

s.setProperty("border-top-left-radius", "4em", "");
is(s.getPropertyValue("border-radius"),
   "4em 2em 2em / 4em 3em 3em",
   "border-radius serialization 3");

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