fix(html/formatter): style tag with lang #8356

ematipico · 2025-12-04T08:51:06Z

Summary

Closes #7917

Test Plan

Added a test

Docs

changeset-bot · 2025-12-04T08:51:10Z

🦋 Changeset detected

Latest commit: fdc0fb2

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

coderabbitai · 2025-12-04T08:54:12Z

Caution

Review failed

The pull request is closed.

Walkthrough

This PR adds a changeset and test(s), adds HtmlElement::is_supported_style_tag(&self) -> bool (true for <style> tags that are not lang="scss"), and updates the HTML formatter's embedded-content detection to use that predicate so <style lang="scss"> blocks are skipped instead of treated as embeddable.

Possibly related PRs

feat: support html.experimentalFullSupportEnabled for vue with jsx/tsx script #7986: Adjusts element language/attribute detection in crates/biome_html_syntax/src/element_ext.rs, touching the same predicates used by the HTML embedding logic.

Suggested reviewers

dyc3

Pre-merge checks and finishing touches

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title 'fix(html/formatter): style tag with lang' directly references the main change—fixing style tag handling when a lang attribute is present, addressing issue #7917.
Description check	✅ Passed	The description references issue #7917 and briefly outlines the test added, relating clearly to the changeset's purpose of fixing style tag handling.
Linked Issues check	✅ Passed	All objectives from issue #7917 are met: the PR avoids the internal formatter error when encountering <style lang="..."> blocks by introducing is_supported_style_tag() to skip SCSS style tags and adding appropriate tests.
Out of Scope Changes check	✅ Passed	All changes are directly related to fixing the style tag handling issue: the new method, embedded content logic adjustment, and test cases all target the documented problem.

📜 Recent review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 08898c9 and fdc0fb2.

⛔ Files ignored due to path filters (1)

crates/biome_cli/tests/snapshots/main_cases_handle_vue_files/full_support_enabled_and_scss_is_skipped.snap is excluded by !**/*.snap and included by **

📒 Files selected for processing (4)

.changeset/sad-boxes-lead.md (1 hunks)
crates/biome_cli/tests/cases/handle_vue_files.rs (1 hunks)
crates/biome_html_formatter/src/html/auxiliary/embedded_content.rs (1 hunks)
crates/biome_html_syntax/src/element_ext.rs (1 hunks)

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

coderabbitai

Actionable comments posted: 1

🧹 Nitpick comments (1)

.changeset/sad-boxes-lead.md (1)

5-5: Consider clarifying the fix description.

The current wording describes the old bug behaviour. Consider rephrasing to clearly state what Biome now does: "Biome no longer removes styles contained in a <style lang="scss"> when experimentalFullSupportEnabled is enabled."

As per coding guidelines, use present tense when describing Biome behaviour.

📜 Review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between b988274 and 08898c9.

⛔ Files ignored due to path filters (1)

crates/biome_cli/tests/snapshots/main_cases_handle_vue_files/full_support_enabled_and_scss_is_skipped.snap is excluded by !**/*.snap and included by **

📒 Files selected for processing (4)

.changeset/sad-boxes-lead.md (1 hunks)
crates/biome_cli/tests/cases/handle_vue_files.rs (2 hunks)
crates/biome_html_formatter/src/html/auxiliary/embedded_content.rs (1 hunks)
crates/biome_html_syntax/src/element_ext.rs (1 hunks)

🧰 Additional context used

📓 Path-based instructions (2)

**/*.rs

📄 CodeRabbit inference engine (CONTRIBUTING.md)

**/*.rs: Use the dbg!() macro for debugging output during testing, and pass the --show-output flag to cargo to view debug output
Use cargo t or cargo test to run tests; for a single test, pass the test name after the test command
Use snapshot testing with the insta crate; run cargo insta accept, cargo insta reject, or cargo insta review to manage snapshot changes
Write doctests as doc comments with code blocks; the code inside code blocks will be run during the testing phase
Use just f (alias for just format) to format Rust and TOML files before committing

Files:

crates/biome_cli/tests/cases/handle_vue_files.rs
crates/biome_html_syntax/src/element_ext.rs
crates/biome_html_formatter/src/html/auxiliary/embedded_content.rs

.changeset/**/*.md

📄 CodeRabbit inference engine (CONTRIBUTING.md)

.changeset/**/*.md: Create changesets for user-facing changes using just new-changeset; use headers with #### or ##### only; keep descriptions concise (1-3 sentences) and focus on user-facing changes
Use past tense when describing what was done ('Added new feature'), present tense when describing Biome behavior ('Biome now supports'); end sentences with a full stop
For new lint rules, show an example of an invalid case in an inline code snippet or code block; for rule changes, demonstrate what is now invalid or valid; for formatter changes, use a diff code block

