Declaration matcher by regular expression is finishing too early.

[pszczesniak]

During parsing large CSS codebase i've noticed that in a specific case an error is thrown:

missing '}'

to be more precise: below is an example of something that breaks it:

div {
	background-image:url("data:image/svg+xml;utf8,<svg width='120' height='12' xmlns='http://www.w3.org/2000/svg' ><text style='paint-order:stroke fill; clip-path: inset(-3px);' stroke-width='13' fill='black' x='3' y='7' font-size='9px' font-family='Consolas, monospace'>TEST</text></svg>");
}

👇

style='paint-order:stroke fill; clip-path: inset(-3px);'

To be precise - the last semicolon.

Problem lies in the regular expression:

css/lib/parse/index.js

Line 227 in 434aa17

var val = match(/^((?:'(?:\\'|.)*?'|"(?:\\"|.)*?"|\([^\)]*?\)|[^};])+)/);

It ends before that semicolon which i mentioned above, here is an example:

https://regex101.com/r/NBh8Cy/1

Simplest solution is to remove that semicolon, but i won't have that ability always.

[monarosej]

All modern browsers support the following 140 color names (click on a color name, or a hex value, to view the color as the background-color along with different text colors):

[holblin]

Hi @pszczesniak , did you try to use https://github.com/adobe/css-tools ?
I did some changes in the regex and improved the parsing in a couple of cases...
It might not work, but if you open an issue there, I will take a look at some point (please be patient though).