| 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 | 
|---|