Draw transition shows small dot at the beginning of a path

[romaincazier]

Describe the bug

When the stroke-linecap is set to something else than "butt", a small dot is visible at the beginning of a path. This is only visible when applying a delay to the transition. This can be a problem if you have multiple paths and want them to be displayed one after the other.

Proposed solution

(tested locally) The transition could instead rely on stroke-dashoffset. Replace line 201 by:

css: (_t, u) => `
  stroke-dasharray: ${len} ${len};
  stroke-dashoffset: ${u * len};
`

Reproduction

https://svelte.dev/repl/5b62eb46687d4e219b970b38154705fa?version=3.43.1

System Info

Svelte 3.43.1

Severity

annoyance

[bluwy]

Confirmed the proposed solution works. The stroke-dasharray can also be simplified as just stroke-dasharray: ${len}. I don't think this would be a breaking change as this seems to be intended behaviour. Feel free to send a PR!

[Conduitry]

This should be fixed in 3.55.1 - https://svelte.dev/repl/5b62eb46687d4e219b970b38154705fa?version=3.55.1