feat(compiler-cli): support host directives with direct external references in fast type declaration emission (#61469)

Jonathan Meier · thePunderWoman · commit 0cf1001715d2 · 2025-05-21T13:46:43.000Z
In the initial implementation for experimental fast type declaration emission introduced in e62fb35, external references in host directives were not supported at all. This change adds support for direct external references in host directives. Any other expressions indirectly using external references are still not supported. PR Close #61469
diff --git a/packages/compiler-cli/src/ngtsc/annotations/directive/src/shared.ts b/packages/compiler-cli/src/ngtsc/annotations/directive/src/shared.ts
@@ -11,6 +11,7 @@ import {
   emitDistinctChangesOnlyDefaultValue,
   Expression,
   ExternalExpr,
+  ExternalReference,
   ForwardRefHandling,
   getSafePropertyAccessString,
   MaybeForwardRefExpression,
@@ -395,6 +396,7 @@ export function extractDirectiveMetadata(
       : extractHostDirectives(
           rawHostDirectives,
           evaluator,
+          reflector,
           compilationMode,
           createForwardRefResolver(isCore),
           emitDeclarationOnly,
@@ -1733,6 +1735,7 @@ function getHostBindingErrorNode(error: ParseError, hostExpr: ts.Expression): ts
 function extractHostDirectives(
   rawHostDirectives: ts.Expression,
   evaluator: PartialEvaluator,
+  reflector: ReflectionHost,
   compilationMode: CompilationMode,
   forwardRefResolver: ForeignFunctionResolver,
   emitDeclarationOnly: boolean,
@@ -1768,7 +1771,7 @@ function extractHostDirectives(
       }
     }
 
-    let directive: Reference<ClassDeclaration> | Expression;
+    let directive: Reference<ClassDeclaration> | Expression | ExternalReference;
     let nameForErrors = (fieldName: string) => '@Directive.hostDirectives';
     if (compilationMode === CompilationMode.LOCAL && hostReference instanceof DynamicValue) {
       // At the moment in local compilation we only support simple array for host directives, i.e.,
@@ -1780,22 +1783,38 @@ function extractHostDirectives(
         !ts.isIdentifier(hostReference.node) &&
         !ts.isPropertyAccessExpression(hostReference.node)
       ) {
+        const compilationModeName = emitDeclarationOnly
+          ? 'experimental declaration-only emission'
+          : 'local compilation';
         throw new FatalDiagnosticError(
           ErrorCode.LOCAL_COMPILATION_UNSUPPORTED_EXPRESSION,
           hostReference.node,
-          `In local compilation mode, host directive cannot be an expression. Use an identifier instead`,
+          `In ${compilationModeName} mode, host directive cannot be an expression. Use an identifier instead`,
         );
       }
 
       if (emitDeclarationOnly) {
-        throw new FatalDiagnosticError(
-          ErrorCode.LOCAL_COMPILATION_UNSUPPORTED_EXPRESSION,
-          hostReference.node,
-          'External references in host directives are not supported in experimental declaration-only emission mode',
-        );
+        if (ts.isIdentifier(hostReference.node)) {
+          const importInfo = reflector.getImportOfIdentifier(hostReference.node);
+          if (importInfo) {
+            directive = new ExternalReference(importInfo.from, importInfo.name);
+          } else {
+            throw new FatalDiagnosticError(
+              ErrorCode.LOCAL_COMPILATION_UNSUPPORTED_EXPRESSION,
+              hostReference.node,
+              `In experimental declaration-only emission mode, host directive cannot use indirect external indentifiers. Use a direct external identifier instead`,
+            );
+          }
+        } else {
+          throw new FatalDiagnosticError(
+            ErrorCode.LOCAL_COMPILATION_UNSUPPORTED_EXPRESSION,
+            hostReference.node,
+            `In experimental declaration-only emission mode, host directive cannot be an expression. Use an identifier instead`,
+          );
+        }
+      } else {
+        directive = new WrappedNodeExpr(hostReference.node);
       }
-
-      directive = new WrappedNodeExpr(hostReference.node);
     } else if (hostReference instanceof Reference) {
       directive = hostReference as Reference<ClassDeclaration>;
       nameForErrors = (fieldName: string) =>
@@ -1865,6 +1884,11 @@ function toHostDirectiveMetadata(
       context,
       refEmitter,
     );
+  } else if (hostDirective.directive instanceof ExternalReference) {
+    directive = {
+      value: new ExternalExpr(hostDirective.directive),
+      type: new ExternalExpr(hostDirective.directive),
+    };
   } else {
     directive = {
       value: hostDirective.directive,
diff --git a/packages/compiler-cli/src/ngtsc/metadata/src/api.ts b/packages/compiler-cli/src/ngtsc/metadata/src/api.ts
@@ -6,7 +6,12 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 
-import {DirectiveMeta as T2DirectiveMeta, Expression, SchemaMetadata} from '@angular/compiler';
+import {
+  DirectiveMeta as T2DirectiveMeta,
+  Expression,
+  SchemaMetadata,
+  ExternalReference,
+} from '@angular/compiler';
 import ts from 'typescript';
 
 import {Reference} from '../../imports';
@@ -305,7 +310,7 @@ export interface HostDirectiveMeta {
    * which indicates the expression could not be resolved due to being imported from some external
    * file. In this case, the expression is the raw expression as appears in the decorator.
    */
-  directive: Reference<ClassDeclaration> | Expression;
+  directive: Reference<ClassDeclaration> | Expression | ExternalReference;
 
   /** Whether the reference to the host directive is a forward reference. */
   isForwardReference: boolean;
diff --git a/packages/compiler-cli/test/ngtsc/declaration_only_emission_spec.ts b/packages/compiler-cli/test/ngtsc/declaration_only_emission_spec.ts
