LayoutTests/svg/custom/recursive-pattern.svg

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
    <pattern patternUnits="userSpaceOnUse" id="pattern0" x="0" y="0" width="100" height="100">
        <rect x="0" y="0" width="50" height="50" fill="black"/>
        <rect x="50" y="50" width="100" height="100" fill="green"/>
    </pattern>

    <pattern patternUnits="userSpaceOnUse" id="pattern1" x="0" y="0" width="100" height="100">
        <rect x="0" y="0" width="50" height="50" fill="url(#pattern1)"/>
        <rect x="50" y="50" width="100" height="100" fill="green"/>
    </pattern>

    <pattern patternUnits="userSpaceOnUse" id="pattern2" x="0" y="0" width="100" height="100">
        <rect x="50" y="50" width="100" height="100" fill="green"/>
        <rect x="0" y="0" width="50" height="50" fill="url(#pattern1)"/>
    </pattern>

    <pattern id="pattern3" x="0" y="0" width="100" height="100" xlink:href="#pattern1"/>
    <pattern id="pattern4" x="0" y="0" width="100" height="100" xlink:href="#pattern2"/>

    <pattern id="pattern6" xlink:href="#pattern5"/>
    <pattern patternUnits="userSpaceOnUse"  id="pattern5" x="0" y="0" width="100" height="100">
        <rect x="0" y="0" width="50" height="50" fill="url(#pattern6)"/>
        <rect x="50" y="50" width="100" height="100" fill="green"/>
    </pattern>

    <rect id="rect" x="0" y="0" width="50" height="50" fill="url(#pattern7)"/>
    <pattern patternUnits="userSpaceOnUse" id="pattern7" x="0" y="0" width="100" height="100">
        <use xlink:href="#rect"/>
        <rect id="reuse" x="50" y="50" width="100" height="100" fill="green"/>
    </pattern>
    
    <rect id="rect2" x="0" y="0" width="50" height="50" fill="url(#pattern8)"/>
    <use id="use" xlink:href="#rect2"/>
    <pattern patternUnits="userSpaceOnUse" id="pattern8" x="0" y="0" width="100" height="100">
        <g id="reuse2">
            <use xlink:href="#reuse"/>
            <use xlink:href="#use"/>
        </g>
    </pattern>

    <pattern patternUnits="userSpaceOnUse" id="pattern9" x="0" y="0" width="100" height="100">
        <use xlink:href="#reuse2"/>
    </pattern>
</defs>

<rect x="0" y="0" width="100" height="100" fill="url(#pattern1)"/>
<rect x="100" y="0" width="100" height="100" fill="url(#pattern2)"/>
<rect x="200" y="0" width="100" height="100" fill="url(#pattern3)"/>
<rect x="0" y="100" width="100" height="100" fill="url(#pattern4)"/>
<rect x="100" y="100" width="100" height="100" fill="url(#pattern5)"/>
<rect x="200" y="100" width="100" height="100" fill="url(#pattern6)"/>
<rect x="0" y="200" width="100" height="100" fill="url(#pattern7)"/>
<rect x="100" y="200" width="100" height="100" fill="url(#pattern8)"/>
<rect x="200" y="200" width="100" height="100" fill="url(#pattern9)"/>

<line x1="325" x2="325" y1="0" y2="300" stroke="red"/>
<text text-anchor="middle" x="325" y="350">Both sides of the red line should look identical</text>

<!-- This is the reference rendering -->
<g transform="translate(350,0)">
    <rect x="0" y="0" width="100" height="100" fill="url(#pattern0)"/>
    <rect x="100" y="0" width="100" height="100" fill="url(#pattern0)"/>
    <rect x="200" y="0" width="100" height="100" fill="url(#pattern0)"/>
    <rect x="0" y="100" width="100" height="100" fill="url(#pattern0)"/>
    <rect x="100" y="100" width="100" height="100" fill="url(#pattern0)"/>
    <rect x="200" y="100" width="100" height="100" fill="url(#pattern0)"/>
    <rect x="0" y="200" width="100" height="100" fill="url(#pattern0)"/>
    <rect x="100" y="200" width="100" height="100" fill="url(#pattern0)"/>
    <rect x="200" y="200" width="100" height="100" fill="url(#pattern0)"/>
</g>
</svg>