Accept the legacy -webkit-box-* properties, inert outside display -webkit-box

[thejackshelton]

Requested by Jack · project thread

Before: -webkit-box-orient, -webkit-box-pack, -webkit-box-align, -webkit-box-flex, -webkit-box-direction and -webkit-box-ordinal-group were refused as unknown properties on every target, so any stylesheet carrying the old flexbox prefixes (Tailwind's line-clamp-none, autoprefixed CSS, old resets) failed to compile even where they do nothing.

After: Dragon accepts them with Chrome 145's grammar and emits nothing for them. Chrome reads these properties only under display: -webkit-box and -webkit-inline-box (Blink ComputedStyle::IsDeprecatedFlexbox, and is_webkit_box_ in the flex layout algorithm), and Dragon already refuses those displays (display-legacy.ts), so outside them they are inert. The line-clamp pattern is still refused, through its display and -webkit-line-clamp.

How: the six names are surrogate shorthands of the flex family that set no longhand (the same shape as text-orientation). Their grammar comes from Blink CSSParserFastPaths::IsValidKeywordPropertyAndValue (the keyword ones), WebkitBoxFlex::ParseSingleValue (any number) and WebkitBoxOrdinalGroup::ParseSingleValue (a positive integer), added to gen-css-grammar.ts as overrides, since webref lists them without a syntax. -webkit-box-flex and -webkit-box-ordinal-group take the number grammar for math functions.

Proof: the new Chrome fixture legacy-box-inert (ltr and rtl) sets every property, with values that would visibly move boxes if they applied, on flex rows, flex columns, inline-flex and block boxes, and compares Dragon's layout with Chrome's.

Test changes, with reasons:

• aliases.test.ts: the "stay refused as unknown properties" list swaps -webkit-box-orient and -webkit-box-flex, which are now accepted, for -webkit-box-reflect and -webkit-line-clamp, which are still unknown.
• display-legacy.test.ts: the line-clamp pattern now reports two refusals (display and -webkit-line-clamp) instead of three, because -webkit-box-orient alone is inert.

Passed: locally pnpm typecheck and the platform-free legacy-box, aliases, display-legacy, seams, registry-claims, animation-kinds, writing-mode, math-validity and units tests. On CI, at 312894b after pnpm ci:regen (run 38085466501): parity 603 passed (the new legacy-box-inert cases included), css-escapes 2, display-parse 1, hit-lanes 6, chrome-ports 13, registry-claims 8, tailwind-sweep units 37 and sweep 1. Parity's reject-gradient-em-unknown and the summary test that counts it fail identically on master f88834c (run 38086087370), so they are not this PR's. The regen moves no profile row and no status; rows only gain the new fixture's cases.

🤖 Generated with Claude Code

https://claude.ai/code/session_01JKaoLmr6Q9ij268L5imav2

---

Generated by Claude Code

[thejackshelton]

One Chrome case fails on this head, and it is not this PR's: reject-gradient-em-unknown in packages/parity/test/parity.test.ts (plus the summary test that counts it). It fails the same way on master itself at f88834c (test-files run https://github.com/compiled-run/dragoncss/actions/runs/38086087370: 602 passed, the same 2 failed). The fixture is a background gradient with an em stop (fixture-groups/background.ts), which this diff does not touch. I found no open fix to port yet.

Everything this PR touches passes on 312894b (run https://github.com/compiled-run/dragoncss/actions/runs/38085466501): parity 603 passed, the new legacy-box-inert cases included; css-escapes 2, display-parse 1, hit-lanes 6, chrome-ports 13, registry-claims 8, tailwind-sweep units 37 and sweep 1. The checks CI run is green.

---

Generated by Claude Code