Mark http/tests/websocket/tests/hybi/secure-cookie-secure-connection.pl as a failure...
[WebKit-https.git] / LayoutTests / css3 / parse-align-self.html
1 <!DOCTYPE html>
2 <style>
3 #alignSelfBaseline {
4     align-self: baseline;
5 }
6
7 #alignSelfFirstBaseline {
8     align-self: first baseline;
9 }
10
11 #alignSelfLastBaseline {
12     align-self: last baseline;
13 }
14
15 #alignSelfStretch {
16     align-self: stretch;
17 }
18
19 #alignSelfNormal {
20     align-self: normal;
21 }
22
23 #alignSelfStart {
24     align-self: start;
25 }
26
27 #alignSelfEnd {
28     align-self: end;
29 }
30
31 #alignSelfCenter {
32     align-self: center;
33 }
34
35 #alignSelfSelfStart {
36     align-self: self-start;
37 }
38
39 #alignSelfSelfEnd {
40     align-self: self-end;
41 }
42
43 #alignSelfLeft {
44     align-self: left;
45 }
46
47 #alignSelfRight {
48     align-self: right;
49 }
50
51 #alignSelfFlexStart {
52     align-self: flex-start;
53 }
54
55 #alignSelfFlexEnd {
56     align-self: flex-end;
57 }
58
59 #alignSelfEndUnsafe {
60     align-self: end unsafe;
61 }
62
63 #alignSelfCenterUnsafe {
64     align-self: center unsafe;
65 }
66
67 #alignSelfSelfEndSafe {
68     align-self: self-end safe;
69 }
70
71 #alignSelfSelfStartSafe {
72     align-self: self-start safe;
73 }
74
75 #alignSelfRightSafe {
76     align-self: right safe;
77 }
78
79 #alignSelfLeftUnsafe {
80     align-self: left unsafe;
81 }
82
83 #alignSelfFlexStartUnsafe {
84     align-self: flex-start unsafe;
85 }
86
87 #alignSelfFlexEndSafe {
88     align-self: flex-end safe;
89 }
90 </style>
91 <p>Test that setting and getting align-self works as expected</p>
92 <div id="alignSelfBaseline"></div>
93 <div id="alignSelfFirstBaseline"></div>
94 <div id="alignSelfLastBaseline"></div>
95 <div id="alignSelfStretch"></div>
96 <div id="alignSelfNormal"></div>
97 <div id="alignSelfStart"></div>
98 <div id="alignSelfEnd"></div>
99 <div id="alignSelfCenter"></div>
100 <div id="alignSelfSelfStart"></div>
101 <div id="alignSelfSelfEnd"></div>
102 <div id="alignSelfLeft"></div>
103 <div id="alignSelfRight"></div>
104 <div id="alignSelfFlexStart"></div>
105 <div id="alignSelfFlexEnd"></div>
106
107 <div id="alignSelfEndUnsafe"></div>
108 <div id="alignSelfCenterUnsafe"></div>
109 <div id="alignSelfSelfEndSafe"></div>
110 <div id="alignSelfSelfStartSafe"></div>
111 <div id="alignSelfRightSafe"></div>
112 <div id="alignSelfLeftUnsafe"></div>
113 <div id="alignSelfFlexStartUnsafe"></div>
114 <div id="alignSelfFlexEndSafe"></div>
115 <script src="../resources/testharness.js"></script>
116 <script src="../resources/testharnessreport.js"></script>
117 <script src="resources/alignment-parsing-utils-th.js"></script>
118 <script>
119 test(function() {
120     var alignSelfBaseline = document.getElementById("alignSelfBaseline");
121     checkValues(alignSelfBaseline, "alignSelf", "align-self", "", "baseline");
122     var alignSelfFirstBaseline = document.getElementById("alignSelfFirstBaseline");
123     checkValues(alignSelfFirstBaseline, "alignSelf", "align-self", "", "baseline");
124     var alignSelfLastBaseline = document.getElementById("alignSelfLastBaseline");
125     checkValues(alignSelfLastBaseline, "alignSelf", "align-self", "", "last baseline");
126     var alignSelfStretch = document.getElementById("alignSelfStretch");
127     checkValues(alignSelfStretch, "alignSelf", "align-self", "", "stretch");
128     var alignSelfNormal = document.getElementById("alignSelfNormal");
129     checkValues(alignSelfNormal, "alignSelf", "align-self", "", "normal");
130     var alignSelfStart = document.getElementById("alignSelfStart");
131     checkValues(alignSelfStart, "alignSelf", "align-self", "", "start");
132     var alignSelfEnd = document.getElementById("alignSelfEnd");
133     checkValues(alignSelfEnd, "alignSelf", "align-self", "", "end");
134     var alignSelfCenter = document.getElementById("alignSelfCenter");
135     checkValues(alignSelfCenter, "alignSelf", "align-self", "", "center");
136     var alignSelfSelfEnd = document.getElementById("alignSelfSelfEnd");
137     checkValues(alignSelfSelfEnd, "alignSelf", "align-self", "", "self-end");
138     var alignSelfSelfStart = document.getElementById("alignSelfSelfStart");
139     checkValues(alignSelfSelfStart, "alignSelf", "align-self", "", "self-start");
140     var alignSelfLeft = document.getElementById("alignSelfLeft");
141     checkValues(alignSelfLeft, "alignSelf", "align-self", "", "left");
142     var alignSelfRight = document.getElementById("alignSelfRight");
143     checkValues(alignSelfRight, "alignSelf", "align-self", "", "right");
144     var alignSelfFlexStart = document.getElementById("alignSelfFlexStart");
145     checkValues(alignSelfFlexStart, "alignSelf", "align-self", "", "flex-start");
146     var alignSelfFlexEnd = document.getElementById("alignSelfFlexEnd");
147     checkValues(alignSelfFlexEnd, "alignSelf", "align-self", "", "flex-end");
148
149     var alignSelfEndUnsafe = document.getElementById("alignSelfEndUnsafe");
150     checkValues(alignSelfEndUnsafe, "alignSelf", "align-self", "", "end unsafe");
151     var alignSelfCenterUnsafe = document.getElementById("alignSelfCenterUnsafe");
152     checkValues(alignSelfCenterUnsafe, "alignSelf", "align-self", "", "center unsafe");
153     var alignSelfSelfEndSafe = document.getElementById("alignSelfSelfEndSafe");
154     checkValues(alignSelfSelfEndSafe, "alignSelf", "align-self", "", "self-end safe");
155     var alignSelfSelfStartSafe = document.getElementById("alignSelfSelfStartSafe");
156     checkValues(alignSelfSelfStartSafe, "alignSelf", "align-self", "", "self-start safe");
157     var alignSelfRightSafe = document.getElementById("alignSelfRightSafe");
158     checkValues(alignSelfRightSafe, "alignSelf", "align-self", "", "right safe");
159     var alignSelfLeftUnsafe = document.getElementById("alignSelfLeftUnsafe");
160     checkValues(alignSelfLeftUnsafe, "alignSelf", "align-self", "", "left unsafe");
161     var alignSelfFlexStartUnsafe = document.getElementById("alignSelfFlexStartUnsafe");
162     checkValues(alignSelfFlexStartUnsafe, "alignSelf", "align-self", "", "flex-start unsafe");
163     var alignSelfFlexEndSafe = document.getElementById("alignSelfFlexEndSafe");
164     checkValues(alignSelfFlexEndSafe, "alignSelf", "align-self", "", "flex-end safe");
165 }, "Test getting align-self set through CSS.");
166
167 test(function() {
168     element = document.createElement("div");
169     document.body.appendChild(element);
170     checkValues(element, "alignSelf", "align-self", "", "auto");
171 }, "Test initial value of align-self through JS");
172
173 test(function() {
174     container = document.createElement("div");
175     element = document.createElement("div");
176     container.appendChild(element);
177     document.body.appendChild(container);
178     element.style.alignSelf = "center";
179     checkValues(element, "alignSelf", "align-self",  "center", "center");
180
181     element.style.alignSelf = "unsafe start";
182     checkValues(element, "alignSelf", "align-self",  "start unsafe", "start unsafe");
183
184     element.style.alignSelf = "flex-end safe";
185     checkValues(element, "alignSelf", "align-self",  "flex-end safe", "flex-end safe");
186
187     element.style.alignSelf = "right";
188     checkValues(element, "alignSelf", "align-self",  "right", "right");
189
190     element.style.alignSelf = "center";
191     checkValues(element, "alignSelf", "align-self",  "center", "center");
192
193     element.style.alignSelf = "self-start";
194     checkValues(element, "alignSelf", "align-self",  "self-start", "self-start");
195
196     element.style.alignSelf = "normal";
197     checkValues(element, "alignSelf", "align-self",  "normal", "normal");
198
199     element.style.alignSelf = "auto";
200     checkValues(element, "alignSelf", "align-self",  "auto", "auto");
201
202     container.style.display = "flex";
203     element.style.alignSelf = "auto";
204     checkValues(element, "alignSelf", "align-self",  "auto", "auto");
205
206     container.style.display = "grid";
207     element.style.alignSelf = "auto";
208     checkValues(element, "alignSelf", "align-self",  "auto", "auto");
209
210     element.style.alignSelf = "self-end";
211     checkValues(element, "alignSelf", "align-self",  "self-end", "self-end");
212 }, "Test getting and setting align-self through JS");
213
214 test(function() {
215     document.documentElement.style.alignSelf = "auto";
216     checkValues(document.documentElement, "alignSelf", "align-self",  "auto", "auto");
217 }, "Test 'auto' value resolution for the root node");
218
219 test(function() {
220     container = document.createElement("div");
221     element = document.createElement("div");
222     container.appendChild(element);
223     document.body.appendChild(container);
224
225     checkBadValues(element, "alignSelf", "align-self",  "auto safe");
226     checkBadValues(element, "alignSelf", "align-self",  "auto left");
227     checkBadValues(element, "alignSelf", "align-self",  "normal unsafe");
228     checkBadValues(element, "alignSelf", "align-self",  "normal stretch");
229     checkBadValues(element, "alignSelf", "align-self",  "baseline normal");
230     checkBadValues(element, "alignSelf", "align-self",  "baseline safe");
231     checkBadValues(element, "alignSelf", "align-self",  "baseline center");
232     checkBadValues(element, "alignSelf", "align-self",  "stretch unsafe");
233     checkBadValues(element, "alignSelf", "align-self",  "stretch right");
234     checkBadValues(element, "alignSelf", "align-self",  "unsafe unsafe");
235     checkBadValues(element, "alignSelf", "align-self",  "unsafe safe");
236     checkBadValues(element, "alignSelf", "align-self",  "center start");
237     checkBadValues(element, "alignSelf", "align-self",  "stretch unsafe");
238     checkBadValues(element, "alignSelf", "align-self",  "safe stretch");
239     checkBadValues(element, "alignSelf", "align-self",  "baseline safe");
240     checkBadValues(element, "alignSelf", "align-self",  "unsafe baseline");
241     checkBadValues(element, "alignSelf", "align-self",  "unsafe safe left");
242     checkBadValues(element, "alignSelf", "align-self",  "unsafe left safe");
243     checkBadValues(element, "alignSelf", "align-self",  "left safe unsafe safe");
244     checkBadValues(element, "alignSelf", "align-self",  "legacy start");
245     checkBadValues(element, "alignSelf", "align-self",  "legacy end");
246     checkBadValues(element, "alignSelf", "align-self",  "legacy right unsafe");
247     checkBadValues(element, "alignSelf", "align-self",  "legacy auto");
248     checkBadValues(element, "alignSelf", "align-self",  "legacy stretch");
249     checkBadValues(element, "alignSelf", "align-self",  "legacy");
250     checkBadValues(element, "alignSelf", "align-self",  "legacy left right");
251 }, "Test bad combinations of align-self");
252
253 test(function() {
254     container.style.display = "";
255     checkInitialValues(element, "alignSelf", "align-self", "center", "auto");
256 }, "Test the value 'initial'");
257
258 test(function() {
259     container.style.display = "grid";
260     checkInitialValues(element, "alignSelf", "align-self", "left safe", "auto");
261 }, "Test the value 'initial' for grid containers");
262
263 test(function() {
264     container.style.display = "flex";
265     checkInitialValues(element, "alignSelf", "align-self", "right unsafe", "auto");
266 }, "Test the value 'initial' for flex containers");
267
268 test(function() {
269     container.style.display = "";
270     element.style.position = "absolute";
271     checkInitialValues(element, "alignSelf", "align-self", "left", "auto");
272 }, "Test the value 'initial' for positioned elements");
273
274 test(function() {
275     container.style.display = "grid";
276     element.style.position = "absolute";
277     checkInitialValues(element, "alignSelf", "align-self", "right", "auto");
278 }, "Test the value 'initial' for positioned elements in grid containers");
279
280 test(function() {
281     container.style.display = "flex";
282     element.style.position = "absolute";
283     checkInitialValues(element, "alignSelf", "align-self", "end", "auto");
284 }, "Test the value 'initial' for positioned elements in grid containers");
285
286 test(function() {
287     checkInheritValues("alignSelf", "align-self", "end");
288     checkInheritValues("alignSelf", "align-self", "left safe");
289     checkInheritValues("alignSelf", "align-self", "center unsafe");
290 }, "Test the value 'inherit'");
291 </script>