feat(mint): add unused CSS custom properties detection - #113
Draft
nujovich wants to merge 5 commits into
Draft
Conversation
…S custom property detection
…d with --remove-unused flag
…d custom properties detection
Owner
Author
|
All milestones complete. Ready for review when you are. |
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.
Card: https://github.com/nujovich/mint-radar/issues/22
What: Adds deterministic dead-code analysis for CSS custom properties to Mint. Milestone 1 introduces the
UnusedCustomPropertyIssueandUnusedCustomPropertiesAudittypes inlib/types.ts, which track every custom property declared (--*) versus every property referenced (var(--*)), and adds an optionalunusedCustomPropertiesfield toAuditReport. Later milestones add the parser, CLI wiring with an optional--remove-unusedflag, and Tailwind-scale test fixtures.Why: Tailwind and other utility-heavy projects emit
--tw-*and similar custom properties that are never consumed, inflating CSS output and complicating maintenance. No reliable automated tool detects truly-unused custom properties across CSS, HTML, and JS (PurgeCSS and Chrome Coverage both mishandlevar()references and dynamically-injected properties). Mint can fill this gap with cross-file reference analysis, reinforcing its positioning as a thorough CSS health auditor.Milestones
UnusedCustomPropertyIssueandUnusedCustomPropertiesAudittypes to lib/types.ts tracking defined (--) vs referenced (var(--)) custom properties, plusunusedCustomPropertiesfield on AuditReportlintUnusedCustomProperties()in lib/css-lint-rules.mjs: walk all --* declarations and var() references, emit the defined-but-unused diff with selectors and cleanup suggestionsHow to test:
npm run typecheck npm testMilestone 4 detail
Added a Tailwind-style test fixture in
lib/__fixtures__/tailwind-custom-properties.css: 1000 custom properties across 20 color palettes (50 shades each), with 750 referenced in utility classes and 250 declared but never used, simulating dead tokens left behind after a palette refactor.Tests added to
lib/__tests__/css-lint-rules.test.mjs(newlintUnusedCustomProperties at scale (Tailwind-style fixture)describe block, 4 tests)::rootwith a cleanup suggestion