Files:

.changeset/sad-boxes-lead.md

🧠 Learnings (19)

📓 Common learnings

Learnt from: CR
Repo: biomejs/biome PR: 0
File: crates/biome_analyze/CONTRIBUTING.md:0-0
Timestamp: 2025-11-27T23:04:02.022Z
Learning: Applies to crates/biome_analyze/**/*analyze/src/lint/**/*.rs : Use language tags in documentation code blocks (js, ts, tsx, json, css) and order properties consistently as: language, then `expect_diagnostic`, then options modifiers, then `ignore`, then `file=path`

📚 Learning: 2025-11-24T18:05:20.371Z

Learnt from: CR
Repo: biomejs/biome PR: 0
File: crates/biome_formatter/CONTRIBUTING.md:0-0
Timestamp: 2025-11-24T18:05:20.371Z
Learning: Applies to crates/biome_formatter/**/biome_*_formatter/tests/language.rs : Implement `TestFormatLanguage` trait in `tests/language.rs` for the formatter's test language

Applied to files:

crates/biome_cli/tests/cases/handle_vue_files.rs

📚 Learning: 2025-11-24T18:06:12.048Z

Learnt from: CR
Repo: biomejs/biome PR: 0
File: crates/biome_service/CONTRIBUTING.md:0-0
Timestamp: 2025-11-24T18:06:12.048Z
Learning: Applies to crates/biome_service/src/workspace/watcher.tests.rs : Implement watcher tests for workspace methods in watcher.tests.rs and end-to-end tests in LSP tests

Applied to files:

crates/biome_cli/tests/cases/handle_vue_files.rs

📚 Learning: 2025-11-24T18:05:20.371Z

Learnt from: CR
Repo: biomejs/biome PR: 0
File: crates/biome_formatter/CONTRIBUTING.md:0-0
Timestamp: 2025-11-24T18:05:20.371Z
Learning: Applies to crates/biome_formatter/**/biome_*_formatter/tests/spec_tests.rs : Use the `tests_macros::gen_tests!` macro in `spec_tests.rs` to generate test functions for each specification file matching the pattern `tests/specs/<language>/**/*.<ext>`

Applied to files:

crates/biome_cli/tests/cases/handle_vue_files.rs

📚 Learning: 2025-11-24T18:05:20.371Z

Learnt from: CR
Repo: biomejs/biome PR: 0
File: crates/biome_formatter/CONTRIBUTING.md:0-0
Timestamp: 2025-11-24T18:05:20.371Z
Learning: Applies to crates/biome_formatter/**/biome_*_formatter/Cargo.toml : Include development dependencies in `Cargo.toml` for formatter tests: `biome_formatter_test`, `biome_<language>_factory`, `biome_<language>_parser`, `biome_parser`, `biome_service`, `countme`, `iai`, `quickcheck`, `quickcheck_macros`, and `tests_macros`

Applied to files:

crates/biome_cli/tests/cases/handle_vue_files.rs

📚 Learning: 2025-11-27T23:04:02.022Z

Learnt from: CR
Repo: biomejs/biome PR: 0
File: crates/biome_analyze/CONTRIBUTING.md:0-0
Timestamp: 2025-11-27T23:04:02.022Z
Learning: Applies to crates/biome_analyze/**/tests/specs/**/*.jsonc : Use `.jsonc` files in test specs with code snippets as array of strings to test rules in script environment (no import/export syntax)

Applied to files:

crates/biome_cli/tests/cases/handle_vue_files.rs

📚 Learning: 2025-11-27T23:04:02.022Z

Learnt from: CR
Repo: biomejs/biome PR: 0
File: crates/biome_analyze/CONTRIBUTING.md:0-0
Timestamp: 2025-11-27T23:04:02.022Z
Learning: Applies to crates/biome_analyze/**/tests/specs/**/*.{js,ts,tsx,jsx,json,css} : Test rules using snapshot tests via the `insta` library with test cases in `tests/specs/<group>/<rule_name>/` directories prefixed by `invalid` or `valid`

Applied to files:

crates/biome_cli/tests/cases/handle_vue_files.rs

📚 Learning: 2025-11-27T23:04:02.022Z

Learnt from: CR
Repo: biomejs/biome PR: 0
File: crates/biome_analyze/CONTRIBUTING.md:0-0
Timestamp: 2025-11-27T23:04:02.022Z
Learning: Applies to crates/biome_analyze/**/*analyze/src/lint/**/*.rs : Use language tags in documentation code blocks (js, ts, tsx, json, css) and order properties consistently as: language, then `expect_diagnostic`, then options modifiers, then `ignore`, then `file=path`

Applied to files:

