CL-6490: scan plugins-ui for Tailwind utilities, and guard the scan list - #224
Merged
Merged
Conversation
… the @source list apps/web/src/tailwind.css scanned artifact-ui, bench-ui, chat-ui, and settings-ui for Tailwind utilities but not plugins-ui, even though app.css imports its prebuilt stylesheet the same way. plugins-ui's component geometry lives entirely as Tailwind utility classes, so `min-h-16` and the `[&>*:last-child]:border-b-0` group-divider rule never made it into the built CSS — silently, since a missing @source entry errors nowhere. tasks-ui had the same gap (imported but not scanned); it has no Tailwind utilities in its source today, but adding it now keeps the invariant that every imported package is also scanned, so the same silent gap can't reopen the moment it adds one. check:tailwind-source guards this: it fails when a package whose stylesheet app.css imports is missing from tailwind.css's @source list, naming the exact line to add.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
apps/web/src/tailwind.cssscannedartifact-ui,bench-ui,chat-ui, andsettings-uifor Tailwind utility classes but notplugins-ui, even thoughapps/web/src/app.cssimports its prebuiltstyles.cssthe same way as the others.plugins-ui's component geometry lives entirely as Tailwind utility classes (its ownstyles.cssis a one-line comment saying exactly that), so nothing generated the CSS formin-h-16(plugin-card.tsx) or[&>*:last-child]:border-b-0(the group dividers inplugins-gallery.tsx,mcp-servers-section.tsx,mcp-preset-cards.tsx). Added the missing@source "../../../packages/plugins-ui/src";line.tasks-uihad the identical gap (imported, never scanned). It has no Tailwind utility classes in its source today (its ownstyles.csscomment says "layout glue only"), so this wasn't visibly broken — but leaving it out means the same silent failure reopens the moment someone adds one. Added it too, to make "every package whose stylesheet is imported is also scanned" an actual invariant instead of a case-by-case judgment call.check:tailwind-sourceguard (wired intopackage.jsonand.github/workflows/ci.yml, same pattern ascheck:web-utilities/check:ui-vocabulary): fails when a package whose stylesheetapp.cssimports has no matching@sourceentry intailwind.css, naming the exact line to add. The point of the message is that this failure mode is otherwise silent — no build error, just missing CSS.Verification (before/after)
Built
apps/weband grepped the emitted CSS:tailwind.cssto the pre-fix@sourcelist (onlyartifact-ui/bench-ui/chat-ui/settings-ui) and ran the new check against it: fails, naming bothplugins-uiandtasks-uiand the exact@sourceline to add.check:tailwind-sourcepasses, and the built CSS now contains.min-h-16{min-height:calc(var(--spacing) * 16)}and.\[\&\>\*\:last-child\]\:border-b-0>:last-child{...}— both previously absent.installed-strip.tsx'sdata-[state=connected]:bg-success(and its siblingdata-[state=needs_attention]:bg-destructive) still does not compile even with the@sourcefix. Reason: apps/web's own Tailwind build never registers--color-success/--color-destructiveas@themecolor tokens — those only exist as plain:rootcustom properties inherited from react-ui's already-compiled stylesheet, so this build's Tailwind compiler doesn't know "success"/"destructive" are valid colors and can't emit the variant utility.bg-success/bg-destructivealone happen to work only because react-ui's own separate build already emits those plain classes for its own components — but thedata-[state=...]:combinator is specific toinstalled-strip.tsxand only this build could generate it. Fixing this needs--color-success/--color-destructive(or similar) registered intailwind.css's own@themeblock — a different, small fix, out of scope here since it's a distinct root cause from the missing@sourceline. Flagging for a follow-up.CL-6472 read
Traced whether the missing utilities plausibly caused CL-6472's "Plugins page shows only GitHub" symptom. They don't look like a contributing cause:
min-h-16only sets a row's minimum height; without it the row still renders at its intrinsic content height (padding + text) — shorter, not hidden.[&>*:last-child]:border-b-0only removes the last row's bottom border; without it the row still renders, just with an extra border line (a double border, not a missing row).plugins-gallery.tsx'sPluginGridmaps directly over thepluginsprop passed in fromapps/web/src/pages/plugins-page.tsx— which preset rows exist at all is decided entirely upstream, by data fetching/resolution, before any of these CSS classes apply.None of the three "confirmed dead" classes can make a row disappear or collapse to invisible — they're geometry/cosmetic only. This doesn't rule out a stale-build angle in general, but the specific utilities named in CL-6490 don't explain CL-6472's symptom. Not closing CL-6472 — just adding this as evidence.
Test plan
bun test scripts/checks/test/tailwind-source.test.ts— new unit tests, 5 passbun run check:tailwind-source— passes on the fixed tree; fails (naming both gaps) when run against the pre-fix@sourcelistbun run check:web-utilities— passes, confirmsmin-h-16and the last-child border rule now land in built CSSbun test scripts/checks/test(the CI "Structural check self-tests" step) — 109 pass, includes the new filebun run lint— clean (0 errors)bun run check(typecheck, lint, test) — passesFixes CL-6490.