fix(vapor): infer component multi-root metadata from SFC templates for hydration by edison1105 · Pull Request #14530 · vuejs/core

edison1105 · 2026-03-06T01:29:05Z

This PR makes Vapor hydration consume SSR fragment starts more precisely by adding explicit structural metadata from the compiler instead of relying on runtime heuristics.

On the compiler side, Vapor SFCs now receive __multiRoot metadata, and createIf codegen now carries blockShape so each branch can describe whether it owns a fragment wrapper. On the runtime side, Vapor hydration uses this metadata to determine whether the current  belongs to the current component / v-if branch and can be consumed immediately during creation, which fixes several nested multi-root and interop hydration edge cases.

__multiRoot only for vapor hydration.

related PRs

… the container's first child

coderabbitai · 2026-03-06T01:29:36Z

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: a4611fe7-82a6-4254-920f-9a78c7def439

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

🔍 Trigger review

✨ Finishing Touches

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment
Commit unit tests in branch edison/fix/vdomHydrationFix

📝 Coding Plan

Generate coding plan for human review comments

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

pkg-pr-new · 2026-03-06T01:29:44Z

Open in StackBlitz

@vue/compiler-core

pnpm add https://pkg.pr.new/@vue/compiler-core@14530

npm i https://pkg.pr.new/@vue/compiler-core@14530

yarn add https://pkg.pr.new/@vue/compiler-core@14530.tgz

@vue/compiler-dom

pnpm add https://pkg.pr.new/@vue/compiler-dom@14530

npm i https://pkg.pr.new/@vue/compiler-dom@14530

yarn add https://pkg.pr.new/@vue/compiler-dom@14530.tgz

@vue/compiler-sfc

pnpm add https://pkg.pr.new/@vue/compiler-sfc@14530

npm i https://pkg.pr.new/@vue/compiler-sfc@14530

yarn add https://pkg.pr.new/@vue/compiler-sfc@14530.tgz

@vue/compiler-ssr

pnpm add https://pkg.pr.new/@vue/compiler-ssr@14530

npm i https://pkg.pr.new/@vue/compiler-ssr@14530

yarn add https://pkg.pr.new/@vue/compiler-ssr@14530.tgz

@vue/compiler-vapor

pnpm add https://pkg.pr.new/@vue/compiler-vapor@14530

npm i https://pkg.pr.new/@vue/compiler-vapor@14530

yarn add https://pkg.pr.new/@vue/compiler-vapor@14530.tgz

@vue/reactivity

pnpm add https://pkg.pr.new/@vue/reactivity@14530

npm i https://pkg.pr.new/@vue/reactivity@14530

yarn add https://pkg.pr.new/@vue/reactivity@14530.tgz

@vue/runtime-core

pnpm add https://pkg.pr.new/@vue/runtime-core@14530

npm i https://pkg.pr.new/@vue/runtime-core@14530

yarn add https://pkg.pr.new/@vue/runtime-core@14530.tgz

@vue/runtime-dom

pnpm add https://pkg.pr.new/@vue/runtime-dom@14530

npm i https://pkg.pr.new/@vue/runtime-dom@14530

yarn add https://pkg.pr.new/@vue/runtime-dom@14530.tgz

@vue/runtime-vapor

pnpm add https://pkg.pr.new/@vue/runtime-vapor@14530

npm i https://pkg.pr.new/@vue/runtime-vapor@14530

yarn add https://pkg.pr.new/@vue/runtime-vapor@14530.tgz

@vue/server-renderer

pnpm add https://pkg.pr.new/@vue/server-renderer@14530

npm i https://pkg.pr.new/@vue/server-renderer@14530

yarn add https://pkg.pr.new/@vue/server-renderer@14530.tgz

@vue/shared

pnpm add https://pkg.pr.new/@vue/shared@14530

npm i https://pkg.pr.new/@vue/shared@14530

yarn add https://pkg.pr.new/@vue/shared@14530.tgz

vue

pnpm add https://pkg.pr.new/vue@14530

npm i https://pkg.pr.new/vue@14530

yarn add https://pkg.pr.new/vue@14530.tgz

@vue/compat

pnpm add https://pkg.pr.new/@vue/compat@14530

npm i https://pkg.pr.new/@vue/compat@14530

yarn add https://pkg.pr.new/@vue/compat@14530.tgz

commit: 20386cb

github-actions · 2026-03-06T01:29:58Z

Size Report

Bundles

File	Size	Gzip	Brotli
compiler-dom.global.prod.js	86.4 kB	30.2 kB	26.6 kB
runtime-dom.global.prod.js	110 kB	41.6 kB	37.3 kB
vue.global.prod.js	169 kB	61.4 kB	54.7 kB

Usages

Name	Size	Gzip	Brotli
createApp (CAPI only)	50.3 kB	19.7 kB	18 kB
createApp	59.3 kB	23 kB	20.9 kB
createApp + vaporInteropPlugin	83.3 kB (+92 B)	30.8 kB (+28 B)	27.9 kB (+50 B)
createVaporApp	28.2 kB (+33 B)	10.9 kB (+7 B)	10 kB (+16 B)
createSSRApp	63.5 kB	24.7 kB	22.4 kB
createVaporSSRApp	31.4 kB (+118 B)	12.2 kB (+81 B)	11.2 kB (+93 B)
defineCustomElement	65.3 kB	24.8 kB	22.5 kB
defineVaporCustomElement	38.3 kB (+118 B)	14.2 kB (+82 B)	13 kB (+65 B)
overall	74.2 kB	28.3 kB	25.7 kB

