testing/web-platform/tests/svg/struct/reftests/use-data-url-setAttribute.tentative.html


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

<!doctype HTML>
<meta charset="utf-8">
<title>Testcase for changing a valid &#x3c;use&#x3e; to a data URL:</title>
<link rel="help" href="https://svgwg.org/svg2-draft/struct.html#UseElementHrefAttribute">
<link rel="match" href="reference/green-100x100.html">
<script>
  function go() {
    const use = document.querySelector("use");
    use.setAttribute("href", "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxyZWN0IGlkPSJvcmFuZ2UtcmVjdCIgd2lkdGg9IjEwMCIgaGVpZ2h0PSIxMDAiIGZpbGw9Im9yYW5nZSIvPgo8L3N2Zz4=#orange-rect");
  }
</script>
<body onload="go()">
  <svg id="mySVG">
    <rect id="red" width="100" height="100" fill="red"></rect>
    <rect id="green" width="100" height="100" fill="green"></rect>
    <use x="100" y="0" href="#red"></use>
  </svg>
</body>