-
-
Notifications
You must be signed in to change notification settings - Fork 8.9k
Open
Labels
🔨 p3-minor-bugPriority 3: this fixes a bug, but is an edge case that only affects very specific usage.Priority 3: this fixes a bug, but is an edge case that only affects very specific usage.scope: custom elements
Description
Vue version
Vue 3.5.5+ (regression introduced by PR #11861 that closed issue #11851)
Link to minimal reproduction
Steps to reproduce
- Build the component above as a custom element with shadowRoot: false.
- Mount it in a page with both headerContent and bodyContent slots.
- Observe the rendered DOM.
What is expected?
- Both headerContent (outside Teleport) and bodyContent (inside Teleport) should render.
- The slot collection should check both the host root and the teleport target.
What is actually happening?
When the component is built as a custom element with shadowRoot: false, only the slots inside the Teleport are rendered. Any slots defined outside the Teleport (e.g. headerContent) are ignored, so their projected content never appears in the DOM.
Root cause: in apiCustomElement.ts, slots are collected via:
const outlets = (this._teleportTarget || this).querySelectorAll('slot')
System Info
Any additional comments?
No response
Metadata
Metadata
Assignees
Labels
🔨 p3-minor-bugPriority 3: this fixes a bug, but is an edge case that only affects very specific usage.Priority 3: this fixes a bug, but is an edge case that only affects very specific usage.scope: custom elements