`onUnmounted` doesn't run if slot content is wrapped in a div (within this tab structure)

[shawnyama]

Vue version

3.3.13

Link to minimal reproduction

https://stackblitz.com/edit/vitejs-vite-wdnvx3?file=src%2FApp.vue

Steps to reproduce

1. Switch from Tab 2 to Tab 1
2. Switch from Tab 1 to Tab 2
3. Notice how the onUnmounted message from Child.vue doesn't run when switching from Tab 2 to Tab 1 but does work when switching from Tab 1 to Tab 2
4. There is a Hide/Show content button that you can use if you want a way to unmount everything (optional)

What is expected?

My Child.vue is supposed to print the description prop passed to it onUnmounted. When I switch from Tab 2 to Tab 1 the Child.vue in Tab 2 should print its onUnmounted message. The message is: UNMOUNTING CHILD IN DIV IN WRAPPER.

What is actually happening?

My Child.vue within my Tab 2 does not print its onUnmounted message when I switch tabs. This seems to be due to it being wrapped in a div, since Tab 1's onUnmounted does run while not wrapped in a div. I don't see why wrapping the <child> with a div would negate its onUnmounted call.

System Info

macOS Sonoma 14.5
Node.js v18.18.2
npm 9.8.1

Any additional comments?

No response