Safari SVG Marker "stroke-dasharray" Bug

by Roman Bruckner

HTML

<svg width="100%" height="100%" overflow="visible">
  <defs>
    <marker
      id="my-marker"
      orient="auto"
      overflow="visible"
      markerUnits="userSpaceOnUse"
    >
      <path stroke="red" fill="white" d="M 0 -5 -10 0 0 5 z"></path>
    </marker>
    <marker
      id="my-marker-explicit"
      orient="auto"
      overflow="visible"
      markerUnits="userSpaceOnUse"
    >
      <path
        stroke="red"
        fill="white"
        stroke-dasharray="none"
        d="M 0 -5 -10 0 0 5 z"
      ></path>
    </marker>
    <marker
      id="my-marker-workaround"
      orient="auto"
      stroke-dasharray="1,0"
      overflow="visible"
      markerUnits="userSpaceOnUse"
    >
      <path stroke="red" fill="white" d="M 0 -5 -10 0 0 5 z"></path>
    </marker>
  </defs>
  <g transform="scale(2,2)">
    <path
      id="my-path"
      d="M 50 20 200 20"
      stroke="red"
      stroke-width="2"
      stroke-dasharray="5,5"
      marker-start="url(#my-marker)"
    />

    <path
      id="my-path"
      d="M 50 40 200 40"
      stroke="red"
      stroke-width="2"
      stroke-dasharray="5,5"
      marker-start="url(#my-marker-explicit)"
    />

    <path
      id="my-path"
      d="M 50 60 200 60"
      stroke="red"
      stroke-width="2"
      stroke-dasharray="5,5"
      marker-start="url(#my-marker-workaround)"
    />
  </g>
</svg>