| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <svg> | 2 <svg> |
| 3 <defs> | 3 <defs> |
| 4 <rect x="0" y="0" width="100" height="40" id="target" fill="green" /> | 4 <rect x="0" y="0" width="100" height="40" id="target" fill="green" /> |
| 5 <rect x="100" y="0" width="100" height="40" id="expected" fill="red" /> | 5 <rect x="100" y="0" width="100" height="40" id="expected" fill="red" /> |
| 6 <use xlink:href="#target" id="use"/> | 6 <use xlink:href="#target" id="use"/> |
| 7 </defs> | 7 </defs> |
| 8 | 8 |
| 9 <use y="50" xlink:href="#expected"/> | 9 <use y="50" xlink:href="#expected"/> |
| 10 <use y="100" xlink:href="#expected"/> | 10 <use y="100" xlink:href="#expected"/> |
| 11 | 11 |
| 12 <use y="50" xlink:href="#target"/> | 12 <use y="50" xlink:href="#target"/> |
| 13 <use y="100" xlink:href="#use"/> | 13 <use y="100" xlink:href="#use"/> |
| 14 </svg> | 14 </svg> |
| 15 <script> | 15 <script> |
| 16 target.animate([{'svg-x': '100'}, {'svg-x': '100'}], {fill: 'forwards'}); | 16 target.animate([{'svg-x': '100'}, {'svg-x': '100'}], {fill: 'forwards'}); |
| 17 </script> | 17 </script> |
| OLD | NEW |