fix(compiler-cli): preserve original reference to non-deferrable dependency (#54759)

crisbeto · atscott · commit 9b424d7224db · 2024-03-11T15:52:41.000-07:00
Fixes an issue where we were outputting the reference to non-deferrable dependencies as strings, rather than going through the reference emitter. This caused some issues internally because the reference wasn't maintained in the generated JS. PR Close #54759
diff --git a/packages/compiler-cli/src/ngtsc/annotations/component/src/handler.ts b/packages/compiler-cli/src/ngtsc/annotations/component/src/handler.ts
@@ -1264,7 +1264,7 @@ export class ComponentDecoratorHandler implements
     for (const [_, deps] of resolution.deferBlockDependencies) {
       for (const deferBlockDep of deps) {
         const importDecl =
-            resolution.deferrableDeclToImportDecl.get(deferBlockDep.type.node) ?? null;
+            resolution.deferrableDeclToImportDecl.get(deferBlockDep.declaration.node) ?? null;
         if (importDecl !== null && this.deferredSymbolTracker.canDefer(importDecl)) {
           deferBlockDep.isDeferrable = true;
           deferBlockDep.importPath = (importDecl.moduleSpecifier as ts.StringLiteral).text;
@@ -1375,11 +1375,12 @@ export class ComponentDecoratorHandler implements
         // `isDeferrable`, `importPath` and `isDefaultImport` will be
         // added later during the `compile` step.
         deps.push({
-          type: decl.ref,
+          typeReference: decl.type,
           symbolName: decl.ref.node.name.text,
           isDeferrable: false,
           importPath: null,
           isDefaultImport: false,
+          declaration: decl.ref,
         });
         allDeferredDecls.add(decl.ref.node);
       }
@@ -1502,8 +1503,10 @@ export class ComponentDecoratorHandler implements
                 (new o.DynamicImportExpr(dep.importPath!)).prop('then').callFn([innerFn]);
             depExpressions.push(importExpr);
           } else {
-            // Non-deferrable symbol, just use a reference to the type.
-            depExpressions.push(o.variable(dep.symbolName));
+            // Non-deferrable symbol, just use a reference to the type. Note that it's important to
+            // go through `typeReference`, rather than `symbolName` in order to preserve the
+            // original reference within the source file.
+            depExpressions.push(dep.typeReference);
           }
         }
         blocks.set(
diff --git a/packages/compiler-cli/src/ngtsc/annotations/component/src/metadata.ts b/packages/compiler-cli/src/ngtsc/annotations/component/src/metadata.ts
@@ -6,7 +6,7 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {AnimationTriggerNames, DeclarationListEmitMode, DeferBlockDepsEmitMode, R3ClassDebugInfo, R3ClassMetadata, R3ComponentMetadata, R3TemplateDependencyMetadata, SchemaMetadata, TmplAstDeferredBlock} from '@angular/compiler';
+import {AnimationTriggerNames, DeclarationListEmitMode, DeferBlockDepsEmitMode, Expression, R3ClassDebugInfo, R3ClassMetadata, R3ComponentMetadata, R3TemplateDependencyMetadata, SchemaMetadata, TmplAstDeferredBlock} from '@angular/compiler';
 import ts from 'typescript';
 
 import {Reference} from '../../../imports';
@@ -125,7 +125,7 @@ export interface DeferredComponentDependency {
   /**
    * Reference to a dependency.
    */
-  type: Reference<ClassDeclaration>;
+  typeReference: Expression;
 
   /**
    * Dependency class name.
@@ -146,4 +146,7 @@ export interface DeferredComponentDependency {
    * Whether the symbol is the default export.
    */
   isDefaultImport: boolean;
+
+  /** Reference to the declaration that defines the dependency. */
+  declaration: Reference<ClassDeclaration>;
 }
