Blitz - WPT: ellipse-auto-rx-css-clip-path.html

wpt / svg / shapes / reftests / ellipse-auto-rx-css-clip-path.html

/svg/shapes/reftests/ellipse-auto-rx-css-clip-path.html

<!DOCTYPE html>
<html>
<title>SVG ellipse with auto rx/ry as CSS clip-path: url() reference resolves per SVG 2</title>
<link rel="help" href="https://w3c.github.io/svgwg/svg2-draft/shapes.html#EllipseElement">
<link rel="help" href="https://drafts.fxtf.org/css-masking/#the-clip-path">
<link rel="match" href="ellipse-auto-rx-css-clip-path-ref.html">
<meta name="assert" content="An ellipse with auto rx (or auto ry) referenced via CSS clip-path: url(...) must clip identically to an ellipse with the resolved explicit value, per SVG 2 §10.4.">
<svg width="320" height="160">
  <defs>
    <clipPath id="auto-rx" clipPathUnits="userSpaceOnUse">
      <ellipse cx="80" cy="80" rx="auto" ry="50"/>
    </clipPath>
    <clipPath id="auto-ry" clipPathUnits="userSpaceOnUse">
      <ellipse cx="240" cy="80" rx="50" ry="auto"/>
    </clipPath>
  </defs>
  <rect x="0" y="0" width="160" height="160" fill="green" style="clip-path: url(#auto-rx)"/>
  <rect x="160" y="0" width="160" height="160" fill="green" style="clip-path: url(#auto-ry)"/>
</svg>
</html>

/svg/shapes/reftests/ellipse-auto-rx-css-clip-path-ref.html

<!DOCTYPE html>
<html>
<svg width="320" height="160">
  <defs>
    <clipPath id="explicit-1" clipPathUnits="userSpaceOnUse">
      <ellipse cx="80" cy="80" rx="50" ry="50"/>
    </clipPath>
    <clipPath id="explicit-2" clipPathUnits="userSpaceOnUse">
      <ellipse cx="240" cy="80" rx="50" ry="50"/>
    </clipPath>
  </defs>
  <rect x="0" y="0" width="160" height="160" fill="green" style="clip-path: url(#explicit-1)"/>
  <rect x="160" y="0" width="160" height="160" fill="green" style="clip-path: url(#explicit-2)"/>
</svg>
</html>