Blitz - WPT: non-scaling-stroke-002.html

wpt / svg / painting / reftests / non-scaling-stroke-002.html

/svg/painting/reftests/non-scaling-stroke-002.html

<!DOCTYPE html>
<html class="reftest-wait">
<title>non-scaling-stroke with scaling</title>
<link rel="help" href="https://w3c.github.io/svgwg/svg2-draft/painting.html#PaintingVectorEffects" />
<link rel="match" href="green-100x100.svg" />
<script src="/common/reftest-wait.js"></script>
<body>
  <style>
    body {
      border: none;
      margin: 0;
      width: 200px;
      height: 200px;
      transform: scale(2);
    }
    svg {
      width: 100px;
      height: 100px;
    }
    rect {
      fill: red;
      stroke: green;
      stroke-width: 50px;
      transform: scale(0);
      animation: reset 0.01s ease-in-out 1 both;
      vector-effect: non-scaling-stroke;
    }
    @keyframes reset { to { transform: none; }}
  </style>
  <svg>
    <rect width="75" height="75"/>
    <script>
      document.querySelector('rect').onanimationend = takeScreenshot;
    </script>
  </svg>
</body>
</html>

/svg/painting/reftests/green-100x100.svg

<svg xmlns="http://www.w3.org/2000/svg">
  <rect width="100" height="100" fill="green"/>
</svg>