CSSOM icon indicating copy to clipboard operation
CSSOM copied to clipboard

")" not found when trying to import font with multiple weights

Open RahulLanjewar93 opened this issue 2 years ago • 3 comments

https://github.com/NV/CSSOM/blob/a469aae2f92e454e669aec821781626924f98d17/lib/parse.js#L333-L358

This fails for import rules for fonts which have multiple font weights.

Example :- @import url(https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@300;400&display=swap);

I get the error:- ")" not found. I am guessing it's due to semicolon being encountered first before closing the bracket.

RahulLanjewar93 avatar Jan 31 '23 19:01 RahulLanjewar93

@papandreou @NV Any idea how we can resolve this?

RahulLanjewar93 avatar Jan 31 '23 19:01 RahulLanjewar93

Yeah, looks like the parser doesn't handle semicolons within url(...).

One possible workaround is to add quotes around the url:

@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@300;400&display=swap');

Or you can percent-encode the semicolon:

@import url(https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@300%3B400&display=swap);

papandreou avatar Jan 31 '23 22:01 papandreou

Thanks for the workaround.

RahulLanjewar93 avatar Feb 01 '23 07:02 RahulLanjewar93