fix(transformer/styled-components): remove unnecessary whitespace when removing block comments in CSS minification

[overlookmotel]

Remove special logic for inserting spaces when removing comments. Instead, treat comments as equivalent to whitespace, and apply the same rules.

This fixes 2 problems:

1. Don't add unnecessary space when a block comment appears after a character like {.
2. Do add a space when a block comment is the whole quasi between 2 interpolations, to prevent them being merged.

Simplifying this logic also gives 1%-2% speed-up on transformer benchmarks.

Input:

styled.div`.a {/* blah */color: green; }`;
styled.div`${x}/* blah */${y}`;

Previous output post-minification:

styled.div`.a{ color:green;}`;
styled.div`${x}${y}`;

After this PR:

styled.div`.a{color:green;}`;
styled.div`${x} ${y}`;

[overlookmotel]

• fix(transformer/styled-components): remove leading whitespace when literal starts with block comment containing interpolation in CSS minification #13391
• fix(transformer/styled-components): remove unnecessary whitespace when removing block comments in CSS minification #13390 👈 (View in Graphite)
• main

---

How to use the Graphite Merge Queue

Add either label to this PR to merge it via the merge queue:

• 0-merge - adds this PR to the back of the merge queue
• hotfix - for urgent hot fixes, skip the queue and merge this PR next

You must have a Graphite account in order to use the merge queue. Sign up using this link.

An organization admin has enabled the Graphite Merge Queue in this repository.

Please do not merge from GitHub as this will restart CI on PRs being processed by the merge queue.

This stack of pull requests is managed by Graphite. Learn more about stacking.

[codspeed-hq]

CodSpeed Instrumentation Performance Report

Merging #13390 will degrade performances by 11.86%

_{Comparing 08-29-fix_transformer_styled-components_remove_unnecessary_whitespace_when_removing_block_comments_in_css_minification (cf5175c) with main (95d4311)¹}

Summary

❌ 1 regressions
✅ 37 untouched benchmarks

⚠️ Please fix the performance issues or acknowledge them on CodSpeed.

Benchmarks breakdown

	Benchmark	BASE	HEAD	Change
❌	mangler[cal.com.tsx]	3.4 ms	3.8 ms	-11.86%

Footnotes

1. No successful run was found on main (cf5175c) during the generation of this report, so 95d4311 was used instead as the comparison base. There might be some changes unrelated to this pull request in this report. ↩

[Copilot]

Pull Request Overview

This PR fixes CSS minification issues in the styled-components transformer related to block comment handling. It removes unnecessary spaces when removing block comments after certain characters while preserving necessary spaces when comments separate interpolations.

• Simplifies comment removal logic by treating comments as whitespace
• Fixes unnecessary space insertion after characters like { when removing comments
• Ensures proper spacing between interpolations when comments are the only content between them

Reviewed Changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 2 comments.

File	Description
crates/oxc_transformer/src/plugins/styled_components.rs	Refactored comment removal logic to use insert_space_if_required function consistently
tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/minify-comments/input.js	Added test cases with comments after { character
tasks/transform_conformance/tests/plugin-styled-components/test/fixtures/minify-comments/output.js	Updated expected output to show proper minification without unnecessary spaces

---

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}

[graphite-app]

Merge activity

• Aug 30, 4:19 AM UTC: Boshen added this pull request to the Graphite merge queue.
• Aug 30, 4:29 AM UTC: Merged by the Graphite merge queue.