Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(401)

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: LayoutTests/fast/alignment/parse-align-self.html

Issue 134013002: Upgrade align-self and align-items parsing to CSS 3 (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Really fix the tests Created 6 years, 11 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
« no previous file with comments | « LayoutTests/fast/alignment/parse-align-items-expected.txt ('k') | LayoutTests/fast/alignment/parse-align-self-expected.txt » ('j') | Source/core/css/parser/BisonCSSParser-in.cpp » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
(Empty)
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <style>
5 #alignSelfBaseline {
6 align-self: baseline;
7 }
8
9 #alignSelfStretch {
10 align-self: stretch;
11 }
12
13 #alignSelfStart {
14 align-self: start;
15 }
16
17 #alignSelfEnd {
18 align-self: end;
19 }
20
21 #alignSelfCenter {
22 align-self: center;
23 }
24
25 #alignSelfSelfStart {
26 align-self: self-start;
27 }
28
29 #alignSelfSelfEnd {
30 align-self: self-end;
31 }
32
33 #alignSelfLeft {
34 align-self: left;
35 }
36
37 #alignSelfRight {
38 align-self: right;
39 }
40
41 #alignSelfEndTrue {
42 align-self: end true;
43 }
44
45 #alignSelfCenterTrue {
46 align-self: center true;
47 }
48
49 #alignSelfSelfEndSafe {
50 align-self: self-end safe;
51 }
52
53 #alignSelfSelfStartSafe {
54 align-self: self-start safe;
55 }
56
57 #alignSelfRightSafe {
58 align-self: right safe;
59 }
60
61 #alignSelfLeftTrue {
62 align-self: left true;
63 }
64 </style>
65 <script src="../../resources/js-test.js"></script>
66 </head>
67 <body>
68 <div id="alignSelfBaseline"></div>
69 <div id="alignSelfStretch"></div>
70 <div id="alignSelfStart"></div>
71 <div id="alignSelfEnd"></div>
72 <div id="alignSelfCenter"></div>
73 <div id="alignSelfSelfStart"></div>
74 <div id="alignSelfSelfEnd"></div>
75 <div id="alignSelfLeft"></div>
76 <div id="alignSelfRight"></div>
77
78 <div id="alignSelfEndTrue"></div>
79 <div id="alignSelfCenterTrue"></div>
80 <div id="alignSelfSelfEndSafe"></div>
81 <div id="alignSelfSelfStartSafe"></div>
82 <div id="alignSelfRightSafe"></div>
83 <div id="alignSelfLeftTrue"></div>
84 <script>
85 description('Test that setting and getting align-self works as expected');
86
87 debug("Test getting align-self set through CSS");
88 var alignSelfBaseline = document.getElementById("alignSelfBaseline");
89 shouldBe("getComputedStyle(alignSelfBaseline, '').getPropertyValue('align-self') ", "'baseline'");
90
91 var alignSelfStretch = document.getElementById("alignSelfStretch");
92 shouldBe("getComputedStyle(alignSelfStretch, '').getPropertyValue('align-self')" , "'stretch'");
93
94 var alignSelfStart = document.getElementById("alignSelfStart");
95 shouldBe("getComputedStyle(alignSelfStart, '').getPropertyValue('align-self')", "'start'");
96
97 var alignSelfEnd = document.getElementById("alignSelfEnd");
98 shouldBe("getComputedStyle(alignSelfEnd, '').getPropertyValue('align-self')", "' end'");
99
100 var alignSelfCenter = document.getElementById("alignSelfCenter");
101 shouldBe("getComputedStyle(alignSelfCenter, '').getPropertyValue('align-self')", "'center'");
102
103 var alignSelfSelfEnd = document.getElementById("alignSelfSelfEnd");
104 shouldBe("getComputedStyle(alignSelfSelfEnd, '').getPropertyValue('align-self')" , "'self-end'");
105
106 var alignSelfSelfStart = document.getElementById("alignSelfSelfStart");
107 shouldBe("getComputedStyle(alignSelfSelfStart, '').getPropertyValue('align-self' )", "'self-start'");
108
109 var alignSelfLeft = document.getElementById("alignSelfLeft");
110 shouldBe("getComputedStyle(alignSelfLeft, '').getPropertyValue('align-self')", " 'left'");
111
112 var alignSelfRight = document.getElementById("alignSelfRight");
113 shouldBe("getComputedStyle(alignSelfRight, '').getPropertyValue('align-self')", "'right'");
114
115 var alignSelfEndTrue = document.getElementById("alignSelfEndTrue");
116 shouldBe("getComputedStyle(alignSelfEndTrue, '').getPropertyValue('align-self')" , "'end true'");
117
118 var alignSelfCenterTrue = document.getElementById("alignSelfCenterTrue");
119 shouldBe("getComputedStyle(alignSelfCenterTrue, '').getPropertyValue('align-self ')", "'center true'");
120
121 var alignSelfSelfEndSafe = document.getElementById("alignSelfSelfEndSafe");
122 shouldBe("getComputedStyle(alignSelfSelfEndSafe, '').getPropertyValue('align-sel f')", "'self-end safe'");
123
124 var alignSelfSelfStartSafe = document.getElementById("alignSelfSelfStartSafe");
125 shouldBe("getComputedStyle(alignSelfSelfStartSafe, '').getPropertyValue('align-s elf')", "'self-start safe'");
126
127 var alignSelfRightSafe = document.getElementById("alignSelfRightSafe");
128 shouldBe("getComputedStyle(alignSelfRightSafe, '').getPropertyValue('align-self' )", "'right safe'");
129
130 var alignSelfLeftTrue = document.getElementById("alignSelfLeftTrue");
131 shouldBe("getComputedStyle(alignSelfLeftTrue, '').getPropertyValue('align-self') ", "'left true'");
132
133 debug("");
134 debug("Test initial value of align-self through JS");
135 element = document.createElement("div");
136 document.body.appendChild(element);
137 // align-self: auto ends up returning the default value of align-items which is 'stretch'.
138 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stret ch'");
139
140 debug("");
141 debug("Test getting and setting align-self through JS");
142 element = document.createElement("div");
143 document.body.appendChild(element);
144 element.style.alignSelf = "center";
145 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'cente r'");
146
147 element = document.createElement("div");
148 document.body.appendChild(element);
149 element.style.alignSelf = "true start";
150 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'start true'");
151
152 element.style.alignSelf = "auto";
153 // See explanation for the initial value as to why this is correct.
154 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stret ch'");
155
156 debug("");
157 debug("Test bad combinaisons of align-self");
158 element = document.createElement("div");
159 document.body.appendChild(element);
160 element.style.alignSelf = "true auto";
161 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stret ch'");
162
163 element.style.alignSelf = "auto safe";
164 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stret ch'");
165
166 element.style.alignSelf = "auto left";
167 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stret ch'");
168
169 element.style.alignSelf = "baseline safe";
170 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stret ch'");
171
172 element.style.alignSelf = "baseline center";
173 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stret ch'");
174
175 element.style.alignSelf = "stretch true";
176 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stret ch'");
177
178 element.style.alignSelf = "stretch right";
179 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stret ch'");
180
181 element.style.alignSelf = "true true";
182 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stret ch'");
183
184 element.style.alignSelf = "true safe";
185 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stret ch'");
186
187 element.style.alignSelf = "center start";
188 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stret ch'");
189
190 element.style.alignSelf = "stretch true";
191 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stret ch'");
192
193 element.style.alignSelf = "safe stretch";
194 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stret ch'");
195
196 element.style.alignSelf = "baseline safe";
197 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stret ch'");
198
199 element.style.alignSelf = "true baseline";
200 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stret ch'");
201
202 element.style.alignSelf = "true safe";
203 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stret ch'");
204
205 element.style.alignSelf = "true safe left";
206 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stret ch'");
207
208 element.style.alignSelf = "true left safe";
209 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stret ch'");
210
211 element.style.alignSelf = "left safe true safe";
212 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stret ch'");
213
214 debug("");
215 debug("Test the value 'initial'");
216 element.style.alignSelf = "center";
217 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'cente r'");
218 element.style.alignSelf = "initial";
219 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'stret ch'");
220
221 debug("");
222 debug("Test the value 'inherit'");
223 parentElement = document.createElement("div");
224 document.body.appendChild(parentElement);
225 parentElement.style.alignSelf = "end";
226 shouldBe("getComputedStyle(parentElement, '').getPropertyValue('align-self')", " 'end'");
227
228 element = document.createElement("div");
229 parentElement.appendChild(element);
230 element.style.alignSelf = "inherit";
231 shouldBe("getComputedStyle(element, '').getPropertyValue('align-self')", "'end'" );
232 </script>
233 </body>
234 </html>
OLDNEW
« no previous file with comments | « LayoutTests/fast/alignment/parse-align-items-expected.txt ('k') | LayoutTests/fast/alignment/parse-align-self-expected.txt » ('j') | Source/core/css/parser/BisonCSSParser-in.cpp » ('J')

Powered by Google App Engine
This is Rietveld 408576698