Skip to content

fix: avoid unresolved embedded CSS tag ranges#9631

Merged
ematipico merged 2 commits intobiomejs:mainfrom
raashish1601:contributor-11/biome-9625
Mar 27, 2026
Merged

fix: avoid unresolved embedded CSS tag ranges#9631
ematipico merged 2 commits intobiomejs:mainfrom
raashish1601:contributor-11/biome-9625

Conversation

@raashish1601
Copy link
Copy Markdown

@raashish1601 raashish1601 commented Mar 27, 2026 •
edited
Loading

Summary

Fixes #9625 by keeping JS embedded-snippet delegation aligned with the service's current extraction behavior.

The service currently only extracts single-chunk tagged templates as embedded snippets, but the JS formatter could still emit embedded markers for later multi-chunk templates in the same file. When a file mixed a formatable styled-components template with a later interpolation like ${({ theme }) => css``};, that left unresolved embedded tags and triggered an internal formatter error.

This change only delegates embedded formatting for single-chunk template literals, which matches the service today and avoids the unresolved-tag crash. It also adds a workspace regression test for the exact reported styled-components repro and a changeset for the user-visible formatter fix.

Test Plan

  • cargo test -p biome_service issue_9625
  • cargo test -p biome_service format_js_with_embedded_css
  • cargo fmt --all --check
  • Reproduced the original CLI failure before the patch and verified it no longer throws the internal Expected end tag of kind Embedded but found Group formatter error afterward.

Docs

  • Added a changeset.

@changeset-bot
Copy link
Copy Markdown

changeset-bot Bot commented Mar 27, 2026

🦋 Changeset detected

Latest commit: d537d39

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 13 packages
Name Type
@biomejs/biome Patch
@biomejs/cli-win32-x64 Patch
@biomejs/cli-win32-arm64 Patch
@biomejs/cli-darwin-x64 Patch
@biomejs/cli-darwin-arm64 Patch
@biomejs/cli-linux-x64 Patch
@biomejs/cli-linux-arm64 Patch
@biomejs/cli-linux-x64-musl Patch
@biomejs/cli-linux-arm64-musl Patch
@biomejs/wasm-web Patch
@biomejs/wasm-bundler Patch
@biomejs/wasm-nodejs Patch
@biomejs/backend-jsonrpc Patch

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

@github-actions github-actions Bot added A-Project Area: project A-Formatter Area: formatter L-JavaScript Language: JavaScript and super languages labels Mar 27, 2026
@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented Mar 27, 2026

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: 36185482-0ce3-4438-b616-87d44e78d2a0

📥 Commits

Reviewing files that changed from the base of the PR and between 13b3261 and d537d39.

📒 Files selected for processing (3)
  • .changeset/witty-files-hear.md
  • crates/biome_js_formatter/src/js/auxiliary/template_chunk_element.rs
  • crates/biome_service/src/workspace/server.tests.rs

Walkthrough

This PR resolves a crash that occurred when experimentalEmbeddedSnippetsEnabled was active and code contained multi-chunk template expressions (such as CSS-in-JS styled-components with interpolations). The fix modifies is_plausible_embed_template to reject template expressions that are not single-chunk, preventing the formatter from emitting embed tags for ranges the service cannot process. A changeset entry and regression test are included.

Possibly related PRs

Suggested labels

A-Formatter, L-JavaScript, L-CSS

Suggested reviewers

  • ematipico
  • siketyan
  • dyc3
🚥 Pre-merge checks | ✅ 4
✅ Passed checks (4 passed)
Check name Status Explanation
Title check ✅ Passed The title directly and clearly describes the main fix: avoiding unresolved embedded CSS tag ranges in formatted output.
Description check ✅ Passed The description clearly explains the issue, the fix, test plan, and validates alignment with issue #9625.
Linked Issues check ✅ Passed Changes implement the core requirement from #9625: preventing formatter crash when mixed styled-component templates contain multi-chunk interpolations with embedded CSS.
Out of Scope Changes check ✅ Passed All changes (template check logic, regression test, and changeset) are directly scoped to fixing the unresolved embedded tag crash.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

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.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@codspeed-hq
Copy link
Copy Markdown

codspeed-hq Bot commented Mar 27, 2026

Merging this PR will not alter performance

✅ 58 untouched benchmarks
⏩ 168 skipped benchmarks1

Comparing raashish1601:contributor-11/biome-9625 (d537d39) with main (04243b0)2

Open in CodSpeed

Footnotes

  1. 168 benchmarks were skipped, so the baseline results were used instead. If they were deleted from the codebase, click here and archive them to remove them from the performance reports. ↩

  2. No successful run was found on main (13b3261) during the generation of this report, so 04243b0 was used instead as the comparison base. There might be some changes unrelated to this pull request in this report. ↩

@ematipico ematipico merged commit 599dd04 into biomejs:main Mar 27, 2026
17 checks passed
@github-actions github-actions Bot mentioned this pull request Mar 25, 2026
Merged
@coderabbitai coderabbitai Bot mentioned this pull request Mar 28, 2026
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@ematipico ematipico ematipico approved these changes

Assignees

No one assigned

Labels

A-Formatter Area: formatter A-Project Area: project L-JavaScript Language: JavaScript and super languages

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

📝 css in js format error with experimentalEmbeddedSnippetsEnabled

2 participants

@raashish1601 @ematipico