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

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

Issue 17090005: [CSS Grid Layout] Implement 'justify-self' parsing (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Fixed a bug in parseColor uncovered by the patch 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 | « no previous file | LayoutTests/fast/alignment/parse-justify-self-expected.txt » ('j') | no next file with comments »
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 #justifySelfBaseline {
6 justify-self: baseline;
7 }
8
9 #justifySelfStretch {
10 justify-self: stretch;
11 }
12
13 #justifySelfStart {
14 justify-self: start;
15 }
16
17 #justifySelfEnd {
18 justify-self: end;
19 }
20
21 #justifySelfCenter {
22 justify-self: center;
23 }
24
25 #justifySelfSelfStart {
26 justify-self: self-start;
27 }
28
29 #justifySelfSelfEnd {
30 justify-self: self-end;
31 }
32
33 #justifySelfLeft {
34 justify-self: left;
35 }
36
37 #justifySelfRight {
38 justify-self: right;
39 }
40
41 #justifySelfEndTrue {
42 justify-self: end true;
43 }
44
45 #justifySelfCenterTrue {
46 justify-self: center true;
47 }
48
49 #justifySelfSelfEndSafe {
50 justify-self: self-end safe;
51 }
52
53 #justifySelfSelfStartSafe {
54 justify-self: self-start safe;
55 }
56
57 #justifySelfRightSafe {
58 justify-self: right safe;
59 }
60
61 #justifySelfLeftTrue {
62 justify-self: left true;
63 }
64 </style>
65 <script src="../../resources/js-test.js"></script>
66 </head>
67 <body>
68 <div id="justifySelfBaseline"></div>
69 <div id="justifySelfStretch"></div>
70 <div id="justifySelfStart"></div>
71 <div id="justifySelfEnd"></div>
72 <div id="justifySelfCenter"></div>
73 <div id="justifySelfSelfStart"></div>
74 <div id="justifySelfSelfEnd"></div>
75 <div id="justifySelfLeft"></div>
76 <div id="justifySelfRight"></div>
77
78 <div id="justifySelfEndTrue"></div>
79 <div id="justifySelfCenterTrue"></div>
80 <div id="justifySelfSelfEndSafe"></div>
81 <div id="justifySelfSelfStartSafe"></div>
82 <div id="justifySelfRightSafe"></div>
83 <div id="justifySelfLeftTrue"></div>
84 <script>
85 description('Test that setting and getting justify-self works as expected');
86
87 debug("Test getting justify-self set through CSS");
88 var justifySelfBaseline = document.getElementById("justifySelfBaseline");
89 shouldBe("getComputedStyle(justifySelfBaseline, '').getPropertyValue('justify-se lf')", "'baseline'");
90
91 var justifySelfStretch = document.getElementById("justifySelfStretch");
92 shouldBe("getComputedStyle(justifySelfStretch, '').getPropertyValue('justify-sel f')", "'stretch'");
93
94 var justifySelfStart = document.getElementById("justifySelfStart");
95 shouldBe("getComputedStyle(justifySelfStart, '').getPropertyValue('justify-self' )", "'start'");
96
97 var justifySelfEnd = document.getElementById("justifySelfEnd");
98 shouldBe("getComputedStyle(justifySelfEnd, '').getPropertyValue('justify-self')" , "'end'");
99
100 var justifySelfCenter = document.getElementById("justifySelfCenter");
101 shouldBe("getComputedStyle(justifySelfCenter, '').getPropertyValue('justify-self ')", "'center'");
102
103 var justifySelfSelfEnd = document.getElementById("justifySelfSelfEnd");
104 shouldBe("getComputedStyle(justifySelfSelfEnd, '').getPropertyValue('justify-sel f')", "'self-end'");
105
106 var justifySelfSelfStart = document.getElementById("justifySelfSelfStart");
107 shouldBe("getComputedStyle(justifySelfSelfStart, '').getPropertyValue('justify-s elf')", "'self-start'");
108
109 var justifySelfLeft = document.getElementById("justifySelfLeft");
110 shouldBe("getComputedStyle(justifySelfLeft, '').getPropertyValue('justify-self') ", "'left'");
111
112 var justifySelfRight = document.getElementById("justifySelfRight");
113 shouldBe("getComputedStyle(justifySelfRight, '').getPropertyValue('justify-self' )", "'right'");
114
115 var justifySelfEndTrue = document.getElementById("justifySelfEndTrue");
116 shouldBe("getComputedStyle(justifySelfEndTrue, '').getPropertyValue('justify-sel f')", "'end true'");
117
118 var justifySelfCenterTrue = document.getElementById("justifySelfCenterTrue");
119 shouldBe("getComputedStyle(justifySelfCenterTrue, '').getPropertyValue('justify- self')", "'center true'");
120
121 var justifySelfSelfEndSafe = document.getElementById("justifySelfSelfEndSafe");
122 shouldBe("getComputedStyle(justifySelfSelfEndSafe, '').getPropertyValue('justify -self')", "'self-end safe'");
123
124 var justifySelfSelfStartSafe = document.getElementById("justifySelfSelfStartSafe ");
125 shouldBe("getComputedStyle(justifySelfSelfStartSafe, '').getPropertyValue('justi fy-self')", "'self-start safe'");
126
127 var justifySelfRightSafe = document.getElementById("justifySelfRightSafe");
128 shouldBe("getComputedStyle(justifySelfRightSafe, '').getPropertyValue('justify-s elf')", "'right safe'");
129
130 var justifySelfLeftTrue = document.getElementById("justifySelfLeftTrue");
131 shouldBe("getComputedStyle(justifySelfLeftTrue, '').getPropertyValue('justify-se lf')", "'left true'");
132
133 debug("");
134 debug("Test initial value of justify-self through JS");
135 element = document.createElement("div");
136 document.body.appendChild(element);
137 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'aut o'");
138
139 debug("");
140 debug("Test getting and setting justify-self through JS");
141 element = document.createElement("div");
142 document.body.appendChild(element);
143 element.style.justifySelf = "center";
144 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'cen ter'");
145
146 element = document.createElement("div");
147 document.body.appendChild(element);
148 element.style.justifySelf = "true start";
149 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'sta rt true'");
150
151 element.style.justifySelf = "auto";
152 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'aut o'");
153
154 debug("");
155 debug("Test bad combinaisons of justify-self");
156 element = document.createElement("div");
157 document.body.appendChild(element);
158 element.style.justifySelf = "true auto";
159 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'aut o'");
160
161 element.style.justifySelf = "auto safe";
162 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'aut o'");
163
164 element.style.justifySelf = "auto left";
165 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'aut o'");
166
167 element.style.justifySelf = "baseline safe";
168 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'aut o'");
169
170 element.style.justifySelf = "baseline center";
171 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'aut o'");
172
173 element.style.justifySelf = "stretch true";
174 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'aut o'");
175
176 element.style.justifySelf = "stretch right";
177 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'aut o'");
178
179 element.style.justifySelf = "true true";
180 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'aut o'");
181
182 element.style.justifySelf = "true safe";
183 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'aut o'");
184
185 element.style.justifySelf = "center start";
186 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'aut o'");
187
188 element.style.justifySelf = "stretch true";
189 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'aut o'");
190
191 element.style.justifySelf = "safe stretch";
192 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'aut o'");
193
194 element.style.justifySelf = "baseline safe";
195 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'aut o'");
196
197 element.style.justifySelf = "true baseline";
198 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'aut o'");
199
200 element.style.justifySelf = "true safe";
201 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'aut o'");
202
203 element.style.justifySelf = "true safe left";
204 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'aut o'");
205
206 element.style.justifySelf = "true left safe";
207 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'aut o'");
208
209 element.style.justifySelf = "left safe true safe";
210 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'aut o'");
211
212 debug("");
213 debug("Test the value 'initial'");
214 element.style.justifySelf = "center";
215 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'cen ter'");
216 element.style.justifySelf = "initial";
217 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'aut o'");
218
219 debug("");
220 debug("Test the value 'inherit'");
221 parentElement = document.createElement("div");
222 document.body.appendChild(parentElement);
223 parentElement.style.justifySelf = "end";
224 shouldBe("getComputedStyle(parentElement, '').getPropertyValue('justify-self')", "'end'");
225
226 element = document.createElement("div");
227 parentElement.appendChild(element);
228 element.style.justifySelf = "inherit";
229 shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'end '");
230 </script>
231 </body>
232 </html>
OLDNEW
« no previous file with comments | « no previous file | LayoutTests/fast/alignment/parse-justify-self-expected.txt » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698