crates/biome_cli/tests/cases/handle_vue_files.rs

📚 Learning: 2025-11-27T23:04:02.022Z

Learnt from: CR
Repo: biomejs/biome PR: 0
File: crates/biome_analyze/CONTRIBUTING.md:0-0
Timestamp: 2025-11-27T23:04:02.022Z
Learning: Applies to crates/biome_analyze/**/*analyze/src/lint/**/*.rs : Framework-specific rules should be named using the `use` or `no` prefix followed by the framework name (e.g., `noVueReservedProps`)

Applied to files:

crates/biome_cli/tests/cases/handle_vue_files.rs

📚 Learning: 2025-11-24T18:05:20.371Z

Learnt from: CR
Repo: biomejs/biome PR: 0
File: crates/biome_formatter/CONTRIBUTING.md:0-0
Timestamp: 2025-11-24T18:05:20.371Z
Learning: Applies to crates/biome_formatter/**/biome_*_formatter/src/context.rs : Define `<Language>FormatContext` struct in a `context.rs` file containing `comments` and `source_map` fields, implementing `FormatContext` and `CstFormatContext` traits

Applied to files:

crates/biome_cli/tests/cases/handle_vue_files.rs

📚 Learning: 2025-11-24T18:06:03.545Z

Learnt from: CR
Repo: biomejs/biome PR: 0
File: crates/biome_parser/CONTRIBUTING.md:0-0
Timestamp: 2025-11-24T18:06:03.545Z
Learning: Applies to crates/biome_parser/**/language_kind.rs : Add a new variant to `LanguageKind` enum in `language_kind.rs` file and implement all methods for the new language variant

Applied to files:

crates/biome_cli/tests/cases/handle_vue_files.rs

📚 Learning: 2025-11-24T18:05:20.371Z

Learnt from: CR
Repo: biomejs/biome PR: 0
File: crates/biome_formatter/CONTRIBUTING.md:0-0
Timestamp: 2025-11-24T18:05:20.371Z
Learning: Create test infrastructure with `tests/specs` folder structure and `spec_test.rs`, `spec_tests.rs`, and `language.rs` files in test directories

Applied to files:

crates/biome_cli/tests/cases/handle_vue_files.rs

📚 Learning: 2025-11-27T23:04:02.022Z

Learnt from: CR
Repo: biomejs/biome PR: 0
File: crates/biome_analyze/CONTRIBUTING.md:0-0
Timestamp: 2025-11-27T23:04:02.022Z
Learning: Use quick testing via `tests/quick_test.rs` by removing the `#[ignore]` macro and modifying the `SOURCE` variable to rapidly validate rule behavior during development

Applied to files:

crates/biome_cli/tests/cases/handle_vue_files.rs

📚 Learning: 2025-11-28T09:08:10.091Z

Learnt from: CR
Repo: biomejs/biome PR: 0
File: CONTRIBUTING.md:0-0
Timestamp: 2025-11-28T09:08:10.091Z
Learning: Applies to **/*.rs : Use `just f` (alias for `just format`) to format Rust and TOML files before committing

Applied to files:

crates/biome_cli/tests/cases/handle_vue_files.rs

📚 Learning: 2025-11-28T09:08:10.091Z

Learnt from: CR
Repo: biomejs/biome PR: 0
File: CONTRIBUTING.md:0-0
Timestamp: 2025-11-28T09:08:10.091Z
Learning: Applies to **/*.rs : Use the `dbg!()` macro for debugging output during testing, and pass the `--show-output` flag to `cargo` to view debug output

Applied to files:

crates/biome_cli/tests/cases/handle_vue_files.rs

📚 Learning: 2025-11-28T09:08:10.091Z

Learnt from: CR
Repo: biomejs/biome PR: 0
File: CONTRIBUTING.md:0-0
Timestamp: 2025-11-28T09:08:10.091Z
Learning: Applies to .changeset/**/*.md : Create changesets for user-facing changes using `just new-changeset`; use headers with `####` or `#####` only; keep descriptions concise (1-3 sentences) and focus on user-facing changes

Applied to files:

.changeset/sad-boxes-lead.md

📚 Learning: 2025-08-05T14:43:29.581Z

Learnt from: dyc3
Repo: biomejs/biome PR: 7081
File: packages/@biomejs/biome/configuration_schema.json:7765-7781
Timestamp: 2025-08-05T14:43:29.581Z
Learning: The file `packages/biomejs/biome/configuration_schema.json` is auto-generated and should not be manually edited or reviewed for schema issues; any changes should be made at the code generation source.

Applied to files:

.changeset/sad-boxes-lead.md

📚 Learning: 2025-11-28T09:08:10.091Z

