Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

SVG <animate>'s begin attribute is incorrectly modified #1775

Closed
yunsii opened this issue Aug 12, 2023 · 1 comment · Fixed by #1862
Closed

SVG <animate>'s begin attribute is incorrectly modified #1775

yunsii opened this issue Aug 12, 2023 · 1 comment · Fixed by #1862
Labels

Comments

@yunsii
Copy link

yunsii commented Aug 12, 2023

Describe the bug
SVG 's begin attribute is incorrectly modified when begin value start with previous animate id.

To Reproduce

<!-- loading.svg  -->
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
  <circle cx="12" cy="12" r="0" fill="currentColor">
    <animate id="svgSpinnersPulseMultiple0" fill="freeze" attributeName="r" begin="0;svgSpinnersPulseMultiple2.end"
      calcMode="spline" dur="1.2s" keySplines=".52,.6,.25,.99" values="0;11" />
    <animate fill="freeze" attributeName="opacity" begin="0;svgSpinnersPulseMultiple2.end" calcMode="spline" dur="1.2s"
      keySplines=".52,.6,.25,.99" values="1;0" />
  </circle>
  <circle cx="12" cy="12" r="0" fill="currentColor">
    <animate id="svgSpinnersPulseMultiple1" fill="freeze" attributeName="r" begin="svgSpinnersPulseMultiple0.begin+0.2s"
      calcMode="spline" dur="1.2s" keySplines=".52,.6,.25,.99" values="0;11" />
    <animate fill="freeze" attributeName="opacity" begin="svgSpinnersPulseMultiple0.begin+0.2s" calcMode="spline"
      dur="1.2s" keySplines=".52,.6,.25,.99" values="1;0" />
  </circle>
  <circle cx="12" cy="12" r="0" fill="currentColor">
    <animate id="svgSpinnersPulseMultiple2" fill="freeze" attributeName="r" begin="svgSpinnersPulseMultiple0.begin+0.4s"
      calcMode="spline" dur="1.2s" keySplines=".52,.6,.25,.99" values="0;11" />
    <animate fill="freeze" attributeName="opacity" begin="svgSpinnersPulseMultiple0.begin+0.4s" calcMode="spline"
      dur="1.2s" keySplines=".52,.6,.25,.99" values="1;0" />
  </circle>
</svg>

After run svg loading.svg -o loading.min.svg, output svg:

<!-- loading.min.svg  -->
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24">
  <circle cx="12" cy="12" r="0" fill="currentColor">
    <animate fill="freeze" attributeName="r" begin="0;svgSpinnersPulseMultiple2.end" calcMode="spline" dur="1.2s"
      keySplines=".52,.6,.25,.99" values="0;11" />
    <animate fill="freeze" attributeName="opacity" begin="0;svgSpinnersPulseMultiple2.end" calcMode="spline" dur="1.2s"
      keySplines=".52,.6,.25,.99" values="1;0" />
  </circle>
  <circle cx="12" cy="12" r="0" fill="currentColor">
    <animate fill="freeze" attributeName="r" begin="svgSpinnersPulseMultiple0.begin+0.2s" calcMode="spline" dur="1.2s"
      keySplines=".52,.6,.25,.99" values="0;11" />
    <animate fill="freeze" attributeName="opacity" begin="svgSpinnersPulseMultiple0.begin+0.2s" calcMode="spline"
      dur="1.2s" keySplines=".52,.6,.25,.99" values="1;0" />
  </circle>
  <circle cx="12" cy="12" r="0" fill="currentColor">
    <animate fill="freeze" attributeName="r" begin="svgSpinnersPulseMultiple0.begin+0.4s" calcMode="spline" dur="1.2s"
      keySplines=".52,.6,.25,.99" values="0;11" />
    <animate fill="freeze" attributeName="opacity" begin="svgSpinnersPulseMultiple0.begin+0.4s" calcMode="spline"
      dur="1.2s" keySplines=".52,.6,.25,.99" values="1;0" />
  </circle>
</svg>

Expected behavior
Origin svg render result: https://icon-sets.iconify.design/svg-spinners/pulse-multiple/
It broken after transformed.

Desktop

  • SVGO Version [3.0.2]
  • NodeJs Version [16.14.0]
  • OS: [Ubuntu 18.04.6 LTS on WSL 2]

Additional context
Similar previous issue: svg-sprite/svg-sprite#526

@yunsii yunsii added the bug label Aug 12, 2023
@KTibow
Copy link
Contributor

KTibow commented Nov 30, 2023

Could be I just don't understand the problem but I can't reproduce this issue with default settings The issue seems to have been introduced in 3.0.1 or 3.0.2

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants