From 417dea23cf84c3d5192ce2965465922e118d3758 Mon Sep 17 00:00:00 2001
From: Matthew Beck <me@mattrb.com>
Date: Sun, 10 May 2026 18:44:42 -0700
Subject: [PATCH] fix(compiler): simplify handling of colon host with a
 selector list

Update `_convertColonHost` to extract and use only the first argument from a `:host(...)` selector list, ignoring subsequent arguments instead of splitting and duplicating the selector list. Also remove the obsolete test cases from `host_and_host_context_spec.ts`.
---
 packages/compiler/src/shadow_css.ts           | 17 +++++++---------
 .../shadow_css/host_and_host_context_spec.ts  | 20 -------------------
 2 files changed, 7 insertions(+), 30 deletions(-)

diff --git a/packages/compiler/src/shadow_css.ts b/packages/compiler/src/shadow_css.ts
index 93c174b5e6b8..d983f5be1dcb 100644
--- a/packages/compiler/src/shadow_css.ts
+++ b/packages/compiler/src/shadow_css.ts
@@ -511,20 +511,17 @@ export class ShadowCss {
   private _convertColonHost(cssText: string): string {
     return cssText.replace(_cssColonHostRe, (_, hostSelectors: string, otherSelectors: string) => {
       if (hostSelectors) {
-        const convertedSelectors: string[] = [];
-        for (const hostSelector of this._splitOnTopLevelCommas(hostSelectors, true)) {
-          const trimmedHostSelector = hostSelector.trim();
-          if (!trimmedHostSelector) break;
-          const convertedSelector =
+        const hostSelector = this._splitOnTopLevelCommas(hostSelectors, true).next().value;
+        const trimmedHostSelector = hostSelector ? hostSelector.trim() : '';
+        if (trimmedHostSelector) {
+          return (
             _polyfillHostNoCombinator +
             trimmedHostSelector.replace(_polyfillHost, '') +
-            otherSelectors;
-          convertedSelectors.push(convertedSelector);
+            otherSelectors
+          );
         }
-        return convertedSelectors.join(',');
-      } else {
-        return _polyfillHostNoCombinator + otherSelectors;
       }
+      return _polyfillHostNoCombinator + otherSelectors;
     });
   }
 
diff --git a/packages/compiler/test/shadow_css/host_and_host_context_spec.ts b/packages/compiler/test/shadow_css/host_and_host_context_spec.ts
index db7c473d7713..7efefb1860c3 100644
--- a/packages/compiler/test/shadow_css/host_and_host_context_spec.ts
+++ b/packages/compiler/test/shadow_css/host_and_host_context_spec.ts
@@ -41,30 +41,10 @@ describe('ShadowCss, :host and :host-context', () => {
       expect(shim(':host.pr\\fc fung {}', 'contenta', 'a-host')).toEqual('.pr\\fc fung[a-host] {}');
     });
 
-    it('should handle multiple tag selectors', () => {
-      expect(shim(':host(ul,li) {}', 'contenta', 'a-host')).toEqualCss('ul[a-host], li[a-host] {}');
-      expect(shim(':host(ul,li) > .z {}', 'contenta', 'a-host')).toEqualCss(
-        'ul[a-host] > .z[contenta], li[a-host] > .z[contenta] {}',
-      );
-    });
-
     it('should handle compound class selectors', () => {
       expect(shim(':host(.a.b) {}', 'contenta', 'a-host')).toEqualCss('.a.b[a-host] {}');
     });
 
-    it('should handle multiple class selectors', () => {
-      expect(shim(':host(.x,.y) {}', 'contenta', 'a-host')).toEqualCss('.x[a-host], .y[a-host] {}');
-      expect(shim(':host(.x,.y) > .z {}', 'contenta', 'a-host')).toEqualCss(
-        '.x[a-host] > .z[contenta], .y[a-host] > .z[contenta] {}',
-      );
-    });
-
-    it('should handle multiple attribute selectors', () => {
-      expect(shim(':host([a="b"],[c=d]) {}', 'contenta', 'a-host')).toEqualCss(
-        '[a="b"][a-host], [c=d][a-host] {}',
-      );
-    });
-
     it('should handle pseudo selectors', () => {
       expect(shim(':host(:before) {}', 'contenta', 'a-host')).toEqualCss('[a-host]:before {}');
       expect(shim(':host:before {}', 'contenta', 'a-host')).toEqualCss('[a-host]:before {}');