Custom transform API truncates custom property name

[stevenpetryk]

Hey there, just a tiny surprise when using the new visitor API. My use case is this:

.foo {
- color: opacity($black, 0.5);
+ color: hsl(var(--black-hsl) / 0.5);
}

But I noticed that LightningCSS was transforming to:

.foo {
  color: hsl(var(--ack-hsl) / 0.5);
}

A small reproduction shows that the ident passed to any var gets its first two characters chopped off.

Playground link ↗️

Of course, fixing was as easy as prefixing the ident with two characters, but that doesn't seem right.

[devongovett]

Variable names should include the leading -- when you return them, so try prepending that to your varName. Example

[stevenpetryk]

Yeah, it makes sense that the -- is included—but since custom property names always begin with -- (I think?), perhaps it'd be valuable to warn/panic when trying to print a custom property with an invalid ident, rather than silently replacing the first two characters.

[stevenpetryk]

(What I'm getting at here is that the silent replacement is the surprising/footgun part, not the "idents should start with --" part)

[devongovett]

Yep, I can add an error