Skip to content

CSS: collapse multiple whitespace in custom property values - #1034

Closed
hdimer wants to merge 1 commit into
tdewolff:masterfrom
hdimer:fix-custom-property-whitespace
Closed

hdimer wants to merge 1 commit into
tdewolff:masterfrom
hdimer:fix-custom-property-whitespace

Conversation

@hdimer

@hdimer hdimer commented Sep 8, 2026

Copy link
Copy Markdown
Contributor

Fixes #740.

:root { --v: 1px 2px } kept its internal whitespace: the CustomPropertyGrammar branch trimmed only the ends of the value and wrote the rest verbatim.

This collapses runs of two or more whitespace characters to a single space, which is the transform you sketched in #305 ("replace multiple whitespace by a single space, but not when between quotes") and confirmed on #740.

It does not go as far as the issue's expected output. #740 asks for --v:a,b,c and this gives --v:a, b, c. Collapsing a run keeps the token stream identical, just shorter; dropping the whitespace next to a comma removes a token, which is only safe if you know the grammar, and a custom property's grammar is unknown by construction (the suite has --foo: if(x > 5) this.width = 10). Happy to add the comma case if you want it, but it seemed like the wrong side of that line to cross uninvited.

The "not when between quotes" part is why it does not reuse parse.ReplaceMultipleWhitespace: that one is a raw byte scan and would rewrite --v: "a b". Instead the value is re-lexed and only whitespace tokens are collapsed, so strings, comments and url() keep their whitespace. Two cases fall out of the tokenizer, both tested:

  • \ followed by a newline is not a valid escape, so the backslash is a delim token. Collapsing the newline after it would produce \ , a valid escaped space, and change the token stream. Guarded.
  • a hex escape already swallows one following whitespace character, so \41 b becomes \41 b.

A lone whitespace character is left as it is. There is a prescan for two adjacent whitespace bytes so that values with nothing to collapse never reach the lexer; without it a stylesheet of 8000 design tokens was ~44% slower, with it the difference is in the noise.

One behaviour change worth naming: getComputedStyle().getPropertyValue('--v') returns the specified text, so JS comparing against '1px 2px' would now see '1px 2px'. That is the same class of change as the trimming this branch already does.

Checked against master over 300k randomised custom property values: the output differs only by collapsed whitespace runs, the non-whitespace bytes are identical in every case, and all seven files in tests/css/corpus minify byte-identically.

@hdimer hdimer closed this Sep 8, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

css: Whitespace between values isn't collapsed

1 participant