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:
Pete Bacon Darwin 2021-03-18 13:57:04 +00:00 committed by Misko Hevery
parent 3a55698402
commit aa039a13f0
2 changed files with 12 additions and 0 deletions

View File

@ -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

View File

@ -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', () => {