vector-effect: non-scaling-stroke has no effect on a path with zero length

• Component: SVG
• Status: RESOLVED DUPLICATE

[Rich Harris]

The CSS property `vector-effect: non-scaling stroke` maintains an SVG element's stroke width regardless of any transforms that have been applied to it, including transforms resulting from a viewBox.

When applied to a `<path>` element with a path length of zero, it has no effect.

To reproduce, create an HTML page with the following code and open it in Safari:

```html
<svg preserveAspectRatio="none" viewBox="0 0 100 100">
  <path stroke="red" d="M25 50 A0 0 0 0 1 25 50"></path>
  <path stroke="blue" d="M75 50 A0 0 0 0 1 75.0001 50"></path>
</svg>

<style>
  svg {
    width: 100%;
    height: 500px;
    border: 1px solid black;
  }

  path {
    stroke-width: 20px;
    stroke-linejoin: round;
    stroke-linecap: round;
    vector-effect: non-scaling-stroke;
  }
</style>
```

Expected result: the red dot and the blue dot are identically-sized. This is what happens in Chrome and Firefox.

Actual result: the red dot is larger, and stretched to the same degree as the SVG itself.

[Said Abou-Hallawa]

*** This bug has been marked as a duplicate of bug 208441 ***