Vapor Mode - Unable to use template-only component in slot if component is template-only

[wuiyang]

Vue version

3.6.0-alpha.2

Link to minimal reproduction

https://play.vuejs.org/#eNqtUstOwzAQ/BVjriRBFHEopRKgHsoBECBxsYSsdJu6OLZlO6FS1X9n7TRpilq4cLNnZp+za3prTFpXQId05HIrjCcOfGVIzY22RHJV3DDqHaNjpkSJmCfvIHNdwtRDSeZWl4TRNOuBIR+j153+XpdmJwy/TjHKmqKYHD8YayT3gD9CRr2MEUCoFZBTkWu1RRGPFbJWle3n6beGyB5Nz3A2TDUXRbp0WuEa1iGIUYwwQoJ9Ml5ohfMPSWQCx6XUXw8R87aCsxbPF5B/HsCXbhUwRp8tOLA1zt5xntsCfENPXh9hhe+OLPWskqj+hXwBp2UVemxkd5WaYds9Xex2Gq0Qqnhzk5UH5dqhQqNBuYl6RtGZsM1jo+/aHaSXMY6pDW7xh/3hnE6ShPx1U53/JEmCN/vOzURNcsmdQ7lAKh5htNhJ7YniJQQG/WtSIbi1HCMPWN2e3r91N/bgcKlHC37UYMOmseAgvUrPEy7NgqcXdPMNJtMlpw==

Steps to reproduce

1. Prepare 2 template-only components (named A and B)

<!-- A.vue -->
<template>
  <div><slot /></div>
</template>

<!-- B.vue -->
<template>
  <div>Testing</div>
</template>

2. in App.vue, use A and B component, with B in A

<!-- App.vue -->
<template>
  <A><B /></A>
</template>

3. Ensure vue is in vapor only mode (or App.vue is in vapor mode)
4. Go to website

What is expected?

Vue should render App.vue like non-vapor mode (VDOM mode?)

with <div><div>Testing</div></div> as rendered content

What is actually happening?

Error occured when rendering:

Uncaught TypeError: can't access property "insert", block is undefined
    insert https://cdn.jsdelivr.net/npm/vue@3.6.0-alpha.2/dist/vue.runtime-with-vapor.esm-browser.js:13114
    insert https://cdn.jsdelivr.net/npm/vue@3.6.0-alpha.2/dist/vue.runtime-with-vapor.esm-browser.js:13117
    mountComponent https://cdn.jsdelivr.net/npm/vue@3.6.0-alpha.2/dist/vue.runtime-with-vapor.esm-browser.js:14353
    insert https://cdn.jsdelivr.net/npm/vue@3.6.0-alpha.2/dist/vue.runtime-with-vapor.esm-browser.js:13107
    slot https://cdn.jsdelivr.net/npm/vue@3.6.0-alpha.2/dist/vue.runtime-with-vapor.esm-browser.js:13527
    patch https://cdn.jsdelivr.net/npm/vue@3.6.0-alpha.2/dist/vue.runtime-with-vapor.esm-browser.js:7123
    mountChildren https://cdn.jsdelivr.net/npm/vue@3.6.0-alpha.2/dist/vue.runtime-with-vapor.esm-browser.js:7377
    mountElement https://cdn.jsdelivr.net/npm/vue@3.6.0-alpha.2/dist/vue.runtime-with-vapor.esm-browser.js:7296
    processElement https://cdn.jsdelivr.net/npm/vue@3.6.0-alpha.2/dist/vue.runtime-with-vapor.esm-browser.js:7261
    patch https://cdn.jsdelivr.net/npm/vue@3.6.0-alpha.2/dist/vue.runtime-with-vapor.esm-browser.js:7127
    fn https://cdn.jsdelivr.net/npm/vue@3.6.0-alpha.2/dist/vue.runtime-with-vapor.esm-browser.js:7817
    run https://cdn.jsdelivr.net/npm/vue@3.6.0-alpha.2/dist/vue.runtime-with-vapor.esm-browser.js:1791
    setupRenderEffect https://cdn.jsdelivr.net/npm/vue@3.6.0-alpha.2/dist/vue.runtime-with-vapor.esm-browser.js:7947
    mountComponent https://cdn.jsdelivr.net/npm/vue@3.6.0-alpha.2/dist/vue.runtime-with-vapor.esm-browser.js:7682
    insert https://cdn.jsdelivr.net/npm/vue@3.6.0-alpha.2/dist/vue.runtime-with-vapor.esm-browser.js:13587
    insert https://cdn.jsdelivr.net/npm/vue@3.6.0-alpha.2/dist/vue.runtime-with-vapor.esm-browser.js:13115
    mountComponent https://cdn.jsdelivr.net/npm/vue@3.6.0-alpha.2/dist/vue.runtime-with-vapor.esm-browser.js:14353
    mountApp https://cdn.jsdelivr.net/npm/vue@3.6.0-alpha.2/dist/vue.runtime-with-vapor.esm-browser.js:14415
    mount https://cdn.jsdelivr.net/npm/vue@3.6.0-alpha.2/dist/vue.runtime-with-vapor.esm-browser.js:6359
    mount https://cdn.jsdelivr.net/npm/vue@3.6.0-alpha.2/dist/vue.runtime-with-vapor.esm-browser.js:14451
    mount https://cdn.jsdelivr.net/npm/vue@3.6.0-alpha.2/dist/vue.runtime-with-vapor.esm-browser.js:13677
    _mount about:srcdoc line 64 > injectedScript:21
    <anonymous> about:srcdoc line 64 > injectedScript:26
vue.runtime-with-vapor.esm-browser.js:13114:9

System Info

Windows 11 (64-bit), Firefox 144.0.2

Any additional comments?

I noticed that if either A or B component explicitly defined it is a vapor component, it would fix the render issue.

Checked the compiled code for A and B component in playground, saw that it is compiled as non-vapor component.

I also found that having vapor attribute in <template> also fix this issue.

But in my newly created project, I would like it to be in full vapor mode, defined with createVaporApp, and hope that there's a config in vue compiler to default as vapor mode instead.

[edison1105]

It works fine in the minor branch.
This was fixed via #13408 and will be released soon.