| <!DOCTYPE html> |
| <svg style="display:none;"> |
| <rect id="useReference" width="200" height="200" fill="red" /> |
| <path id="pathReference1" d="M0 160 L 100 160" /> |
| <path id="pathReference2" d="M1000 1000 L 2000 2000" /> |
| <rect id="filteredRectReference" width="100" height="100" fill="red" /> |
| <pattern id="patternReference" width="100" height="100" viewBox="0 0 100 100"> |
| <rect width="100" height="20" fill="red"/> |
| </pattern> |
| </svg> |
| <template id="template"> |
| <svg width="200" height="500"> |
| <defs> |
| <rect id="useReference" width="100" height="100" fill="green" /> |
| <path id="pathReference1" d="M1000 1000 L 2000 2000" /> |
| <path id="pathReference2" d="M0 160 L 100 160" /> |
| <rect id="filteredRectReference" width="100" height="100" fill="green" /> |
| <filter id="filterReference"> |
| <feImage x="0" y="200" width="100" height="100" xlink:href="#filteredRectReference"/> |
| </filter> |
| <pattern id="patternReference" width="100" height="100" viewBox="0 0 100 100"> |
| <rect width="100" height="100" fill="green"/> |
| </pattern> |
| </defs> |
| <use xlink:href="#useReference" /> |
| <text> |
| <textPath xlink:href="#pathReference1" fill="red" font-size="40px">FAIL</textPath> |
| <textPath xlink:href="#pathReference2" fill="green" font-size="40px">PASS</textPath> |
| </text> |
| <rect width="200" height="300" fill="red" filter="url(#filterReference)" /> |
| <rect y="300" width="100" height="100" fill="url(#patternReference)" /> |
| </svg> |
| </template> |
| <script> |
| document.body.attachShadow({mode: 'open'}).appendChild(template.content.cloneNode(true)); |
| </script> |