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

4.40.0

Current Behavior

Under certain circumstances, the styling breaks for non-shadow root child components. It occurs in our product in complex components in the prod build, but it is very hard to reproduce.

This works fine with Stencil v4.39.0

Expected Behavior

Child component style should not be lost when the parent component style changes.

System Info

Steps to Reproduce

I created a repo where the problem can be reproduced with the dev server:

In this repo, a parent component with shadow root encapsulates a child component without shadow root.

Reproduction recipe:

1. npm run start -> on localhost:3333 parent and child component are loaded as expected
2. change something in the css of the parent component -> hot reload occurs and the child style is broken

Code Reproduction URL

https://github.com/annam002/child-component-styling-bug

Additional Information

No response