| <!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() { |
| target.animate([{'x': '100px'}, {'x': '100px'}], {fill: 'forwards'}); |
| }, true); |
| </script> |