fix(compiler-cli): properly emit literal types in input coercion function arguments (angular#52437)

This commit fixes an issue where using literal types in the arguments of an input coercion
function could result in emitting invalid output, due to an assumption that TypeScript makes
when emitting literal types. Specifically, it takes the literal's text from its containing
source file, but this breaks when the literal type node has been transplanted into a
different source file. This issue has surfaced in the type-check code generator and is
already being addressed there, so this commit moves the relevant `TypeEmitter` class
from the `typecheck` module to the `translator` module, such that it can be reused for
emitting types in the type translator.

Fixes angular#51672

PR Close angular#52437

Author: JoostK

packages/compiler-cli/src/ngtsc/translator/index.ts

@@ -11,6 +11,7 @@ export {ImportGenerator, NamedImport} from './src/api/import_generator';
 export {Context} from './src/context';
 export {Import, ImportManager} from './src/import_manager';
 export {ExpressionTranslatorVisitor, RecordWrappedNodeFn, TranslatorOptions} from './src/translator';
+export {canEmitType, TypeEmitter, TypeReferenceTranslator} from './src/type_emitter';
 export {translateType} from './src/type_translator';
 export {attachComments, createTemplateMiddle, createTemplateTail, TypeScriptAstFactory} from './src/typescript_ast_factory';
 export {translateExpression, translateStatement} from './src/typescript_translator';

packages/compiler-cli/src/ngtsc/typecheck/src/type_emitter.ts renamed to packages/compiler-cli/src/ngtsc/translator/src/type_emitter.ts

@@ -14,6 +14,7 @@ import {ReflectionHost} from '../../reflection';
 
 import {Context} from './context';
 import {ImportManager} from './import_manager';
+import {TypeEmitter} from './type_emitter';
 
 
 export function translateType(
@@ -79,12 +80,13 @@ class TypeTranslatorVisitor implements o.ExpressionVisitor, o.TypeVisitor {
     return ts.factory.createTypeLiteralNode([indexSignature]);
   }
 
-  visitTransplantedType(ast: o.TransplantedType<ts.Node>, context: any) {
+  visitTransplantedType(ast: o.TransplantedType<ts.Node>, context: Context) {
     if (!ts.isTypeNode(ast.type)) {
       throw new Error(`A TransplantedType must wrap a TypeNode`);
     }
 
-    return this.translateTransplantedTypeNode(ast.type, context);
+    const emitter = new TypeEmitter(typeRef => this.translateTypeReference(typeRef, context));
+    return emitter.emitType(ast.type);
   }
 
   visitReadVarExpr(ast: o.ReadVarExpr, context: Context): ts.TypeQueryNode {
@@ -253,70 +255,28 @@ class TypeTranslatorVisitor implements o.ExpressionVisitor, o.TypeVisitor {
     return typeNode;
   }
 
-  /**
-   * Translates a type reference node so that all of its references
-   * are imported into the context file.
-   */
-  private translateTransplantedTypeReferenceNode(
-      node: ts.TypeReferenceNode&{typeName: ts.Identifier}, context: any): ts.TypeReferenceNode {
-    const declaration = this.reflector.getDeclarationOfIdentifier(node.typeName);
-
+  private translateTypeReference(type: ts.TypeReferenceNode, context: Context): ts.TypeReferenceNode
+      |null {
+    const target = ts.isIdentifier(type.typeName) ? type.typeName : type.typeName.right;
+    const declaration = this.reflector.getDeclarationOfIdentifier(target);
     if (declaration === null) {
       throw new Error(
-          `Unable to statically determine the declaration file of type node ${node.typeName.text}`);
+          `Unable to statically determine the declaration file of type node ${target.text}`);
     }
 
     const emittedType = this.refEmitter.emit(
         new Reference(declaration.node), this.contextFile,
         ImportFlags.NoAliasing | ImportFlags.AllowTypeImports |
             ImportFlags.AllowRelativeDtsImports);
 
-    assertSuccessfulReferenceEmit(emittedType, node, 'type');
-
-    const result = emittedType.expression.visitExpression(this, context);
+    assertSuccessfulReferenceEmit(emittedType, target, 'type');
 
-    if (!ts.isTypeReferenceNode(result)) {
-      throw new Error(`Expected TypeReferenceNode when referencing the type for ${
-          node.typeName.text}, but received ${ts.SyntaxKind[result.kind]}`);
-    }
+    const typeNode = this.translateExpression(emittedType.expression, context);
 
-    // If the original node doesn't have any generic parameters we return the results.
-    if (node.typeArguments === undefined || node.typeArguments.length === 0) {
-      return result;
+    if (!ts.isTypeReferenceNode(typeNode)) {
+      throw new Error(
+          `Expected TypeReferenceNode for emitted reference, got ${ts.SyntaxKind[typeNode.kind]}.`);
     }
-
-    // If there are any generics, we have to reflect them as well.
-    const translatedArgs =
-        node.typeArguments.map(arg => this.translateTransplantedTypeNode(arg, context));
-
-    return ts.factory.updateTypeReferenceNode(
-        result, result.typeName, ts.factory.createNodeArray(translatedArgs));
-  }
-
-  /**
-   * Translates a type node so that all of the type references it
-   * contains are imported and can be referenced in the context file.
-   */
-  private translateTransplantedTypeNode(rootNode: ts.TypeNode, context: any): ts.TypeNode {
-    const factory: ts.TransformerFactory<ts.Node> = transformContext => root => {
-      const walk = (node: ts.Node): ts.Node => {
-        if (ts.isTypeReferenceNode(node) && ts.isIdentifier(node.typeName)) {
-          const translated =
-              this.translateTransplantedTypeReferenceNode(node as ts.TypeReferenceNode & {
-                typeName: ts.Identifier;
-              }, context);
-
-          if (translated !== node) {
-            return translated;
-          }
-        }
-
-        return ts.visitEachChild(node, walk, transformContext);
-      };
-
-      return ts.visitNode(root, walk);
-    };
-
-    return ts.transform(rootNode, [factory]).transformed[0] as ts.TypeNode;
+    return typeNode;
   }
 }

packages/compiler-cli/src/ngtsc/translator/src/type_translator.ts

@@ -9,9 +9,7 @@ import ts from 'typescript';
 
 import {OwningModule, Reference} from '../../imports';
 import {DeclarationNode, ReflectionHost} from '../../reflection';
-
-import {canEmitType, TypeEmitter} from './type_emitter';
-
+import {canEmitType, TypeEmitter} from '../../translator';
 
 /**
  * See `TypeEmitter` for more information on the emitting process.

packages/compiler-cli/src/ngtsc/typecheck/src/type_parameter_emitter.ts

@@ -8748,6 +8748,33 @@ function allTests(os: string) {
         expect(dtsContents).toContain('static ngAcceptInputType_value: i1.ExternalToNumberType;');
       });
 
+      it('should compile an input referencing an imported function with literal types', () => {
+        env.write('/transforms.ts', `
+          export function toBoolean(value: boolean | '' | 'true' | 'false'): boolean {
+            return !!value;
+          }
+        `);
+        env.write('/test.ts', `
+          import {Directive, Input} from '@angular/core';
+          import {toBoolean} from './transforms';
+
+          @Directive({standalone: true})
+          export class Dir {
+            @Input({transform: toBoolean}) value!: number;
+          }
+        `);
+
+        env.driveMain();
+
+        const jsContents = env.getContents('test.js');
+        const dtsContents = env.getContents('test.d.ts');
+
+        expect(jsContents).toContain('inputs: { value: ["value", "value", toBoolean] }');
+        expect(jsContents).toContain('features: [i0.ɵɵInputTransformsFeature]');
+        expect(dtsContents)
+            .toContain(`static ngAcceptInputType_value: boolean | "" | "true" | "false";`);
+      });
+
       it('should compile a directive input with a transform function with a `this` typing', () => {
         env.write('/test.ts', `
           import {Directive, Input} from '@angular/core';