[Bug] CSS with ;; leads to error

JoKalliauer commented 5 years ago

Processing File:Talehunt_logo.svg (MWE: Bug1097.svg.txt ) with

svgo -i Input.svg.txt -o Output.svg --pretty --indent=1  --disable=inlineStyles

leads to

TypeError: Cannot read property '0' of undefined
at getPropertyDescriptor (C:\Users\jkalliau\AppData\Roaming\npm\node_modules\svgo\node_modules\csso\node_modules\css-tree\lib\utils\names.js:65:24)
at getPropertyFingerprint (C:\Users\jkalliau\AppData\Roaming\npm\node_modules\svgo\node_modules\csso\lib\restructure\6-restructBlock.js:68:20)
at List.<anonymous> (C:\Users\jkalliau\AppData\Roaming\npm\node_modules\svgo\node_modules\csso\lib\restructure\6-restructBlock.js:213:27)
at List.eachRight (C:\Users\jkalliau\AppData\Roaming\npm\node_modules\svgo\node_modules\csso\node_modules\css-tree\lib\utils\list.js:182:12)
at Object.processRule (C:\Users\jkalliau\AppData\Roaming\npm\node_modules\svgo\node_modules\csso\lib\restructure\6-restructBlock.js:211:18)
at Object.enter (C:\Users\jkalliau\AppData\Roaming\npm\node_modules\svgo\node_modules\csso\lib\restructure\6-restructBlock.js:293:25)
at Object.<anonymous> (C:\Users\jkalliau\AppData\Roaming\npm\node_modules\svgo\node_modules\csso\node_modules\css-tree\lib\walker\create.js:13:16)
at List.walkNode (C:\Users\jkalliau\AppData\Roaming\npm\node_modules\svgo\node_modules\csso\node_modules\css-tree\lib\walker\create.js:161:19)
at List.eachRight (C:\Users\jkalliau\AppData\Roaming\npm\node_modules\svgo\node_modules\csso\node_modules\css-tree\lib\utils\list.js:182:12)
at Object.eval [as StyleSheet] (eval at createTypeIterator (C:\Users\jkalliau\AppData\Roaming\npm\node_modules\svgo\node_modules\csso\node_modules\css-tree\lib\walker\create.js:112:12), <anonymous>:5:15)

Input

Bug1097.svg.txt

<svg viewBox="0 0 2203 1777" xmlns="http://www.w3.org/2000/svg">
 <style type="text/css">
  .st6{font-family:Helvetica LT Std, Helvetica, Arial; font-size:118px;; stroke-opacity:0; fill-opacity:0;}
 </style>
 <text class="st6" transform="translate(353.67 1514)">
  tell stories in 250 characters
 </text>
</svg>

Copyright

Author: *'''Original creator:''' TaleHunt *'''Tracing and conversion to SVG:''' {{U|Arv1989}} *'''Code optimization:''' {{u|Codename Lisa}} LIzenze: [cc-by-sa-4.0](https://creativecommons.org/licenses/by-sa/4.0/) Source: https://commons.wikimedia.org/wiki/File:Talehunt_logo.svg

strarsis commented 5 years ago

@JoKalliauer: The error comes from csso package used by the minifyStyles plugin:

$ svgo --disable={minifyStyles,inlineStyles} -i test.svg -o test.min.svg

test.svg:
Done in 67 ms!
11.228 KiB - 1.7% = 11.034 KiB

This is a known issue in csso.

alexander-akait commented 5 years ago

/cc @strarsis i think we should disable css minification by default, it is not safe because csso is not maintained

strarsis commented 5 years ago

@evilebottnawi: *Or replace it with another CSS minifier.

alexander-akait commented 5 years ago

cssnano :smile:

strarsis commented 5 years ago

@JoKalliauer, @evilebottnawi: Prepared a PR that replaces csso with cssnano: https://github.com/svg/svgo/pull/1127/ cssnano will support required synchronous usage in next release

Edit: After some discussions, it was decided to not replace csso with cssnano because csso offers structural optimization which cssnano doesn't.

lahmatiy commented 5 years ago

The issue was fixed in CSSO 4.0.2.

strarsis commented 5 years ago

@lahmatiy: Awesome! @GreLI: PR ready for updating csso to 4.0.2: https://github.com/svg/svgo/pull/1172 @JoKalliauer: The SVG has been added as test to cause the csso error, and after updating csso to 4.0.2 the test SVG minifies just fine.

GreLI commented 5 years ago

v1.3.1 with the fix is just released.

svg / svgo

[Bug] CSS with ;; leads to error #1097

Input