OLD | NEW |
1 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> | 1 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> |
2 <html> | 2 <html> |
3 <head> | 3 <head> |
4 <script src="../../resources/js-test.js"></script> | 4 <script src="../../resources/js-test.js"></script> |
5 </head> | 5 </head> |
6 <body> | 6 <body> |
7 <div id="flexbox"> | 7 <div id="flexbox"> |
8 <div id="flexitem"></div> | 8 <div id="flexitem"></div> |
9 </div> | 9 </div> |
10 <script> | 10 <script> |
(...skipping 63 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
74 flexbox.style.justifyContent = 'space-between'; | 74 flexbox.style.justifyContent = 'space-between'; |
75 shouldBeEqualToString('flexbox.style.justifyContent', 'space-between'); | 75 shouldBeEqualToString('flexbox.style.justifyContent', 'space-between'); |
76 shouldBeEqualToString('window.getComputedStyle(flexbox, null).justifyContent', '
space-between'); | 76 shouldBeEqualToString('window.getComputedStyle(flexbox, null).justifyContent', '
space-between'); |
77 | 77 |
78 flexbox.style.justifyContent = ''; | 78 flexbox.style.justifyContent = ''; |
79 shouldBeEqualToString('flexbox.style.justifyContent', ''); | 79 shouldBeEqualToString('flexbox.style.justifyContent', ''); |
80 shouldBeEqualToString('window.getComputedStyle(flexbox, null).justifyContent', '
normal'); | 80 shouldBeEqualToString('window.getComputedStyle(flexbox, null).justifyContent', '
normal'); |
81 | 81 |
82 shouldBeEqualToString('flexbox.style.alignSelf', ''); | 82 shouldBeEqualToString('flexbox.style.alignSelf', ''); |
83 // The initial value is 'auto', which will be resolved depending on parent's sty
le (except for the 'document' element). | 83 // The initial value is 'auto', which will be resolved depending on parent's sty
le (except for the 'document' element). |
84 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignSelf', 'start
'); | 84 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignSelf', 'norma
l'); |
85 shouldBeEqualToString('window.getComputedStyle(document.documentElement, null).a
lignSelf', 'start'); | 85 shouldBeEqualToString('window.getComputedStyle(document.documentElement, null).a
lignSelf', 'normal'); |
86 | 86 |
87 flexbox.style.alignSelf = 'foo'; | 87 flexbox.style.alignSelf = 'foo'; |
88 shouldBeEqualToString('flexbox.style.alignSelf', ''); | 88 shouldBeEqualToString('flexbox.style.alignSelf', ''); |
89 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignSelf', 'start
'); | 89 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignSelf', 'norma
l'); |
90 | 90 |
91 flexbox.style.alignSelf = 'auto'; | 91 flexbox.style.alignSelf = 'auto'; |
92 shouldBeEqualToString('flexbox.style.alignSelf', 'auto'); | 92 shouldBeEqualToString('flexbox.style.alignSelf', 'auto'); |
93 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignSelf', 'start
'); | 93 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignSelf', 'norma
l'); |
94 | 94 |
95 flexbox.style.alignSelf = 'flex-start'; | 95 flexbox.style.alignSelf = 'flex-start'; |
96 shouldBeEqualToString('flexbox.style.alignSelf', 'flex-start'); | 96 shouldBeEqualToString('flexbox.style.alignSelf', 'flex-start'); |
97 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignSelf', 'flex-
start'); | 97 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignSelf', 'flex-
start'); |
98 | 98 |
99 flexbox.style.alignSelf = 'flex-end'; | 99 flexbox.style.alignSelf = 'flex-end'; |
100 shouldBeEqualToString('flexbox.style.alignSelf', 'flex-end'); | 100 shouldBeEqualToString('flexbox.style.alignSelf', 'flex-end'); |
101 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignSelf', 'flex-
end'); | 101 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignSelf', 'flex-
end'); |
102 | 102 |
103 flexbox.style.alignSelf = 'center'; | 103 flexbox.style.alignSelf = 'center'; |
104 shouldBeEqualToString('flexbox.style.alignSelf', 'center'); | 104 shouldBeEqualToString('flexbox.style.alignSelf', 'center'); |
105 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignSelf', 'cente
r'); | 105 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignSelf', 'cente
r'); |
106 | 106 |
107 flexbox.style.alignSelf = 'stretch'; | 107 flexbox.style.alignSelf = 'stretch'; |
108 shouldBeEqualToString('flexbox.style.alignSelf', 'stretch'); | 108 shouldBeEqualToString('flexbox.style.alignSelf', 'stretch'); |
109 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignSelf', 'stret
ch'); | 109 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignSelf', 'stret
ch'); |
110 | 110 |
111 flexbox.style.alignSelf = 'baseline'; | 111 flexbox.style.alignSelf = 'baseline'; |
112 shouldBeEqualToString('flexbox.style.alignSelf', 'baseline'); | 112 shouldBeEqualToString('flexbox.style.alignSelf', 'baseline'); |
113 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignSelf', 'basel
ine'); | 113 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignSelf', 'basel
ine'); |
114 | 114 |
115 flexbox.style.alignSelf = ''; | 115 flexbox.style.alignSelf = ''; |
116 shouldBeEqualToString('flexbox.style.alignSelf', ''); | 116 shouldBeEqualToString('flexbox.style.alignSelf', ''); |
117 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignSelf', 'start
'); | 117 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignSelf', 'norma
l'); |
118 | 118 |
119 shouldBeEqualToString('flexbox.style.alignItems', ''); | 119 shouldBeEqualToString('flexbox.style.alignItems', ''); |
120 shouldBeEqualToString('flexitem.style.alignSelf', ''); | 120 shouldBeEqualToString('flexitem.style.alignSelf', ''); |
121 // The initial value is 'auto', which will be resolved to 'stretch' in case of f
lexbox containers. | 121 // The initial value is 'auto', which will be resolved to 'normal' in case of fl
exbox containers. |
122 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignItems', 'stre
tch'); | 122 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignItems', 'norm
al'); |
123 shouldBeEqualToString('window.getComputedStyle(flexitem, null).alignSelf', 'stre
tch'); | 123 shouldBeEqualToString('window.getComputedStyle(flexitem, null).alignSelf', 'norm
al'); |
124 | 124 |
125 flexbox.style.alignItems = 'foo'; | 125 flexbox.style.alignItems = 'foo'; |
126 shouldBeEqualToString('flexbox.style.alignItems', ''); | 126 shouldBeEqualToString('flexbox.style.alignItems', ''); |
127 shouldBeEqualToString('flexitem.style.alignSelf', ''); | 127 shouldBeEqualToString('flexitem.style.alignSelf', ''); |
128 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignItems', 'stre
tch'); | 128 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignItems', 'norm
al'); |
129 shouldBeEqualToString('window.getComputedStyle(flexitem, null).alignSelf', 'stre
tch'); | 129 shouldBeEqualToString('window.getComputedStyle(flexitem, null).alignSelf', 'norm
al'); |
130 | 130 |
| 131 // The 'auto' value is not valid for the align-items property. |
131 flexbox.style.alignItems = 'auto'; | 132 flexbox.style.alignItems = 'auto'; |
132 shouldBeEqualToString('flexbox.style.alignItems', 'auto'); | 133 shouldBeEqualToString('flexbox.style.alignItems', ''); |
133 shouldBeEqualToString('flexitem.style.alignSelf', ''); | 134 shouldBeEqualToString('flexitem.style.alignSelf', ''); |
134 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignItems', 'stre
tch'); | 135 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignItems', 'norm
al'); |
135 shouldBeEqualToString('window.getComputedStyle(flexitem, null).alignSelf', 'stre
tch'); | 136 shouldBeEqualToString('window.getComputedStyle(flexitem, null).alignSelf', 'norm
al'); |
136 | 137 |
137 flexbox.style.alignItems = 'flex-start'; | 138 flexbox.style.alignItems = 'flex-start'; |
138 shouldBeEqualToString('flexbox.style.alignItems', 'flex-start'); | 139 shouldBeEqualToString('flexbox.style.alignItems', 'flex-start'); |
139 shouldBeEqualToString('flexitem.style.alignSelf', ''); | 140 shouldBeEqualToString('flexitem.style.alignSelf', ''); |
140 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignItems', 'flex
-start'); | 141 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignItems', 'flex
-start'); |
141 shouldBeEqualToString('window.getComputedStyle(flexitem, null).alignSelf', 'flex
-start'); | 142 shouldBeEqualToString('window.getComputedStyle(flexitem, null).alignSelf', 'flex
-start'); |
142 | 143 |
143 flexbox.style.alignItems = 'flex-end'; | 144 flexbox.style.alignItems = 'flex-end'; |
144 shouldBeEqualToString('flexbox.style.alignItems', 'flex-end'); | 145 shouldBeEqualToString('flexbox.style.alignItems', 'flex-end'); |
145 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignItems', 'flex
-end'); | 146 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignItems', 'flex
-end'); |
146 shouldBeEqualToString('window.getComputedStyle(flexitem, null).alignSelf', 'flex
-end'); | 147 shouldBeEqualToString('window.getComputedStyle(flexitem, null).alignSelf', 'flex
-end'); |
147 | 148 |
148 flexbox.style.alignItems = 'center'; | 149 flexbox.style.alignItems = 'center'; |
149 shouldBeEqualToString('flexbox.style.alignItems', 'center'); | 150 shouldBeEqualToString('flexbox.style.alignItems', 'center'); |
150 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignItems', 'cent
er'); | 151 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignItems', 'cent
er'); |
151 shouldBeEqualToString('window.getComputedStyle(flexitem, null).alignSelf', 'cent
er'); | 152 shouldBeEqualToString('window.getComputedStyle(flexitem, null).alignSelf', 'cent
er'); |
152 | 153 |
153 flexbox.style.alignItems = 'stretch'; | 154 flexbox.style.alignItems = 'stretch'; |
154 shouldBeEqualToString('flexbox.style.alignItems', 'stretch'); | 155 shouldBeEqualToString('flexbox.style.alignItems', 'stretch'); |
155 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignItems', 'stre
tch'); | 156 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignItems', 'stre
tch'); |
156 shouldBeEqualToString('window.getComputedStyle(flexitem, null).alignSelf', 'stre
tch'); | 157 shouldBeEqualToString('window.getComputedStyle(flexitem, null).alignSelf', 'stre
tch'); |
157 | 158 |
158 flexbox.style.alignItems = 'baseline'; | 159 flexbox.style.alignItems = 'baseline'; |
159 shouldBeEqualToString('flexbox.style.alignItems', 'baseline'); | 160 shouldBeEqualToString('flexbox.style.alignItems', 'baseline'); |
160 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignItems', 'base
line'); | 161 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignItems', 'base
line'); |
161 shouldBeEqualToString('window.getComputedStyle(flexitem, null).alignSelf', 'base
line'); | 162 shouldBeEqualToString('window.getComputedStyle(flexitem, null).alignSelf', 'base
line'); |
162 | 163 |
163 flexbox.style.alignItems = ''; | 164 flexbox.style.alignItems = ''; |
164 shouldBeEqualToString('flexbox.style.alignItems', ''); | 165 shouldBeEqualToString('flexbox.style.alignItems', ''); |
165 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignItems', 'stre
tch'); | 166 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignItems', 'norm
al'); |
166 shouldBeEqualToString('window.getComputedStyle(flexitem, null).alignSelf', 'stre
tch'); | 167 shouldBeEqualToString('window.getComputedStyle(flexitem, null).alignSelf', 'norm
al'); |
167 | 168 |
168 flexbox.style.display = 'none'; | 169 flexbox.style.display = 'none'; |
169 shouldBeEqualToString('flexbox.style.alignItems', ''); | 170 shouldBeEqualToString('flexbox.style.alignItems', ''); |
170 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignItems', 'star
t'); | 171 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignItems', 'norm
al'); |
171 shouldBeEqualToString('window.getComputedStyle(flexitem, null).alignSelf', 'star
t'); | 172 shouldBeEqualToString('window.getComputedStyle(flexitem, null).alignSelf', 'norm
al'); |
172 flexbox.style.display = 'flex'; | 173 flexbox.style.display = 'flex'; |
173 | 174 |
174 | 175 |
175 // FIXME: This should probably return stretch. See https://bugs.webkit.org/show_
bug.cgi?id=14563. | 176 // FIXME: This should probably return stretch. See https://bugs.webkit.org/show_
bug.cgi?id=14563. |
176 var detachedFlexbox = document.createElement('div'); | 177 var detachedFlexbox = document.createElement('div'); |
177 var detachedFlexItem = document.createElement('div'); | 178 var detachedFlexItem = document.createElement('div'); |
178 detachedFlexbox.appendChild(detachedFlexItem); | 179 detachedFlexbox.appendChild(detachedFlexItem); |
179 shouldBeEqualToString('window.getComputedStyle(detachedFlexbox, null).alignSelf'
, ''); | 180 shouldBeEqualToString('window.getComputedStyle(detachedFlexbox, null).alignSelf'
, ''); |
180 shouldBeEqualToString('window.getComputedStyle(detachedFlexItem, null).alignSelf
', ''); | 181 shouldBeEqualToString('window.getComputedStyle(detachedFlexItem, null).alignSelf
', ''); |
181 | 182 |
(...skipping 125 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
307 flexbox.style.alignContent = ''; | 308 flexbox.style.alignContent = ''; |
308 shouldBeEqualToString('flexbox.style.alignContent', ''); | 309 shouldBeEqualToString('flexbox.style.alignContent', ''); |
309 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignContent', 'no
rmal'); | 310 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignContent', 'no
rmal'); |
310 | 311 |
311 flexbox.style.alignContent = 'foo'; | 312 flexbox.style.alignContent = 'foo'; |
312 shouldBeEqualToString('flexbox.style.alignContent', ''); | 313 shouldBeEqualToString('flexbox.style.alignContent', ''); |
313 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignContent', 'no
rmal'); | 314 shouldBeEqualToString('window.getComputedStyle(flexbox, null).alignContent', 'no
rmal'); |
314 </script> | 315 </script> |
315 </body> | 316 </body> |
316 </html> | 317 </html> |
OLD | NEW |