Status: PASS | Duration: 5ms | Subtests: 1/1 | Open test on wpt.live | Open ref on wpt.live | wpt.fyi
/css/css-masking/clip-path/clip-path-transform-mutated-002.html
<!DOCTYPE html> <html class="reftest-wait"> <title>CSS Masking: Mutating a <clipPath>s 'transform' updates the clip path</title> <link rel="author" title="Fredrik Söderquist" href="mailto:fs@opera.com"> <link rel="help" href="https://drafts.fxtf.org/css-masking-1/#the-clip-path""> <link rel="help" href="https://crbug.com/881700"> <link rel="match" href="reference/clip-path-transform-mutated-002-ref.html"> <meta name="assert" content="Check that clipPath's clients should be notified when the 'transform' presentation attribute (or CSS property) was mutated on a <clipPath>."/> <script src="/common/reftest-wait.js"></script> <script src="/common/rendering-utils.js"></script> <style> #target { width: 100px; height: 100px; background-color: green; clip-path: url(#clip); } </style> <div id="target"></div> <svg> <clipPath id="clip"> <rect width="1" height="1"/> </clipPath> </svg> <script> waitForAtLeastOneFrame().then(function() { clip.setAttribute('transform', 'scale(100 100)'); takeScreenshot(); }); </script>
/css/css-masking/clip-path/reference/clip-path-transform-mutated-002-ref.html
<!DOCTYPE html> <div style="width: 100px; height: 100px; background-color: green"></div>