Do not crash when migrating empty classes#20205
Conversation
This is something we do in core as well
Confidence Score: 5/5Safe to merge — the change is a narrow, well-tested guard that keeps empty rules out of the migration path without touching any non-empty rule handling. The fix is minimal and targeted: a new isEmpty predicate gates the class-collection walk, the cleanup condition is tightened to preserve empty rules in the defaults clone, and a dedicated test covers all four empty-rule variants (truly empty, comment-above, comment-inside, comment-below). No existing tests regress; the snapshot format change is purely cosmetic. No files require special attention. Reviews (2): Last reviewed commit: "update changelog" | Re-trigger Greptile |
|
Caution Review failedThe pull request is closed. ℹ️ Recent review info⚙️ Run configurationConfiguration used: Repository UI Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (1)
WalkthroughThis PR enhances the migrateAtLayerUtilities codemod: it adds an isEmpty() helper to skip rules/containers with no nodes or only comment nodes when collecting utility class names, removes contiguous trailing comment nodes alongside removed rules, refines cleanup to treat default and non-default 🚥 Pre-merge checks | ✅ 4✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. Comment |
This PR fixes a crash while using
npx @tailwindcss/upgradewhen migrating classes with no body inside of an@layer utilities.When running
npx @tailwindcss/upgrade, one thing we do is migrate the CSS from:To:
We already have some logic that leaves non-classe (IDs, attribute selectors, ...) alone. But if we are migrating a class that has no body, then we will migrate that as well:
Is turned into:
@utility empty { }But later in the migration process this will result in an error because a
@utilityhas to have at least some nodes.Ideally, you don't even have CSS that has empty rules since it doesn't have any effect in the browser (except of making your CSS file bigger), but it could be that you don't have control over this file, so a fix is still valid.
This PR solves that by leaving those rules alone, and keep them in an
@layer utilities.Fixes: #20204
Test plan