| <!DOCTYPE html> |
| <html class="reftest-wait"> |
| <title>SVG Test: Independent CSS transitions on svg:use instantiation and corresponding element</title> |
| <link rel="help" href="https://svgwg.org/svg2-draft/struct.html#UseElement"> |
| <link rel="match" href="use-element-transitions-ref.html"> |
| <style> |
| use { |
| font-size: 40px; |
| } |
| g { |
| font-size: 120px; |
| } |
| text { |
| transition: font-size 100s steps(2, start); |
| } |
| </style> |
| <svg> |
| <use id="use_elm" xlink:href="#tmpl" /> |
| <g id="g_elm"> |
| <text id="tmpl" x="10" y="100">Hello!</text> |
| </g> |
| </svg> |
| <script> |
| requestAnimationFrame(() => { |
| requestAnimationFrame(() => { |
| tmpl.style.fontSize = "80px"; |
| document.documentElement.classList.remove('reftest-wait'); |
| }); |
| }); |
| </script> |
