Some CSS selectors broken during CSS compression

[strawhatgami]

The following CSS rule [style="width: 60%;"]{background-color:red;} added in conf/userstyle.css is transformed into [style="width:60%;"]{background-color:red;} (without the space in the CSS selector) in the webpage's css.php file.

A temporary way to get around that is to uncheck the 'compress' option in the configuration options.

I'm on 2018-04-22a "Greebo".

[splitbrain]

A PR with test cases and a fix would be welcome.

[selfthinker]

I would say this is an extreme edge case. That kind of syntax is very uncommon and extremely brittle to begin with. I would personally never use it, although it is valid.
A fix would still be welcome, but I'm not sure if it can be fixed without sacrificing more file size than necessary. Not sure what the rule should be when spaces should be kept. Maybe when inside quotation marks?

One better way of writing that CSS (although still really dodgy and not recommended) would be

[style*="width"][style*="60%"]{background-color:red;}

But best give that element a class or find other ways to select it.

[phy25]

I think it should be good to ignore quotation marks only. If this is happening, CSS like font-family: "Segoe UI" should also be affected, but I haven't tested this yet. - EDIT: not this case.

BTW, a resource for guys working on this: https://stackoverflow.com/questions/17123809/parsing-css-files-using-regex (Just don't have time recently to work on this)

[Klap-in]

Is this something that could be upstreamed, it isn't?

[splitbrain]

@Klap-in you mean moving the compressor out of DokuWiki into its own library? I'd like that. I'd also be open for using a different compressor if we find something matching our requirements.

[Klap-in]

Hmm, I assumed that the lesserphp library performs the compression as well.
I see the compressor is actually the step after the lesserphp.

To obtain some understanding, what are the requirements?

• compatible with our GPL2 license
• well maintained and available via composer
  e.g. https://packagist.org/packages/matthiasmullie/minify (MIT) or https://packagist.org/packages/mrclay/minify (BSD-3-clause)
• functional: i have no idea of exact technical specs.. do we have specific url paths or other specialities, short comment for browser hacks maybe?

In first random search I spotted: https://github.com/matthiasmullie/minify. By who @phy25 is already inspired for the current solution.

[phy25]

I wonder "short comment for browser hacks" is still useful in this Chrome age. Also tests are important, too.

Maybe we can open another issue for the compressor library selection, since I will soon open the PR for a (temporary) fix.