Function bindAttributeOutsideSvg

packages/core/test/render3/integration_spec.ts:729–756

(
    tagName: string,
    attrName: keyof typeof attrCarriers,
    staticAttributeName: string,
  )

  // `hostElement` keeps the tag name out of the template, which lets the cases below be table
  // driven. Returns the change detection call so the caller can assert on it.
  function bindAttributeOutsideSvg(
    tagName: string,
    attrName: keyof typeof attrCarriers,
    staticAttributeName: string,
  ): () => void {
    @Component({
      template: '',
      changeDetection: ChangeDetectionStrategy.Eager,
    })
    class DynamicHost {}

    const hostElement = document.createElement(tagName);
    hostElement.setAttribute('attributeName', staticAttributeName);

    const componentRef = createComponent(DynamicHost, {
      hostElement,
      environmentInjector: TestBed.inject(EnvironmentInjector),
      directives: [attrCarriers[attrName]],
    });

    return () => {
      try {
        componentRef.changeDetectorRef.detectChanges();
      } finally {
        componentRef.destroy();
      }
    };
  }

  // An animation element declared outside of an `<svg>` is created in the HTML namespace, but still
  // animates once it ends up inside an `<svg>` subtree - for example when it is projected into one