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

Side by Side Diff: third_party/WebKit/LayoutTests/css3/flexbox/position-absolute-child.html

Issue 1419813004: Remove the "horizontal-bt" value from -webkit-writing-mode (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Add static_assert to ensure TransformedWritingMode matches to WritingMode Created 5 years, 1 month 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
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html> 2 <html>
3 <style> 3 <style>
4 body { 4 body {
5 margin: 0; 5 margin: 0;
6 } 6 }
7 7
8 .title { 8 .title {
9 margin-top: 1em; 9 margin-top: 1em;
10 } 10 }
11 11
12 .flexbox { 12 .flexbox {
13 display: flex; 13 display: flex;
14 background-color: #aaa; 14 background-color: #aaa;
15 position: relative; 15 position: relative;
16 } 16 }
17 .flexbox div { 17 .flexbox div {
18 border: 0; 18 border: 0;
19 flex: none; 19 flex: none;
20 } 20 }
21 21
22 .horizontal-tb { 22 .horizontal-tb {
23 -webkit-writing-mode: horizontal-tb; 23 -webkit-writing-mode: horizontal-tb;
24 } 24 }
25 .horizontal-bt {
26 -webkit-writing-mode: horizontal-bt;
27 }
28 .vertical-rl { 25 .vertical-rl {
29 -webkit-writing-mode: vertical-rl; 26 -webkit-writing-mode: vertical-rl;
30 } 27 }
31 .vertical-lr { 28 .vertical-lr {
32 -webkit-writing-mode: vertical-lr; 29 -webkit-writing-mode: vertical-lr;
33 } 30 }
34 31
35 .row { 32 .row {
36 flex-flow: row; 33 flex-flow: row;
37 } 34 }
(...skipping 29 matching lines...) Expand all
67 <body onload="checkLayout('.flexbox')"> 64 <body onload="checkLayout('.flexbox')">
68 65
69 <script> 66 <script>
70 function getFlexDirection(flexFlow, writingMode) 67 function getFlexDirection(flexFlow, writingMode)
71 { 68 {
72 if (writingMode.indexOf('horizontal') != -1) 69 if (writingMode.indexOf('horizontal') != -1)
73 return (flexFlow.indexOf('row') != -1) ? 'width' : 'height'; 70 return (flexFlow.indexOf('row') != -1) ? 'width' : 'height';
74 return (flexFlow.indexOf('row') != -1) ? 'height' : 'width'; 71 return (flexFlow.indexOf('row') != -1) ? 'height' : 'width';
75 } 72 }
76 73
77 var writingModes = ['horizontal-tb', 'horizontal-bt', 'vertical-rl', 'vertical-l r']; 74 var writingModes = ['horizontal-tb', 'vertical-rl', 'vertical-lr'];
78 var flexFlows = ['row', 'column', 'row-reverse', 'column-reverse']; 75 var flexFlows = ['row', 'column', 'row-reverse', 'column-reverse'];
79 var directions = ['ltr', 'rtl']; 76 var directions = ['ltr', 'rtl'];
80 77
81 var expectations = { 78 var expectations = {
82 'horizontal-tb': { 79 'horizontal-tb': {
83 row: { 80 row: {
84 ltr: [ 81 ltr: [
85 { offsets: [0, 0, 240], sizes: [0, 240, 360] }, 82 { offsets: [0, 0, 240], sizes: [0, 240, 360] },
86 { offsets: [0, 150, 150], sizes: [150, 0, 450] }, 83 { offsets: [0, 150, 150], sizes: [150, 0, 450] },
87 { offsets: [0, 200, 600], sizes: [200, 400, 0] }, 84 { offsets: [0, 200, 600], sizes: [200, 400, 0] },
(...skipping 82 matching lines...) Expand 10 before | Expand all | Expand 10 after
170 { offsets: [80, 0, 0], sizes: [40, 80, 0] }, 167 { offsets: [80, 0, 0], sizes: [40, 80, 0] },
171 { offsets: [120, 80, 0] }, 168 { offsets: [120, 80, 0] },
172 { offsets: [80, 40, 0] }, 169 { offsets: [80, 40, 0] },
173 { offsets: [80, 0, 0] }, 170 { offsets: [80, 0, 0] },
174 { offsets: [90, 50, 10], crossAxisOffset: 60 }, 171 { offsets: [90, 50, 10], crossAxisOffset: 60 },
175 { offsets: [50, 50, 10], crossAxisOffset: 60 }, 172 { offsets: [50, 50, 10], crossAxisOffset: 60 },
176 { offsets: [50, 10, 10], crossAxisOffset: 60 }, 173 { offsets: [50, 10, 10], crossAxisOffset: 60 },
177 ], 174 ],
178 }, 175 },
179 }, 176 },
180 'horizontal-bt': {
181 // This matches the horizontal-tb values above.
182 row: {
183 ltr: [
184 { offsets: [0, 0, 240], sizes: [0, 240, 360] },
185 { offsets: [0, 150, 150], sizes: [150, 0, 450] },
186 { offsets: [0, 200, 600], sizes: [200, 400, 0] },
187 { offsets: [0, 0, 560] },
188 { offsets: [0, 560, 560] },
189 { offsets: [0, 560, 600] },
190 { offsets: [10, 10, 50], crossAxisOffset: 60 },
191 { offsets: [10, 50, 50], crossAxisOffset: 60 },
192 { offsets: [10, 50, 90], crossAxisOffset: 60 },
193 ],
194 rtl: [
195 { offsets: [600, 360, 0], sizes: [0, 240, 360] },
196 { offsets: [450, 450, 0], sizes: [150, 0, 450] },
197 { offsets: [400, 0, 0], sizes: [200, 400, 0] },
198 { offsets: [580, 560, 0] },
199 { offsets: [560, 20, 0] },
200 { offsets: [560, 0, -20] },
201 { offsets: [50, 50, 10], crossAxisOffset: 60 },
202 { offsets: [50, 10, 10], crossAxisOffset: 60 },
203 { offsets: [50, 10, -30], crossAxisOffset: 60 },
204 ],
205 },
206 // horizontal-bt flips the main axis direction so the offsets are differ ent from horizontal-tb.
207 column: {
208 ltr: [
209 { offsets: [120, 72, 0], sizes: [0, 48, 72] },
210 { offsets: [90, 90, 0], sizes: [30, 0, 90] },
211 { offsets: [80, 0, 0], sizes: [40, 80, 0] },
212 { offsets: [100, 80, 0] },
213 { offsets: [80, 20, 0] },
214 { offsets: [80, 0, -20] },
215 { offsets: [50, 50, 10], crossAxisOffset: 0 },
216 { offsets: [50, 10, 10], crossAxisOffset: 0 },
217 { offsets: [50, 10, -30], crossAxisOffset: 0 },
218 ],
219 rtl: [
220 { offsets: [120, 72, 0], sizes: [0, 48, 72] },
221 { offsets: [90, 90, 0], sizes: [30, 0, 90] },
222 { offsets: [80, 0, 0], sizes: [40, 80, 0] },
223 { offsets: [100, 80, 0] },
224 { offsets: [80, 20, 0] },
225 { offsets: [80, 0, -20] },
226 { offsets: [50, 50, 10], crossAxisOffset: 60 },
227 { offsets: [50, 10, 10], crossAxisOffset: 60 },
228 { offsets: [50, 10, -30], crossAxisOffset: 60 },
229 ],
230 },
231 'row-reverse': {
232 ltr: [
233 { offsets: [600, 360, 0], sizes: [0, 240, 360] },
234 { offsets: [450, 450, 0], sizes: [150, 0, 450] },
235 { offsets: [400, 0, 0], sizes: [200, 400, 0] },
236 { offsets: [600, 560, 0] },
237 { offsets: [560, 40, 0] },
238 { offsets: [560, 0, 0] },
239 { offsets: [90, 50, 10], crossAxisOffset: 60 },
240 { offsets: [50, 50, 10], crossAxisOffset: 60 },
241 { offsets: [50, 10, 10], crossAxisOffset: 60 },
242 ],
243 rtl: [
244 { offsets: [0, 0, 240], sizes: [0, 240, 360] },
245 { offsets: [0, 150, 150], sizes: [150, 0, 450] },
246 { offsets: [0, 200, 600], sizes: [200, 400, 0] },
247 { offsets: [-20, 0, 560] },
248 { offsets: [0, 540, 560] },
249 { offsets: [0, 560, 580] },
250 { offsets: [-30, 10, 50], crossAxisOffset: 60 },
251 { offsets: [10, 10, 50], crossAxisOffset: 60 },
252 { offsets: [10, 50, 50], crossAxisOffset: 60 },
253 ],
254 },
255 'column-reverse': {
256 ltr: [
257 { offsets: [0, 0, 48], sizes: [0, 48, 72] },
258 { offsets: [0, 30, 30], sizes: [30, 0, 90] },
259 { offsets: [0, 40, 120], sizes: [40, 80, 0] },
260 { offsets: [-20, 0, 80] },
261 { offsets: [0, 60, 80] },
262 { offsets: [0, 80, 100] },
263 { offsets: [-30, 10, 50], crossAxisOffset: 0 },
264 { offsets: [10, 10, 50], crossAxisOffset: 0 },
265 { offsets: [10, 50, 50], crossAxisOffset: 0 },
266 ],
267 rtl: [
268 { offsets: [0, 0, 48], sizes: [0, 48, 72] },
269 { offsets: [0, 30, 30], sizes: [30, 0, 90] },
270 { offsets: [0, 40, 120], sizes: [40, 80, 0] },
271 { offsets: [-20, 0, 80] },
272 { offsets: [0, 60, 80] },
273 { offsets: [0, 80, 100] },
274 { offsets: [-30, 10, 50], crossAxisOffset: 60 },
275 { offsets: [10, 10, 50], crossAxisOffset: 60 },
276 { offsets: [10, 50, 50], crossAxisOffset: 60 },
277 ],
278 },
279 },
280 'vertical-rl': { 177 'vertical-rl': {
281 row: { 178 row: {
282 // The same as horizontal-tb + column. 179 // The same as horizontal-tb + column.
283 ltr: [ 180 ltr: [
284 { offsets: [0, 0, 48], sizes: [0, 48, 72] }, 181 { offsets: [0, 0, 48], sizes: [0, 48, 72] },
285 { offsets: [0, 30, 30], sizes: [30, 0, 90] }, 182 { offsets: [0, 30, 30], sizes: [30, 0, 90] },
286 { offsets: [0, 40, 120], sizes: [40, 80, 0] }, 183 { offsets: [0, 40, 120], sizes: [40, 80, 0] },
287 { offsets: [0, 0, 80] }, 184 { offsets: [0, 0, 80] },
288 { offsets: [0, 80, 80] }, 185 { offsets: [0, 80, 80] },
289 { offsets: [0, 80, 120] }, 186 { offsets: [0, 80, 120] },
(...skipping 303 matching lines...) Expand 10 before | Expand all | Expand 10 after
593 addJustifyContentSpaceBetweenTests(writingMode, flexFlow, direction, flexDirection); 490 addJustifyContentSpaceBetweenTests(writingMode, flexFlow, direction, flexDirection);
594 addAlignItemsCenterTests(writingMode, flexFlow, direction, flexDirec tion); 491 addAlignItemsCenterTests(writingMode, flexFlow, direction, flexDirec tion);
595 }) 492 })
596 }) 493 })
597 }) 494 })
598 495
599 </script> 496 </script>
600 497
601 </body> 498 </body>
602 </html> 499 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698