fix: minify a style="" body as a rule's contents in every CSS minimizer - #748
Conversation
…izer webpack hands an HTML `style=""` to the renderer as `css` with `as: "block-contents"`. Only cssnano read a bare declaration list; csso and clean-css answered with nothing, erasing the attribute, lightningcss and swc failed to parse it, and esbuild rejected `as` as an unknown option. Each now drops `as` from its options and minifies the body inside a rule, reading the contents back out (webpack/webpack#22288). Claude-Session: https://claude.ai/code/session_01Vszf1WJhCqatsMQ2xZLF9x
🦋 Changeset detectedLatest commit: 1370bc9 The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
|
Navigate logical layers of code changes, visualize relationships, and explore their blast radius. No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Advanced Run ID: 📒 Files selected for processing (2)
Included review availability: Your plan provides up to 4 included reviews per hour; 2 remain after this review. WalkthroughCSS minifiers now support a block-contents mode. They wrap declaration-list input in a rule, minify it, and extract the rule body. The change adds shared helpers and TypeScript declarations. Tests check minified output and source-map behavior. When extraction fails, minifiers return the original input. Priority: ➖ Normal Merge Risk: 🔵 Low · up to Some supported Node and Windows CI jobs skip the new block-contents checks for compatible CSS minimizers, leaving those combinations without regression coverage. This is a bounded test-confidence gap, so the change is mergeable with follow-up to align the gates with platform and package support. 🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Warning Some tools did not complete. Review the errors below. 🔧 ESLint
src/utils.jsESLint failed to execute (timeout). test/embedded-protocol.test.jsESLint skipped: the matched ESLint configuration already failed (timeout). Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
There was a problem hiding this comment.
Actionable comments posted: 3
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Advanced
Run ID: d44e99f8-4e9a-4567-ae64-d1e8f1415e72
⛔ Files ignored due to path filters (1)
test/__snapshots__/embedded-protocol.test.js.snapis excluded by!**/*.snap
📒 Files selected for processing (4)
.changeset/css-block-contents.mdsrc/utils.jstest/embedded-protocol.test.jstypes/utils.d.ts
Included review availability: Your plan provides up to 4 included reviews per hour; 1 remains after this review.
…s options `ruleBody` now skips braces inside strings and comments instead of declining the rule, `esbuildMinifyCss` no longer deletes `as` from the options object it is handed, and `swcMinifyCss` drops a map the options asked for when the body was wrapped. Claude-Session: https://claude.ai/code/session_01Vszf1WJhCqatsMQ2xZLF9x
cssnano@8 reaches for `Array.prototype.difference`, so the Node < 22 and Windows rows skip them through `RUN_CSS_TESTS`, like `css-minify-option`. Claude-Session: https://claude.ai/code/session_01Vszf1WJhCqatsMQ2xZLF9x
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## main #748 +/- ##
==========================================
+ Coverage 97.86% 97.89% +0.03%
==========================================
Files 5 5
Lines 1637 1665 +28
Branches 622 640 +18
==========================================
+ Hits 1602 1630 +28
Misses 35 35 ☔ View full report in Codecov by Harness. 🚀 New features to boost your workflow:
|
…leBody` The comment check loses its `closed + 2 > end` half, which an answer ending in `}` can never reach. Claude-Session: https://claude.ai/code/session_01Vszf1WJhCqatsMQ2xZLF9x
There was a problem hiding this comment.
Actionable comments posted: 1
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Advanced
Run ID: 1851a962-8db3-43df-a08b-c40a6bf787ae
⛔ Files ignored due to path filters (1)
test/__snapshots__/embedded-protocol.test.js.snapis excluded by!**/*.snap
📒 Files selected for processing (2)
src/utils.jstest/embedded-protocol.test.js
Included review availability: Your plan provides up to 4 included reviews per hour; 2 remain after this review.
Both are plain JavaScript supporting Node 10, so only cssnano and the native minimizers stay behind `RUN_CSS_TESTS`. The page cases assert their output instead of snapshotting it: a snapshot in a skipped block is reported obsolete, which fails a `--ci` row. Claude-Session: https://claude.ai/code/session_01Vszf1WJhCqatsMQ2xZLF9x
`ruleBody` now tracks brace depth instead of declining any unquoted brace, so
`--x:{a:b}` in a `style=""` is minified; a second rule or a block left open
still declines.
Claude-Session: https://claude.ai/code/session_01Vszf1WJhCqatsMQ2xZLF9x
Summary
webpack hands an HTML
style=""torenderEmbeddedSourceascsswithas: "block-contents", but only cssnano read a bare declaration list: csso and clean-css answered""(erasing the attribute), lightningcss and swc failed to parse it, and esbuild threw onasas an unknown option — the CSS side of webpack/webpack#22288. Each now dropsasfrom its options and minifies the body inside a rule, reading the contents back out and keeping the original text when the answer is not that one rule.What kind of change does this PR introduce?
fix
Did you add tests for your changes?
Yes —
test/embedded-protocol.test.jsdrives astyle=""body through all six CSS minimizers (failing before the fix for five of them) and unit-testsasRule/ruleBody.Does this PR introduce a breaking change?
No.
If relevant, what needs to be documented once your changes are merged or what have you already documented?
n/a
Use of AI
Claude Code traced webpack/webpack#22288 to this plugin, reproduced the CSS failures, wrote the fix and tests, and ran lint and the affected suites; the change was reviewed by the author.
🤖 Generated with Claude Code
https://claude.ai/code/session_01Vszf1WJhCqatsMQ2xZLF9x
Generated by Claude Code
Summary by CodeRabbit
styleattributes is now minified correctly by supported CSS minimizers, preserving declarations instead of dropping or rejecting them.