Learnt from: CR
Repo: biomejs/biome PR: 0
File: CONTRIBUTING.md:0-0
Timestamp: 2025-11-28T09:08:10.091Z
Learning: Applies to .changeset/**/*.md : Use past tense when describing what was done ('Added new feature'), present tense when describing Biome behavior ('Biome now supports'); end sentences with a full stop

Applied to files:

.changeset/sad-boxes-lead.md

📚 Learning: 2025-11-27T23:04:02.022Z

Learnt from: CR
Repo: biomejs/biome PR: 0
File: crates/biome_analyze/CONTRIBUTING.md:0-0
Timestamp: 2025-11-27T23:04:02.022Z
Learning: Commit rule changes with message format: `feat(biome_<crate>): <ruleName>` to follow Biome's conventional commit style

Applied to files:

.changeset/sad-boxes-lead.md

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (8)

GitHub Check: Documentation
GitHub Check: Test (depot-ubuntu-24.04-arm-16)
GitHub Check: Check Dependencies
GitHub Check: Lint project (depot-windows-2022)
GitHub Check: Test (depot-windows-2022-16)
GitHub Check: Lint project (depot-ubuntu-24.04-arm-16)
GitHub Check: Test Node.js API
GitHub Check: autofix

🔇 Additional comments (3)

crates/biome_html_syntax/src/element_ext.rs (1)

121-124: LGTM!

The logic correctly filters out SCSS style tags to prevent formatter errors.

crates/biome_html_formatter/src/html/auxiliary/embedded_content.rs (1)

24-24: LGTM!

The change correctly filters embeddable ranges to supported style tags, mirroring the existing script tag logic.

crates/biome_cli/tests/cases/handle_vue_files.rs (1)

571-608: LGTM!

The test correctly verifies that SCSS style blocks are skipped when full support is enabled, resolving the issue without errors.

crates/biome_cli/tests/cases/handle_vue_files.rs

Co-authored-by: siketyan <[email protected]>

ematipico requested review from a team December 4, 2025 08:51

github-actions bot added A-CLI Area: CLI A-Parser Area: parser A-Formatter Area: formatter L-HTML Language: HTML and super languages labels Dec 4, 2025

ematipico force-pushed the fix/scss-style branch from 5317299 to 08898c9 Compare December 4, 2025 08:53

coderabbitai bot reviewed Dec 4, 2025

View reviewed changes

crates/biome_cli/tests/cases/handle_vue_files.rs Outdated Show resolved Hide resolved

siketyan approved these changes Dec 4, 2025

View reviewed changes

fix(html/formatter): style tag with lang

fdc0fb2

ematipico force-pushed the fix/scss-style branch from 08898c9 to fdc0fb2 Compare December 4, 2025 10:07

ematipico merged commit f9673fc into main Dec 4, 2025
12 of 13 checks passed

ematipico deleted the fix/scss-style branch December 4, 2025 10:08

github-actions bot mentioned this pull request Dec 4, 2025

ci: release #8286

Merged

ematipico added a commit that referenced this pull request Dec 8, 2025

fix(html/formatter): style tag with lang (#8356)

afb79bb

Co-authored-by: siketyan <[email protected]>

This was referenced Dec 15, 2025

ci: release #8467

Merged

ci: release #8469

Merged

coderabbitai bot mentioned this pull request Dec 19, 2025

feat(html): support CSS modules syntax and vue css syntax #8399

Merged

l0ngvh pushed a commit to l0ngvh/biome that referenced this pull request Dec 21, 2025

fix(html/formatter): style tag with lang (biomejs#8356)

dfab926

Co-authored-by: siketyan <[email protected]>

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Uh oh!

fix(html/formatter): style tag with lang #8356

fix(html/formatter): style tag with lang #8356

Uh oh!

ematipico commented Dec 4, 2025

Uh oh!

changeset-bot bot commented Dec 4, 2025 •

edited

Loading

Uh oh!

coderabbitai bot commented Dec 4, 2025 •

edited

Loading

Review failed

Uh oh!

coderabbitai bot left a comment

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Uh oh!

fix(html/formatter): style tag with lang #8356

fix(html/formatter): style tag with lang #8356

Uh oh!

Conversation

ematipico commented Dec 4, 2025

Summary

Test Plan

Docs

Uh oh!

changeset-bot bot commented Dec 4, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🦋 Changeset detected

Uh oh!

coderabbitai bot commented Dec 4, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Review failed

Walkthrough

Possibly related PRs

Suggested reviewers

Pre-merge checks and finishing touches

Uh oh!

coderabbitai bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

changeset-bot bot commented Dec 4, 2025 •

edited

Loading

coderabbitai bot commented Dec 4, 2025 •

edited

Loading