| <!DOCTYPE html> |
| <script src="../../resources/run-after-layout-and-paint.js"></script> |
| <svg> |
| <defs> |
| <rect x="0" y="0" width="100" height="40" id="target" fill="green" /> |
| <rect x="100" y="0" width="100" height="40" id="expected" fill="red" /> |
| <use xlink:href="#target" id="use"/> |
| </defs> |
| |
| <use y="50" xlink:href="#expected"/> |
| <use y="100" xlink:href="#expected"/> |
| |
| <use y="50" xlink:href="#target"/> |
| <use y="100" xlink:href="#use"/> |
| </svg> |
| <script> |
| runAfterLayoutAndPaint(function() { |
| for (var i = 0; i < 5; ++i) |
| target.animate([ |
| {'x': '20px', composite: 'add'}, |
| {'x': '20px', composite: 'add'} |
| ], {fill: 'forwards'}); |
| }, true); |
| </script> |
