| OLD | NEW |
| 1 The test loads the same stylesheet to different frames and then mutates them. Th
e mutations should not affect other frames. | 1 The test loads the same stylesheet to different frames and then mutates them. Th
e mutations should not affect other frames. |
| 2 | 2 |
| 3 On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE
". | 3 On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE
". |
| 4 | 4 |
| 5 | 5 |
| 6 Test 0 | 6 Test 0 |
| 7 -------------------------------------- | 7 -------------------------------------- |
| 8 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(255, 0, 0)' | 8 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(255, 0, 0)' |
| 9 | 9 |
| 10 @charset "utf-8"; | |
| 11 #testdiv { background-color: green; } | 10 #testdiv { background-color: green; } |
| 12 @media all { | 11 @media all { |
| 13 #testdiv { background-color: red; } | 12 #testdiv { background-color: red; } |
| 14 } | 13 } |
| 15 @page :right { margin-left: 3cm; } | 14 @page :right { margin-left: 3cm; } |
| 16 @-webkit-keyframes bounce { | 15 @-webkit-keyframes bounce { |
| 17 0% { left: 0px; } | 16 0% { left: 0px; } |
| 18 100% { left: 200px; } | 17 100% { left: 200px; } |
| 19 } | 18 } |
| 20 @font-face { font-family: Foo; } | 19 @font-face { font-family: Foo; } |
| 21 | 20 |
| 22 Test 1 | 21 Test 1 |
| 23 -------------------------------------- | 22 -------------------------------------- |
| 24 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' | 23 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' |
| 25 | 24 |
| 26 @charset "utf-8"; | |
| 27 #testdiv { background-color: green; } | 25 #testdiv { background-color: green; } |
| 28 @media all { | 26 @media all { |
| 29 #testdiv { background-color: red; } | 27 #testdiv { background-color: red; } |
| 30 } | 28 } |
| 31 #testdiv { background-color: green; } | 29 #testdiv { background-color: green; } |
| 32 @page :right { margin-left: 3cm; } | 30 @page :right { margin-left: 3cm; } |
| 33 @-webkit-keyframes bounce { | 31 @-webkit-keyframes bounce { |
| 34 0% { left: 0px; } | 32 0% { left: 0px; } |
| 35 100% { left: 200px; } | 33 100% { left: 200px; } |
| 36 } | 34 } |
| 37 @font-face { font-family: Foo; } | 35 @font-face { font-family: Foo; } |
| 38 | 36 |
| 39 Test 2 | 37 Test 2 |
| 40 -------------------------------------- | 38 -------------------------------------- |
| 41 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' | 39 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' |
| 42 | 40 |
| 43 @charset "utf-8"; | |
| 44 #testdiv { background-color: green; } | 41 #testdiv { background-color: green; } |
| 45 @page :right { margin-left: 3cm; } | 42 @page :right { margin-left: 3cm; } |
| 46 @-webkit-keyframes bounce { | 43 @-webkit-keyframes bounce { |
| 47 0% { left: 0px; } | 44 0% { left: 0px; } |
| 48 100% { left: 200px; } | 45 100% { left: 200px; } |
| 49 } | 46 } |
| 50 @font-face { font-family: Foo; } | 47 @font-face { font-family: Foo; } |
| 51 | 48 |
| 52 Test 3 | 49 Test 3 |
| 53 -------------------------------------- | 50 -------------------------------------- |
| 54 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' | 51 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' |
| 55 | 52 |
| 56 @charset "utf-8"; | |
| 57 #testdiv { background-color: green; } | 53 #testdiv { background-color: green; } |
| 58 @media all { | 54 @media all { |
| 59 #testdiv { background-color: red; } | 55 #testdiv { background-color: red; } |
| 60 #testdiv { background-color: green; } | 56 #testdiv { background-color: green; } |
| 61 } | 57 } |
| 62 @page :right { margin-left: 3cm; } | 58 @page :right { margin-left: 3cm; } |
| 63 @-webkit-keyframes bounce { | 59 @-webkit-keyframes bounce { |
| 64 0% { left: 0px; } | 60 0% { left: 0px; } |
| 65 100% { left: 200px; } | 61 100% { left: 200px; } |
| 66 } | 62 } |
| 67 @font-face { font-family: Foo; } | 63 @font-face { font-family: Foo; } |
| 68 | 64 |
| 69 Test 4 | 65 Test 4 |
| 70 -------------------------------------- | 66 -------------------------------------- |
| 71 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' | 67 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' |
| 72 | 68 |
| 73 @charset "utf-8"; | |
| 74 #testdiv { background-color: green; } | 69 #testdiv { background-color: green; } |
| 75 @media all { | 70 @media all { |
| 76 } | 71 } |
| 77 @page :right { margin-left: 3cm; } | 72 @page :right { margin-left: 3cm; } |
| 78 @-webkit-keyframes bounce { | 73 @-webkit-keyframes bounce { |
| 79 0% { left: 0px; } | 74 0% { left: 0px; } |
| 80 100% { left: 200px; } | 75 100% { left: 200px; } |
| 81 } | 76 } |
| 82 @font-face { font-family: Foo; } | 77 @font-face { font-family: Foo; } |
| 83 | 78 |
| 84 Test 5 | 79 Test 5 |
| 85 -------------------------------------- | 80 -------------------------------------- |
| 86 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' | 81 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' |
| 87 | 82 |
| 88 @charset "utf-8"; | |
| 89 #testdiv { background-color: green; } | 83 #testdiv { background-color: green; } |
| 90 @media all { | 84 @media all { |
| 91 #testdiv { background-color: green; } | 85 #testdiv { background-color: green; } |
| 92 } | 86 } |
| 93 @page :right { margin-left: 3cm; } | 87 @page :right { margin-left: 3cm; } |
| 94 @-webkit-keyframes bounce { | 88 @-webkit-keyframes bounce { |
| 95 0% { left: 0px; } | 89 0% { left: 0px; } |
| 96 100% { left: 200px; } | 90 100% { left: 200px; } |
| 97 } | 91 } |
| 98 @font-face { font-family: Foo; } | 92 @font-face { font-family: Foo; } |
| 99 | 93 |
| 100 Test 6 | 94 Test 6 |
| 101 -------------------------------------- | 95 -------------------------------------- |
| 102 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' | 96 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' |
| 103 | 97 |
| 104 @charset "utf-8"; | |
| 105 #testdiv { background-color: green; } | 98 #testdiv { background-color: green; } |
| 106 @media all { | 99 @media all { |
| 107 #testdiv { } | 100 #testdiv { } |
| 108 } | 101 } |
| 109 @page :right { margin-left: 3cm; } | 102 @page :right { margin-left: 3cm; } |
| 110 @-webkit-keyframes bounce { | 103 @-webkit-keyframes bounce { |
| 111 0% { left: 0px; } | 104 0% { left: 0px; } |
| 112 100% { left: 200px; } | 105 100% { left: 200px; } |
| 113 } | 106 } |
| 114 @font-face { font-family: Foo; } | 107 @font-face { font-family: Foo; } |
| 115 | 108 |
| 116 Test 7 | 109 Test 7 |
| 117 -------------------------------------- | 110 -------------------------------------- |
| 118 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' | 111 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' |
| 119 | 112 |
| 120 @charset "utf-8"; | |
| 121 #testdiv { background-color: green; } | 113 #testdiv { background-color: green; } |
| 122 @media all { | 114 @media all { |
| 123 #testdiv { background-color: green; } | 115 #testdiv { background-color: green; } |
| 124 } | 116 } |
| 125 @page :right { margin-left: 3cm; } | 117 @page :right { margin-left: 3cm; } |
| 126 @-webkit-keyframes bounce { | 118 @-webkit-keyframes bounce { |
| 127 0% { left: 0px; } | 119 0% { left: 0px; } |
| 128 100% { left: 200px; } | 120 100% { left: 200px; } |
| 129 } | 121 } |
| 130 @font-face { font-family: Foo; } | 122 @font-face { font-family: Foo; } |
| 131 | 123 |
| 132 Test 8 | 124 Test 8 |
| 133 -------------------------------------- | 125 -------------------------------------- |
| 134 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' | 126 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' |
| 135 | 127 |
| 136 @charset "utf-8"; | |
| 137 #testdiv { background-color: green; } | 128 #testdiv { background-color: green; } |
| 138 @media all { | 129 @media all { |
| 139 #dontmatch { background-color: red; } | 130 #dontmatch { background-color: red; } |
| 140 } | 131 } |
| 141 @page :right { margin-left: 3cm; } | 132 @page :right { margin-left: 3cm; } |
| 142 @-webkit-keyframes bounce { | 133 @-webkit-keyframes bounce { |
| 143 0% { left: 0px; } | 134 0% { left: 0px; } |
| 144 100% { left: 200px; } | 135 100% { left: 200px; } |
| 145 } | 136 } |
| 146 @font-face { font-family: Foo; } | 137 @font-face { font-family: Foo; } |
| 147 | 138 |
| 148 Test 9 | 139 Test 9 |
| 149 -------------------------------------- | 140 -------------------------------------- |
| 150 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' | 141 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' |
| 151 | 142 |
| 152 @charset "utf-8"; | |
| 153 #testdiv { background-color: green; } | 143 #testdiv { background-color: green; } |
| 154 @media print { | 144 @media print { |
| 155 #testdiv { background-color: red; } | 145 #testdiv { background-color: red; } |
| 156 } | 146 } |
| 157 @page :right { margin-left: 3cm; } | 147 @page :right { margin-left: 3cm; } |
| 158 @-webkit-keyframes bounce { | 148 @-webkit-keyframes bounce { |
| 159 0% { left: 0px; } | 149 0% { left: 0px; } |
| 160 100% { left: 200px; } | 150 100% { left: 200px; } |
| 161 } | 151 } |
| 162 @font-face { font-family: Foo; } | 152 @font-face { font-family: Foo; } |
| 163 | 153 |
| 164 Test 10 | 154 Test 10 |
| 165 -------------------------------------- | 155 -------------------------------------- |
| 166 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' | 156 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' |
| 167 | 157 |
| 168 @charset "utf-8"; | |
| 169 #testdiv { background-color: green; } | 158 #testdiv { background-color: green; } |
| 170 @media print { | 159 @media print { |
| 171 #testdiv { background-color: red; } | 160 #testdiv { background-color: red; } |
| 172 } | 161 } |
| 173 @page :right { margin-left: 3cm; } | 162 @page :right { margin-left: 3cm; } |
| 174 @-webkit-keyframes bounce { | 163 @-webkit-keyframes bounce { |
| 175 0% { left: 0px; } | 164 0% { left: 0px; } |
| 176 100% { left: 200px; } | 165 100% { left: 200px; } |
| 177 } | 166 } |
| 178 @font-face { font-family: Foo; } | 167 @font-face { font-family: Foo; } |
| 179 | 168 |
| 180 Test 11 | 169 Test 11 |
| 181 -------------------------------------- | 170 -------------------------------------- |
| 182 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' | 171 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' |
| 183 | 172 |
| 184 #testdiv { background-color: green; } | 173 #testdiv { background-color: green; } |
| 185 | 174 |
| 186 Test 12 | 175 Test 12 |
| 187 -------------------------------------- | 176 -------------------------------------- |
| 188 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' | 177 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(0, 128, 0)' |
| 189 | 178 |
| 190 @charset "utf-8"; | |
| 191 @import url("data:text/css;charset=utf-8,%23testdiv%7Bbackground-color%3Agreen%2
0!important%7D"); | 179 @import url("data:text/css;charset=utf-8,%23testdiv%7Bbackground-color%3Agreen%2
0!important%7D"); |
| 192 #testdiv { background-color: green; } | 180 #testdiv { background-color: green; } |
| 193 @media all { | 181 @media all { |
| 194 #testdiv { background-color: red; } | 182 #testdiv { background-color: red; } |
| 195 } | 183 } |
| 196 @page :right { margin-left: 3cm; } | 184 @page :right { margin-left: 3cm; } |
| 197 @-webkit-keyframes bounce { | 185 @-webkit-keyframes bounce { |
| 198 0% { left: 0px; } | 186 0% { left: 0px; } |
| 199 100% { left: 200px; } | 187 100% { left: 200px; } |
| 200 } | 188 } |
| 201 @font-face { font-family: Foo; } | 189 @font-face { font-family: Foo; } |
| 202 | 190 |
| 203 Test 13 | 191 Test 13 |
| 204 -------------------------------------- | 192 -------------------------------------- |
| 205 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(255, 0, 0)' | 193 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(255, 0, 0)' |
| 206 | 194 |
| 207 @charset "utf-8"; | |
| 208 #testdiv { background-color: green; } | 195 #testdiv { background-color: green; } |
| 209 @media all { | 196 @media all { |
| 210 #testdiv { background-color: red; } | 197 #testdiv { background-color: red; } |
| 211 } | 198 } |
| 212 @page foo { margin-left: 3cm; } | 199 @page foo { margin-left: 3cm; } |
| 213 @-webkit-keyframes bounce { | 200 @-webkit-keyframes bounce { |
| 214 0% { left: 0px; } | 201 0% { left: 0px; } |
| 215 100% { left: 200px; } | 202 100% { left: 200px; } |
| 216 } | 203 } |
| 217 @font-face { font-family: Foo; } | 204 @font-face { font-family: Foo; } |
| 218 | 205 |
| 219 Test 14 | 206 Test 14 |
| 220 -------------------------------------- | 207 -------------------------------------- |
| 221 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(255, 0, 0)' | 208 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(255, 0, 0)' |
| 222 | 209 |
| 223 @charset "utf-8"; | |
| 224 #testdiv { background-color: green; } | 210 #testdiv { background-color: green; } |
| 225 @media all { | 211 @media all { |
| 226 #testdiv { background-color: red; } | 212 #testdiv { background-color: red; } |
| 227 } | 213 } |
| 228 @page :right { margin-left: 3cm; } | 214 @page :right { margin-left: 3cm; } |
| 229 @-webkit-keyframes bounce { | 215 @-webkit-keyframes bounce { |
| 230 0% { left: 0px; } | 216 0% { left: 0px; } |
| 231 100% { left: 200px; } | 217 100% { left: 200px; } |
| 232 40% { left: 40px; } | 218 40% { left: 40px; } |
| 233 } | 219 } |
| 234 @font-face { font-family: Foo; } | 220 @font-face { font-family: Foo; } |
| 235 | 221 |
| 236 Test 15 | 222 Test 15 |
| 237 -------------------------------------- | 223 -------------------------------------- |
| 238 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(255, 0, 0)' | 224 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(255, 0, 0)' |
| 239 | 225 |
| 240 @charset "utf-8"; | |
| 241 #testdiv { background-color: green; } | 226 #testdiv { background-color: green; } |
| 242 @media all { | 227 @media all { |
| 243 #testdiv { background-color: red; } | 228 #testdiv { background-color: red; } |
| 244 } | 229 } |
| 245 @page :right { margin-left: 3cm; } | 230 @page :right { margin-left: 3cm; } |
| 246 @-webkit-keyframes bounce { | 231 @-webkit-keyframes bounce { |
| 247 0% { left: 0px; } | 232 0% { left: 0px; } |
| 248 } | 233 } |
| 249 @font-face { font-family: Foo; } | 234 @font-face { font-family: Foo; } |
| 250 | 235 |
| 251 Test 16 | 236 Test 16 |
| 252 -------------------------------------- | 237 -------------------------------------- |
| 253 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(255, 0, 0)' | 238 PASS getComputedStyle(testElement, null).getPropertyValue('background-color') is
'rgb(255, 0, 0)' |
| 254 | 239 |
| 255 @charset "utf-8"; | |
| 256 #testdiv { background-color: green; } | 240 #testdiv { background-color: green; } |
| 257 @media all { | 241 @media all { |
| 258 #testdiv { background-color: red; } | 242 #testdiv { background-color: red; } |
| 259 } | 243 } |
| 260 @page :right { margin-left: 3cm; } | 244 @page :right { margin-left: 3cm; } |
| 261 @-webkit-keyframes bounce { | 245 @-webkit-keyframes bounce { |
| 262 0% { left: 0px; } | 246 0% { left: 0px; } |
| 263 100% { left: 200px; } | 247 100% { left: 200px; } |
| 264 } | 248 } |
| 265 @font-face { font-family: Bar; } | 249 @font-face { font-family: Bar; } |
| 266 | 250 |
| 267 PASS successfullyParsed is true | 251 PASS successfullyParsed is true |
| 268 | 252 |
| 269 TEST COMPLETE | 253 TEST COMPLETE |
| 270 | 254 |
| OLD | NEW |