mirror of
https://github.com/angular/angular
synced 2026-05-24 09:28:37 +00:00
Both `:host` and `:host-context` work by looking for a specific character sequence that is terminated by `,` or `{` and replacing selectors inside of it with scoped versions. This is implemented as a regex which isn't aware of things like nested selectors. Normally this is fine for `:host`, because each `:host` produces one scoped selector which doesn't affect any child selectors, however it breaks down with `:host-context` which replaces each instance with two selectors. For example, if we have a selector in the form of `:host-context(.foo) a:not(.a, .b)`, the compiler ends up determining that `.a,` is the end selector and produces `.foo[a-host] a[contenta]:not(.a, .foo [a-host] a[contenta]:not(.a, .b) {}`.
These changes resolve the issue by splitting the CSS alogn top-level commas, processing the `:host-context` in them individually, and stiching the CSS back together.
PR Close #59276
|
||
|---|---|---|
| .. | ||
| at_rules_spec.ts | ||
| host_and_host_context_spec.ts | ||
| keyframes_spec.ts | ||
| ng_deep_spec.ts | ||
| polyfills_spec.ts | ||
| process_rules_spec.ts | ||
| repeat_groups_spec.ts | ||
| shadow_css_spec.ts | ||
| utils.ts | ||