[CSS] bug when handling var(foo)

Prettier 1.15.1 Playground link

--parser css

Input:

.a/root {
  transition: height var(transition-time)s;
}

Output:

.a/root {
  transition: height var(transition-time) s;
}

Note the extra space after var(transition-time).

[alexander-akait]

It is hard to fix it, logic around spaces based on prev, current and next types (i.e. function/number with unit/variable and etc), it is allow add spaces for math operators in Less and Sass and in calc in CSS, better avoid invalid CSS, it can lead to such consequences in many places, we can try to close this case, but then we can break the normal syntax

[lydell]

Yeah, I guess we could try to keep it as written. Just wanted to make sure this is something worth doing something about on Prettier’s side first (it could have been a mistake).

(CSS is difficult since we support an arbitrary superset of the standard, which forces us to apply “garbage in, garbage out” instead of throwing parse errors sometimes, and it’s not easy to to know what’s garbage and what’s not.)