… test

… dynamic content

…uce consumeFragmentAnchor utility

…ries correctly

…Fragment with trailing sibling

…interop

…based approach

…ment handling

…lly blocks

…cal hydration

…Shape and updating related logic

…tionNode and updating fragment handling

…g in hydration logic

…de usage and removing obsolete functions

…nt constructors

…ent for improved hydration logic

… DynamicFragment

…ration

Copied from vuejs/core#14530

fix(runtime-vapor): only skip fragment start anchor when cursor is at…

e729a71

… the container's first child

edison1105 added scope: vapor related to vapor mode interop vdom / vapor interop labels Mar 6, 2026

edison1105 added 6 commits March 6, 2026 09:32

fix(tests): refine comment for multi-root VDOM component in hydration…

46fdda0

… test

test(vdom): update multi-root VDOM component to use reactive refs for…

8646b1e

… dynamic content

wip: save

68d8fa6

wip: save

e5ea904

wip: save

b0a4200

wip: save

7424449

edison1105 changed the title ~~fix(runtime-vapor): only skip fragment start anchor when cursor is at the container's first child~~ fix(runtime-vapor): align hydration cursor for multi-root VDOM interop Mar 6, 2026

edison1105 changed the title ~~fix(runtime-vapor): align hydration cursor for multi-root VDOM interop~~ fix(runtime-vapor): align hydration node for multi-root VDOM interop Mar 6, 2026

edison1105 added 16 commits March 9, 2026 21:28

fix(hydration): improve multi-root VDOM hydration handling and introd…

9e71383

…uce consumeFragmentAnchor utility

fix(hydration): enhance consumeFragmentAnchor to handle nested bounda…

17ed93a

…ries correctly

chore: update

1b552bf

test(hydration): add test for slot Fragment as first child of Dynamic…

0f7e612

…Fragment with trailing sibling

refactor(vapor): centralize hydration boundary handling for fragment …

1a0bed4

…interop

fix(hydration): refactor hydration entry management to use a context-…

6b8b1f5

…based approach

fix(hydration): update hydration boundary interfaces and improve frag…

c7de061

…ment handling

fix(hydration): simplify hydration function by restructuring try-fina…

2700a1a

…lly blocks

refactor(vapor): remove hydration boundary state in favor of owner-lo…

03c570a

…cal hydration

fix(hydration): unify shape handling by renaming branchShape to block…

b0a5c4c

…Shape and updating related logic

fix(hydration): streamline hydration logic by simplifying locateHydra…

899a370

…tionNode and updating fragment handling

fix(hydration): update snapshot tests and improve block shape handlin…

334855c

…g in hydration logic

docs(vIf): add comments to clarify block shape encoding logic

9155219

fix(hydration): optimize block shape handling in createIf function

3b48ed1

fix(hydration): enhance hydration logic by refining locateHydrationNo…

8a276d7

…de usage and removing obsolete functions

fix(hydration): improve hydration logic in createIf and DynamicFragme…

340fa3e

…nt constructors

edison1105 added 3 commits March 11, 2026 14:14

fix(hydration): update slot handling in DynamicFragment and SlotFragm…

2248ab7

…ent for improved hydration logic

fix(hydration): add comment to clarify handling of forwarded slots in…

7d59ef6

… DynamicFragment

refactor(sfc): infer vapor multi-root metadata from template analysis

252db0a

edison1105 changed the title ~~fix(runtime-vapor): align hydration node for multi-root VDOM interop~~ fix(vapor): infer component multi-root metadata from SFC templates for hydration Mar 11, 2026

edison1105 added 6 commits March 12, 2026 21:55

wip: save

3d39fcf

Merge branch 'minor' into edison/fix/vdomHydrationFix

ec122a6

fix(runtime-vapor): handle forwarded slot fallback anchors during hyd…

084f1f2

…ration

chore: Merge branch 'minor' into edison/fix/vdomHydrationFix

84cd9a8

chore: tweaks

2f8c0bb

chore: tweaks

20386cb

edison1105 merged commit c531937 into minor Mar 16, 2026
15 of 17 checks passed

edison1105 deleted the edison/fix/vdomHydrationFix branch March 16, 2026 02:40

zhiyuanzmj added a commit to vuejs/vue-jsx-vapor that referenced this pull request Mar 22, 2026

fix(compiler/vapor): add block_shape for v-if IR

8a18c2d

Copied from vuejs/core#14530

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

fix(vapor): infer component multi-root metadata from SFC templates for hydration#14530

fix(vapor): infer component multi-root metadata from SFC templates for hydration#14530
edison1105 merged 32 commits intominorfrom
edison/fix/vdomHydrationFix

edison1105 commented Mar 6, 2026 •

edited

Loading

Uh oh!

coderabbitai bot commented Mar 6, 2026 •

edited

Loading

Review skipped

Uh oh!

pkg-pr-new bot commented Mar 6, 2026 •

edited

Loading

Uh oh!

github-actions bot commented Mar 6, 2026 •

edited

Loading

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

Uh oh!

Conversation

edison1105 commented Mar 6, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

coderabbitai bot commented Mar 6, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Review skipped

Uh oh!

pkg-pr-new bot commented Mar 6, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions bot commented Mar 6, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Size Report

Bundles

Usages

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

edison1105 commented Mar 6, 2026 •

edited

Loading

coderabbitai bot commented Mar 6, 2026 •

edited

Loading

pkg-pr-new bot commented Mar 6, 2026 •

edited

Loading

github-actions bot commented Mar 6, 2026 •

edited

Loading