Blitz - WPT: effect-reference-feimage-003.html

wpt / css / filter-effects / effect-reference-feimage-003.html

/css/filter-effects/effect-reference-feimage-003.html

<!DOCTYPE html>
<title>CSS Filters: feImage and CSS reference filters.</title>
<link rel="help" href="https://drafts.fxtf.org/filter-effects-1/#feImageElement">
<link rel="help" href="https://drafts.fxtf.org/filter-effects-1/#FilterProperty">
<link rel="match" href="reference/effect-reference-feimage-003-ref.html">
<meta name="assert" content="This test ensures that CSS reference filters support a dynamically attached feImage."/>
<meta name="fuzzy" content="maxDifference=0-11; totalPixels=0-17278"/>
<body>

<style>
  #filtered {
    width: 160px;
    height: 90px;
    filter: url(#imagereplace);
  }
</style>

<script type="text/html" id="source">
  <div id="filtered"></div>
  <svg width="0" height="0">
    <filter id="imagereplace" x="0%" y="0" width="100%" height="100%">
       <feimage xlink:href="support/color-palette.png"/>
    </filter>
  </svg>
</script>

<script>
  document.body.offsetLeft;
  var div = document.createElement('div');
  div.innerHTML = document.getElementById('source').textContent;
  document.body.appendChild(div);
</script>

</body>

/css/filter-effects/reference/effect-reference-feimage-003-ref.html

<!DOCTYPE html>
<img src="../support/color-palette.png">