fix(transition): handle transition appear with slotted v-show at runtime

[edison1105]

Summary by CodeRabbit

Release Notes

• New Features

  • Enhanced v-show behavior within transition components with improved lifecycle hook handling during the appear phase.

• Bug Fixes

  • Fixed transition lifecycle hook invocation when using v-show with appear enabled, ensuring hooks fire at the correct times.

• Tests

  • Added comprehensive E2E and unit tests for v-show transitions and appear behavior with various component configurations.

[coderabbitai]

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: 19d1e2d4-099a-4a2f-9857-9c217b49e2c4

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

🚥 Pre-merge checks | ✅ 2 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately summarizes the main change: fixing transition appear behavior when v-show is used in slotted content, with runtime handling in the vapor package.

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

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch edison/fix/TransitionVShowAppear

---

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

[github-actions]

Size Report

Bundles

File	Size	Gzip	Brotli
compiler-dom.global.prod.js	86.4 kB	30.3 kB	26.6 kB
runtime-dom.global.prod.js	112 kB	42.1 kB	37.7 kB
vue.global.prod.js	171 kB	61.9 kB	55.2 kB

Usages

Name	Size	Gzip	Brotli
createApp (CAPI only)	50.8 kB	19.8 kB	18.1 kB
createApp	59.8 kB	23.2 kB	21.1 kB
createApp + vaporInteropPlugin	86.1 kB	31.8 kB	28.7 kB
createVaporApp	28.9 kB	11.2 kB	10.3 kB
createSSRApp	64 kB	24.9 kB	22.6 kB
createVaporSSRApp	32.1 kB	12.4 kB	11.4 kB
defineCustomElement	66.4 kB	25.1 kB	22.9 kB
defineVaporCustomElement	39.5 kB	14.6 kB	13.4 kB
overall	74.8 kB	28.5 kB	25.9 kB

[pkg-pr-new]

Open in StackBlitz

@vue/compiler-core

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

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

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

@vue/compiler-dom

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

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

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

@vue/compiler-sfc

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

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

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

@vue/compiler-ssr

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

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

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

@vue/compiler-vapor

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

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

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

@vue/reactivity

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

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

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

@vue/runtime-core

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

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

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

@vue/runtime-dom

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

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

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

@vue/runtime-vapor

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

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

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

@vue/server-renderer

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

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

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

@vue/shared

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

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

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

vue

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

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

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

@vue/compat

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

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

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

commit: 27b6096

[jackma9604]

core/packages/runtime-vapor/src/components/Transition.ts

Lines 138 to 143 in 4f5ad60

	children = (slots.default && slots.default()) as any as Block
	} finally {
	setCurrentPendingVShows(prev)
	}
	} else {
	children = (slots.default && slots.default()) as any as Block

The slot.default should include the renderEffect method, which has the same issue as #14628

see repl

@edison1105

[edison1105]

@jackma9604 good catch! I will fix it soon.
see #14634