Latest SVGO is creating SVG files that some renderers can’t handle

[arielsalminen]

SVGO version:

 [email protected]

I'm submitting a:
[x] bug report
[ ] feature request
[ ] support request

Current behavior:
It seems like the latest version of SVGO is creating SVG files that some renderers can’t handle.

A little backstory to explain the situation:

Our team relies on SVGO automation in our design system to optimize SVG icons used. In addition to developers, those icons are used by the design team as well inside vector based tools such as Sketch.

Using the latest version of SVGO the icons look like this when opened in Sketch app (left side we have an icon optimized with SVGOMG using SVGO v1.0.3 and on the right using SVGOMG that has been updated to the latest v1.3.0):

Expected behavior:
SVG files produced should work in any vector based design tool in addition to browsers.

Steps to reproduce:

1. Download the following icon https://cdn.jsdelivr.net/npm/@duetds/[email protected]/lib/assets/action-car-transfer.svg
2. Open in Sketch to see that it works just fine.
3. Now use f.ex. https://jakearchibald.github.io/svgomg/ (SVGOMG now uses 1.3.0 as well) to optimize it with just the default settings.
4. Download and try to open in Sketch. You get the above broken results.

Other information:
There’s a possibly related issue in SVGOMG repository as well: jakearchibald/svgomg#167

[GreLI]

What renderer do you use? Probably, it's not fully compliant, since browsers render it ok. Have you tried option like described in #1137 (comment)?

[wbervoets]

FYI importing an SVG file optimized with SVGO 1.3 + standard setting did not work, using the following config did work :-)

{
    "plugins": [
        { "convertPathData": { "noSpaceAfterFlags": false } },
        { "mergePaths": { "noSpaceAfterFlags": false } }
    ]
}

[arielsalminen]

@GreLI @wbervoets To be completely honest, I don’t know what’s the rendering engine here, but this issue is fixed with what @wbervoets suggested above too. So:

{
    "plugins": [
        { "convertPathData": { "noSpaceAfterFlags": false } },
        { "mergePaths": { "noSpaceAfterFlags": false } }
    ]
}

[wbervoets]

@viljamis I was trying to import the SVG into Android Studio 3.5 (which converts it to Android VectorDrawable xml format).