fix(compiler-cli): properly index <svg> elements (#44678)

In the `Element` node of a parsed `<svg>` element, the `name` is recorded
as `:svg:svg`. When the Angular Indexer ran over this element, it would
attempt to find this name in the template text and fail, as the namespace
portion of the name was added automatically at parse time and is of course
missing from the original template.

This commit changes the indexer to detect these namespaced elements and only
search for the tag name.

PR Close #44678

packages/compiler-cli/src/ngtsc/indexer/src/template.ts

@@ -232,7 +232,15 @@ class TemplateVisitor extends TmplAstRecursiveVisitor {
       name = node.tagName;
       kind = IdentifierKind.Template;
     } else {
-      name = node.name;
+      // Namespaced elements have a particular format for `node.name` that needs to be handled.
+      // For example, an `<svg>` element has a `node.name` of `':svg:svg'`.
+
+      // TODO(alxhub): properly handle namespaced elements
+      if (node.name.startsWith(':')) {
+        name = node.name.split(':').pop()!;
+      } else {
+        name = node.name;
+      }
       kind = IdentifierKind.Element;
     }
     const sourceSpan = node.startSourceSpan;

packages/compiler-cli/src/ngtsc/indexer/test/template_spec.ts

@@ -21,6 +21,20 @@ function bind(template: string) {
 
 runInEachFileSystem(() => {
   describe('getTemplateIdentifiers', () => {
+    it('should handle svg elements', () => {
+      const template = '<svg></svg>';
+      const refs = getTemplateIdentifiers(bind(template));
+
+      const [ref] = Array.from(refs);
+      expect(ref).toEqual({
+        kind: IdentifierKind.Element,
+        name: 'svg',
+        span: new AbsoluteSourceSpan(1, 4),
+        usedDirectives: new Set(),
+        attributes: new Set(),
+      });
+    });
+
     it('should handle comments in interpolations', () => {
       const template = '{{foo // comment}}';
       const refs = getTemplateIdentifiers(bind(template));