Skip to content

feat: show VNode lifecycle events as 'built-in'#1036

Merged
webfansplz merged 1 commit intovuejs:mainfrom
skirtles-code:vnode-lifecycle-events
Feb 5, 2026
Merged

feat: show VNode lifecycle events as 'built-in'#1036
webfansplz merged 1 commit intovuejs:mainfrom
skirtles-code:vnode-lifecycle-events

Conversation

@skirtles-code
Copy link
Contributor

@skirtles-code skirtles-code commented Feb 5, 2026

Fixes #878 .

Vue includes some built-in lifecycle events for VNodes. See:

These don't need to be declared by components, as they're implemented by Vue itself and aren't emitted manually.

Rather than rendering them as Undeclared, I've added a third state, Built-in:

image

While these lifecycle events are rarely used directly, Vue Router adds a vnode-unmounted listener to route components. Showing that listener as Undeclared is misleading, implying user error.

I've included a tooltip for the new state. I don't think there's currently any way to see that tooltip, as they aren't implemented in the UI, but I'll attempt a fix for that in a separate PR.


Side note: I tested this using the Vite plugin. I kept running into problems and eventually realised these were being caused by the Vue.js devtools Chrome extension. I wasn't intentionally using the Chrome extension, it just happened to be installed. My code was setting the values to Built-in and the extension was overwriting that with Undeclared. Once I realised I just disabled the extension, but the thought occurs that this sharing of data is likely to lead to compatibility problems more generally. I couldn't find this documented anywhere and it seems kinda scary that the extension can interfere like that.

@netlify
Copy link

netlify bot commented Feb 5, 2026

Deploy Preview for vue-devtools-docs canceled.

Name Link
🔨 Latest commit 1c9d981
🔍 Latest deploy log https://app.netlify.com/projects/vue-devtools-docs/deploys/69847e0c5f082d000851f7e5

@pkg-pr-new
Copy link

pkg-pr-new bot commented Feb 5, 2026

Open in StackBlitz

@vue/devtools-applet

npm i https://pkg.pr.new/@vue/devtools-applet@1036

@vue/devtools-core

npm i https://pkg.pr.new/@vue/devtools-core@1036

@vue/devtools

npm i https://pkg.pr.new/@vue/devtools@1036

@vue/devtools-api

npm i https://pkg.pr.new/@vue/devtools-api@1036

@vue/devtools-kit

npm i https://pkg.pr.new/@vue/devtools-kit@1036

@vue/devtools-electron

npm i https://pkg.pr.new/@vue/devtools-electron@1036

@vue/devtools-shared

npm i https://pkg.pr.new/@vue/devtools-shared@1036

@vue/devtools-ui

npm i https://pkg.pr.new/@vue/devtools-ui@1036

vite-plugin-vue-devtools

npm i https://pkg.pr.new/vite-plugin-vue-devtools@1036

commit: 1c9d981

@webfansplz webfansplz merged commit 35de5ec into vuejs:main Feb 5, 2026
9 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

vnode-unmounted Not Declared

2 participants