Repository navigation
v0.0.33 - Shorthand fixes
Code and Release notes by Claude Opus 5 High:
What was failing
Three shorthands tests, all about whitespace that CSS doesn't need:
0023—border:4px solid#0000andborder-image:url(border.png)30 round0031—font-variation-settings:"wght"600,"wdth"750035—border:var(--bw)var(--bs)var(--bc)
What I changed
New tokens.js — a CSS Syntax tokenizer for values, plus elideRedundantSeparators(). This replaces four overlapping regex helpers (elideSpaceBeforeHexColors, elideSpaceAfterParentheses, elideSpaceAfterStrings, hasCommaSeparatedEntries) with one rule: a whitespace run goes only when
- one of its neighbours spells out the boundary itself (ends with
)/]/}/quote, or starts with#/!/quote/bracket), - the two tokens re-tokenize unchanged when written together (so
4px solidstays,solid #0000collapses), and - neither side is a
+/-math operator.
Custom properties are now excluded, since their whitespace is a token they store (0020, 0021). src\value\tokens.js:476-503
config.js — added hasPositionalComponents(), derived from shorthandMap rather than hard-coded: a shorthand is positional when its longhands are the same property repeated per side/axis (padding-top/-right/..., row-gap, border-top-left-radius). Those keep their separators when assembled from longhands (shorthands/0034); type-distinguished shorthands like border and border-image don't (0023, 0035).
minify.js — separator removal now happens once, at the end, after all color shortening; the border style/width reorder regex now verifies the second component actually is a width before swapping.
Verification beyond the test suite
I diffed output against the pre-change code over 193 real-world CSS files (real-world-css-libraries, without running npm run real): net -79 bytes, timings unchanged. Every file that grew was a bug fix — the old ordering emitted invalid CSS such as border:1px solidsilver and border:6px solidred (the color shortener rewrote #c0c0c0 back to a name after the space had already been dropped). The one genuine size increase is tw-animate-css, where a custom property now correctly keeps its whitespace tokens.