<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" onload="runRepaintTest()">
<script xlink:href="../../fast/repaint/resources/repaint.js"></script>
<script>
<![CDATA[
    function repaintTest() {
        document.getElementById("inner").setAttribute("width", "100%");
    }
]]>
</script>

<!-- should result in a blue square with right-aligned objects -->
<svg id="inner" width="50%" height="100%">
    <defs>
        <polygon id="triangle" points="0,0 0,20 20,10" style="fill:white"/>
    </defs>
    <rect fill="blue" width="100%" height="100%"/>
    <rect fill="white" x="100%" y="60" transform="translate(-20,0)" width="20" height="20"/>
    <text x="100%" y="100" text-anchor="end" fill="white">right-aligned text</text>
    <use x="100%" y="120" transform="translate(-20,0)" xlink:href="#triangle"/>
</svg>
</svg>