fix(compiler): correctly process multiple rules containing `:host` selectors (#41261)
When there was more than one rule in a single style string, only the first rule was having its `:host` selector processed correctly. Now subsequent rules will also be processed accurately. Fixes #41237 PR Close #41261
This commit is contained in:
parent
3a55698402
commit
aa039a13f0
|
@ -720,6 +720,7 @@ function escapeBlocks(
|
||||||
*/
|
*/
|
||||||
function combineHostContextSelectors(contextSelectors: string[], otherSelectors: string): string {
|
function combineHostContextSelectors(contextSelectors: string[], otherSelectors: string): string {
|
||||||
const hostMarker = _polyfillHostNoCombinator;
|
const hostMarker = _polyfillHostNoCombinator;
|
||||||
|
_polyfillHostRe.lastIndex = 0; // reset the regex to ensure we get an accurate test
|
||||||
const otherSelectorsHasHost = _polyfillHostRe.test(otherSelectors);
|
const otherSelectorsHasHost = _polyfillHostRe.test(otherSelectors);
|
||||||
|
|
||||||
// If there are no context selectors then just output a host marker
|
// If there are no context selectors then just output a host marker
|
||||||
|
|
|
@ -286,6 +286,17 @@ import {normalizeCSS} from '@angular/platform-browser/testing/src/browser_util';
|
||||||
expect(s(':host-context(div) > :host(.x) > .y {}', 'contenta', 'a-host'))
|
expect(s(':host-context(div) > :host(.x) > .y {}', 'contenta', 'a-host'))
|
||||||
.toEqual('div > .x[a-host] > .y[contenta] {}');
|
.toEqual('div > .x[a-host] > .y[contenta] {}');
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it('should parse multiple rules containing :host-context and :host', () => {
|
||||||
|
const input = `
|
||||||
|
:host-context(outer1) :host(bar) {}
|
||||||
|
:host-context(outer2) :host(foo) {}
|
||||||
|
`;
|
||||||
|
expect(s(input, 'contenta', 'a-host'))
|
||||||
|
.toEqual(
|
||||||
|
'outer1 bar[a-host] {} ' +
|
||||||
|
'outer2 foo[a-host] {}');
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should support polyfill-next-selector', () => {
|
it('should support polyfill-next-selector', () => {
|
||||||
|
|
Loading…
Reference in New Issue