fix(parse/html/vue): fix lexing of event handlers with `:` in them #8219

dyc3 · 2025-11-22T18:10:14Z

Summary

fixes #8190

Test Plan

Added snapshot tests

Docs

changeset-bot · 2025-11-22T18:10:18Z

🦋 Changeset detected

Latest commit: d37d42f

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-11-22T18:14:52Z

Walkthrough

Adds lexer support for Vue directive arguments by introducing a new VueDirectiveArgument variant to IdentifierContext and extending the HTML lexer to recognise and buffer directive argument names that may include a trailing colon (e.g. @update:modelValue). Adds tests (parser and formatter specs) covering <Foo @update:modelValue="onUpdate" />. Includes a changeset bumping the package patch version. No public API or exported declarations were changed.

Possibly related PRs

fix(parse/html/vue): reject whitespace before vue directive arguments #8178 — Modifies Vue directive argument handling related to colon parsing; touches the same lexer/parser areas and may interact with this change.

Suggested reviewers

ematipico

Pre-merge checks and finishing touches

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly and concisely summarizes the main fix: lexing of Vue event handlers with colons.
Description check	✅ Passed	The description is related to the changeset, referencing issue #8190 and mentioning added snapshot tests.
Linked Issues check	✅ Passed	The PR successfully addresses issue #8190 by fixing Vue event handler parsing with colons, adding test cases and snapshot validation.
Out of Scope Changes check	✅ Passed	All changes are directly related to fixing Vue event handler lexing: lexer updates, test cases, and changesets.

✨ Finishing touches

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment
Commit unit tests in branch dyc3/fix-vue-event-w-colon

📜 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 c28e2f2 and d37d42f.

📒 Files selected for processing (1)

.changeset/lemon-impalas-check.md (1 hunks)

⏰ 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). (9)

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

🔇 Additional comments (1)

.changeset/lemon-impalas-check.md (1)

1-5: Looks good! Previous feedback has been incorporated nicely—the description is now specific with a concrete example, and the version bump is appropriate for a bug fix.

Tip

📝 Customizable high-level summaries are now available in beta!

You can now customize how CodeRabbit generates the high-level summary in your pull requests — including its content, structure, tone, and formatting.

Provide your own instructions using the high_level_summary_instructions setting.
Format the summary however you like (bullet lists, tables, multi-section layouts, contributor stats, etc.).
Use high_level_summary_in_walkthrough to move the summary from the description to the walkthrough section.

Example instruction:

"Divide the high-level summary into five sections:

📝 Description — Summarize the main change in 50–60 words, explaining what was done.

📓 References — List relevant issues, discussions, documentation, or related PRs.

📦 Dependencies & Requirements — Mention any new/updated dependencies, environment variable changes, or configuration updates.

📊 Contributor Summary — Include a Markdown table showing contributions:
| Contributor | Lines Added | Lines Removed | Files Changed |

✔️ Additional Notes — Add any extra reviewer context.
Keep each section concise (under 200 words) and use bullet or numbered lists for clarity."

Note: This feature is currently in beta for Pro-tier users, and pricing will be announced later.

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

.changeset/lemon-impalas-check.md

ematipico · 2025-11-24T07:18:00Z

crates/biome_html_parser/src/lexer/mod.rs

    Doctype,
    Svelte,
    Vue,
+    VueDirectiveArgument,


Just an FYI. We should plan to remove this context, and make identifiers more predictable and part of the parsing phase.

Keywords and identifiers shouldn't change based on some internal context, simply the parser needs to handle it.

I'm working on a PR for it

Co-authored-by: Emanuele Stoppa <my.burning@gmail.com>

fix(parse/html/vue): fix lexing of event handlers with : in them

c28e2f2

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

dyc3 requested review from a team November 23, 2025 15:41

ematipico approved these changes Nov 24, 2025

View reviewed changes

Update .changeset/lemon-impalas-check.md

d37d42f

Co-authored-by: Emanuele Stoppa <my.burning@gmail.com>

dyc3 merged commit 793bb9a into main Nov 24, 2025
13 checks passed

dyc3 deleted the dyc3/fix-vue-event-w-colon branch November 24, 2025 13:19

This was referenced Nov 24, 2025

ci: release #8189

Merged

ci: release #8263

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Uh oh!

fix(parse/html/vue): fix lexing of event handlers with `:` in them #8219

fix(parse/html/vue): fix lexing of event handlers with `:` in them #8219

Uh oh!

dyc3 commented Nov 22, 2025

Uh oh!

changeset-bot bot commented Nov 22, 2025 •

edited

Loading

Uh oh!

coderabbitai bot commented Nov 22, 2025 •

edited

Loading

Uh oh!

Uh oh!

ematipico Nov 24, 2025

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Uh oh!

fix(parse/html/vue): fix lexing of event handlers with : in them #8219

fix(parse/html/vue): fix lexing of event handlers with : in them #8219

Uh oh!

Conversation

dyc3 commented Nov 22, 2025

Summary

Test Plan

Docs

Uh oh!

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

Uh oh!

🦋 Changeset detected

Uh oh!

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

Uh oh!

Walkthrough

Possibly related PRs

Suggested reviewers

Pre-merge checks and finishing touches

Uh oh!

Uh oh!

ematipico Nov 24, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

fix(parse/html/vue): fix lexing of event handlers with `:` in them #8219

fix(parse/html/vue): fix lexing of event handlers with `:` in them #8219

changeset-bot bot commented Nov 22, 2025 •

edited

Loading

coderabbitai bot commented Nov 22, 2025 •

edited

Loading