bug: ::slotted(...) selector not working appropriately in scoped: true component #6081
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
::slotted(...) selectors in scoped: true components are not working properly due to the css selector not having enough specificity.
This is due to a regression added via the recent *edit this has been true for a while in Stencilclient-hydrate re-write which incorrectly applies the internal / scoped className to the slotted elements
Expected Behavior
slotted selectors should be applied to slotted nodes
System Info
No response
Steps to Reproduce
Open https://stackblitz.com/edit/stencil-start-ydmeww :
npm run build && npm run express
In the preview window, click on 'non-shadow-css-slotted'.
Notice the slotted node has the wrong colour.
Code Reproduction URL
https://stackblitz.com/edit/stencil-start-ydmeww
Additional Information
No response