Blitz - WPT: masked.html

wpt / svg / extensibility / foreignObject / masked.html

/svg/extensibility/foreignObject/masked.html

<!doctype HTML>
<title>Tests that an SVG mask applies to a foreignObject element</title>
<link rel="match" href="masked-ref.html">
<link rel="author" title="Chris Harrelson" href="mailto:chrishtr@chromium.org">
<link rel="help" href="https://w3c.github.io/svgwg/svg2-draft/single-page.html#embedded-ForeignObjectElement"/>
<meta name="fuzzy" content="maxDifference=0-138; totalPixels=0-124">
<svg style="display: block">
    <foreignObject x="0" y="0" width="32" height="32" mask="url(#circle)">
        <div style="width: 32px; height: 32px; background: green"></div>
    </foreignObject>
    <mask id="circle" maskContentUnits="objectBoundingBox" viewBox="0 0 1 1">
        <circle fill="white" cx="0.5" cy="0.5" r="0.5"></circle>
    </mask>
</svg>

/svg/extensibility/foreignObject/masked-ref.html

<!doctype HTML>
<div style="width: 32px; height: 32px; background: green; overflow: hidden; border-radius: 50%"></div>