Method _applySelectorScope

packages/compiler/src/shadow_css.ts:732–915

({
    selector,
    scopeSelector,
    hostSelector,
    isParentSelector,
  }: {
    selector: string;
    scopeSelector: string;
    hostSelector: string;
    isParentSelector?: boolean;
  })

  // return a selector with [name] suffix on each simple selector
  // e.g. .foo.bar > .zot becomes .foo[name].bar[name] > .zot[name]  /** @internal */
  private _applySelectorScope({
    selector,
    scopeSelector,
    hostSelector,
    isParentSelector,
  }: {
    selector: string;
    scopeSelector: string;
    hostSelector: string;
    isParentSelector?: boolean;
  }): string {
    const isRe = /\[is=([^\]]*)\]/g;
    scopeSelector = scopeSelector.replace(isRe, (_: string, ...parts: string[]) => parts[0]);

    const attrName = `[${scopeSelector}]`;

    const _scopeSelectorPart = (p: string) => {
      let scopedP = p.trim();

      if (!scopedP) {
        return p;
      }

      if (p.includes(_polyfillHostNoCombinator)) {
        scopedP = this._applySimpleSelectorScope(p, scopeSelector, hostSelector);
        if (!p.match(_polyfillHostNoCombinatorOutsidePseudoFunction)) {
          const [_, before, colon, after] = scopedP.match(/([^:]*)(:*)([\s\S]*)/)!;
          scopedP = before + attrName + colon + after;
        }
      } else {
        // remove :host since it should be unnecessary
        const t = p.replace(_polyfillHostRe, '');
        if (t.length > 0) {
          const matches = t.match(/([^:]*)(:*)([\s\S]*)/);
          if (matches) {
            scopedP = matches[1] + attrName + matches[2] + matches[3];
          }
        }
      }

      return scopedP;
    };

    // Wraps `_scopeSelectorPart()` to not use it directly on selectors with
    // pseudo selector functions like `:where()`. Selectors within pseudo selector
    // functions are recursively sent to `_scopeSelector()`.
    const _pseudoFunctionAwareScopeSelectorPart = (selectorPart: string) => {
      let scopedPart = '';

      // Collect all outer `:where()` and `:is()` selectors,
      // counting parenthesis to keep nested selectors intact.
      const pseudoSelectorParts = [];
      let pseudoSelectorMatch: RegExpExecArray | null;
      while (
        (pseudoSelectorMatch = _cssPrefixWithPseudoSelectorFunction.exec(selectorPart)) !== null
      ) {
        let openedBrackets = 1;
        let index = _cssPrefixWithPseudoSelectorFunction.lastIndex;