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