Status: PASS | Duration: 6ms | Subtests: 1/1 | Open test on wpt.live | Open ref on wpt.live | wpt.fyi
/css/filter-effects/tainting-feflood-dynamic-002.html
<!DOCTYPE html> <html class="reftest-wait"> <title>feFlood: tainting state changes dynamically</title> <link rel="help" href="https://drafts.fxtf.org/filter-effects/#tainted-filter-primitives"> <link rel="help" href="https://drafts.fxtf.org/filter-effects/#fedisplacemnentmap-restrictions"> <link rel="match" href="reference/green-100x100.html"> <script src="/common/reftest-wait.js"></script> <svg> <filter id="flood" color-interpolation-filters="sRGB"> <feFlood flood-color="rgb(0%, 100%, 50%)" style="color: rgb(0%, 100%, 50%)"/> <feDisplacementMap in="SourceGraphic" xChannelSelector="G" yChannelSelector="B" scale="100"/> </filter> <rect width="100" height="100" fill="red"/> <rect width="100" height="100" fill="green" filter="url(#flood)"/> </svg> <script> requestAnimationFrame(() => { requestAnimationFrame(() => { document.querySelector('feFlood').style.floodColor = 'color-mix(in srgb, currentcolor 99.9%, black)'; takeScreenshot(); }); }); </script>
/css/filter-effects/reference/green-100x100.html
<!DOCTYPE html> <div style="width: 100px; height: 100px; background-color: green"></div>