fix(compiler-cli): properly index <svg> elements when on a template (#44785)

atscott · AndrewKushnir · commit 7316e72ec5cc · 2022-01-24T10:41:54.000-08:00
The original fix for svg elements in 92b23f4 did not account for svg elements when they also had a structural directive on them, making the node a template. This resulted in the logic added in fix above not being applied. PR Close #44785
diff --git a/packages/compiler-cli/src/ngtsc/indexer/src/template.ts b/packages/compiler-cli/src/ngtsc/indexer/src/template.ts
@@ -232,17 +232,16 @@ class TemplateVisitor extends TmplAstRecursiveVisitor {
       name = node.tagName;
       kind = IdentifierKind.Template;
     } else {
-      // 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;
-      }
+      name = node.name;
       kind = IdentifierKind.Element;
     }
+    // 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 (name.startsWith(':')) {
+      name = name.split(':').pop()!;
+    }
+
     const sourceSpan = node.startSourceSpan;
     // An element's or template's source span can be of the form `<element>`, `<element />`, or
     // `<element></element>`. Only the selector is interesting to the indexer, so the source is
diff --git a/packages/compiler-cli/src/ngtsc/indexer/test/template_spec.ts b/packages/compiler-cli/src/ngtsc/indexer/test/template_spec.ts
@@ -35,6 +35,20 @@ runInEachFileSystem(() => {
       });
     });
 
+    it('should handle svg elements on templates', () => {
+      const template = '<svg *ngIf="true"></svg>';
+      const refs = getTemplateIdentifiers(bind(template));
+
+      const [ref] = Array.from(refs);
+      expect(ref).toEqual({
+        kind: IdentifierKind.Template,
+        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));
