OLD | NEW |
1 <svg xmlns="http://www.w3.org/2000/svg" width="200" height="200"> | 1 <svg xmlns="http://www.w3.org/2000/svg" width="10" height="10"> |
2 <defs> | 2 <defs> |
3 <style type="text/css"><![CDATA[ | 3 <style type="text/css"><![CDATA[ |
4 #square { | 4 #square { |
5 fill: red; | 5 fill: red; |
6 -webkit-animation: keyframes 0.20s; | 6 -webkit-animation: keyframes 0.01s; |
7 -webkit-animation-fill-mode: forwards; | 7 -webkit-animation-fill-mode: forwards; |
8 -webkit-animation-timing-function: step-end; | 8 -webkit-animation-timing-function: step-end; |
9 } | 9 } |
10 @-webkit-keyframes keyframes { | 10 @-webkit-keyframes keyframes { |
11 0% { fill: pink } | 11 0% { fill: pink } |
| 12 /* To prevent flakiness, rapidly switch to green */ |
| 13 1% { fill: green } |
12 100% { fill: green } | 14 100% { fill: green } |
13 } | 15 } |
14 ]]></style> | 16 ]]></style> |
15 </defs> | 17 </defs> |
16 <rect id="square" width="100" height="100" x="50" y="50"></rect> | 18 <rect id="square" width="5" height="5" x="5" y="5"></rect> |
17 </svg> | 19 </svg> |
OLD | NEW |