blob: fb278b36c75efae202177bdf765d8b2244f80167 [file] [log] [blame]
<!DOCTYPE html>
<html>
<body>
<p>Test passes if you see a single 100px by 100px green box below.</p>
<div id="host" style="width: 100px; height: 100px;"></div>
<svg>
<defs>
<rect id="rect" width="100" height="100" fill="red" />
</defs>
</svg>
<template>
<svg viewbox="0 0 100 100">
<defs>
<rect id="rect" width="100" height="100" fill="green" />
<filter id="image">
<feImage x="0" y="0" href="#rect" />
</filter>
</defs>
<rect id="rect" width="100" height="100" style="filter:url(#image)">
</svg>
</template>
<script>
const shadowRoot = host.attachShadow({mode: 'closed'});
shadowRoot.appendChild(document.querySelector('template').content.cloneNode(true));
</script>
</body>
</html>