Description
Prerequisites
- I have read the Contributing Guidelines.
- I agree to follow the Code of Conduct.
- I have searched for existing issues that already report this problem, without success.
Stencil Version
latest
Current Behavior
scoped: true components do not render properly within a shadow: true component that is rendered with serializeShadowRoot: 'scoped'.
- nodes are not slotted properly. In the linked demo a
shadow: truecomponent forwards it's<slot />into ascoped: truecomponent. The slot gets hidden. The scoped componentschildNodesare 0. The content collapses. - there's a noticeable style 'flicker' as the components hydrate. This is due to the scoped component's nodes being moved into the shadowRoot but the styles being left behind in the document head.
Expected Behavior
- slotted nodes should work in a scoped component.
- no style flicker.
System Info
Steps to Reproduce
pnpm i
pnpm build
pnpm express
Code Reproduction URL
https://github.com/johnjenkins/stencil-start-m6opf9rg/tree/collapsing-scoped-components
Additional Information
No response