refactor(compiler-cli): only use type constructors for directives with generic types (angular#38249)

Prior to this change, the template type checker would always use a
type-constructor to instantiate a directive. This type-constructor call
serves two purposes:

1. Infer any generic types for the directive instance from the inputs
   that are passed in.
2. Type check the inputs that are passed into the directive's inputs.

The first purpose is only relevant when the directive actually has any
generic types and using a type-constructor for these cases inhibits
a type-check performance penalty, as a type-constructor's signature is
quite complex and needs to be generated for each directive.

This commit refactors the generated type-check blocks to only generate
a type-constructor call for directives that have generic types. Type
checking of inputs is achieved by generating individual statements for
all inputs, using assignments into the directive's fields.

Even if a type-constructor is used for type-inference of generic types
will the input checking also be achieved using the individual assignment
statements. This is done to support the rework of the language service,
which will start to extract symbol information from the type-check
blocks.

As a future optimization, it may be possible to reduce the number of
inputs passed into a type-constructor to only those inputs that
contribute the the type-inference of the generics. As this is not a
necessity at the moment this is left as follow-up work.

Closes angular#38185

PR Close angular#38249

Author: JoostK

packages/compiler-cli/src/ngtsc/annotations/src/component.ts

@@ -15,7 +15,7 @@ import {absoluteFrom, relative} from '../../file_system';
 import {DefaultImportRecorder, ModuleResolver, Reference, ReferenceEmitter} from '../../imports';
 import {DependencyTracker} from '../../incremental/api';
 import {IndexingContext} from '../../indexer';
-import {DirectiveMeta, extractDirectiveGuards, InjectableClassRegistry, MetadataReader, MetadataRegistry} from '../../metadata';
+import {DirectiveMeta, DirectiveTypeCheckMeta, extractDirectiveTypeCheckMeta, InjectableClassRegistry, MetadataReader, MetadataRegistry} from '../../metadata';
 import {flattenInheritedDirectiveMetadata} from '../../metadata/src/inheritance';
 import {EnumValue, PartialEvaluator} from '../../partial_evaluator';
 import {ClassDeclaration, Decorator, ReflectionHost, reflectObjectLiteral} from '../../reflection';
@@ -51,7 +51,7 @@ export interface ComponentAnalysisData {
    */
   meta: Omit<R3ComponentMetadata, ComponentMetadataResolvedFields>;
   baseClass: Reference<ClassDeclaration>|'dynamic'|null;
-  guards: ReturnType<typeof extractDirectiveGuards>;
+  typeCheckMeta: DirectiveTypeCheckMeta;
   template: ParsedTemplateWithSource;
   metadataStmt: Statement|null;
 
@@ -327,7 +327,7 @@ export class ComponentDecoratorHandler implements
           i18nUseExternalIds: this.i18nUseExternalIds,
           relativeContextFilePath,
         },
-        guards: extractDirectiveGuards(node, this.reflector),
+        typeCheckMeta: extractDirectiveTypeCheckMeta(node, metadata.inputs, this.reflector),
         metadataStmt: generateSetClassMetadataCall(
             node, this.reflector, this.defaultImportRecorder, this.isCore,
             this.annotateForClosureCompiler),
@@ -356,7 +356,7 @@ export class ComponentDecoratorHandler implements
       queries: analysis.meta.queries.map(query => query.propertyName),
       isComponent: true,
       baseClass: analysis.baseClass,
-      ...analysis.guards,
+      ...analysis.typeCheckMeta,
     });
 
     this.injectableRegistry.registerInjectable(node);

packages/compiler-cli/src/ngtsc/annotations/src/directive.ts

@@ -11,8 +11,8 @@ import * as ts from 'typescript';
 
 import {ErrorCode, FatalDiagnosticError} from '../../diagnostics';
 import {DefaultImportRecorder, Reference} from '../../imports';
-import {InjectableClassRegistry, MetadataReader, MetadataRegistry} from '../../metadata';
-import {extractDirectiveGuards} from '../../metadata/src/util';
+import {DirectiveTypeCheckMeta, InjectableClassRegistry, MetadataReader, MetadataRegistry} from '../../metadata';
+import {extractDirectiveTypeCheckMeta} from '../../metadata/src/util';
 import {DynamicValue, EnumValue, PartialEvaluator} from '../../partial_evaluator';
 import {ClassDeclaration, ClassMember, ClassMemberKind, Decorator, filterToMembersWithDecorator, ReflectionHost, reflectObjectLiteral} from '../../reflection';
 import {LocalModuleScopeRegistry} from '../../scope';
@@ -35,7 +35,7 @@ const LIFECYCLE_HOOKS = new Set([
 
 export interface DirectiveHandlerData {
   baseClass: Reference<ClassDeclaration>|'dynamic'|null;
-  guards: ReturnType<typeof extractDirectiveGuards>;
+  typeCheckMeta: DirectiveTypeCheckMeta;
   meta: R3DirectiveMetadata;
   metadataStmt: Statement|null;
   providersRequiringFactory: Set<Reference<ClassDeclaration>>|null;
@@ -102,7 +102,7 @@ export class DirectiveDecoratorHandler implements
             node, this.reflector, this.defaultImportRecorder, this.isCore,
             this.annotateForClosureCompiler),
         baseClass: readBaseClass(node, this.reflector, this.evaluator),
-        guards: extractDirectiveGuards(node, this.reflector),
+        typeCheckMeta: extractDirectiveTypeCheckMeta(node, analysis.inputs, this.reflector),
         providersRequiringFactory
       }
     };
@@ -122,7 +122,7 @@ export class DirectiveDecoratorHandler implements
       queries: analysis.meta.queries.map(query => query.propertyName),
       isComponent: false,
       baseClass: analysis.baseClass,
-      ...analysis.guards,
+      ...analysis.typeCheckMeta,
     });
 
     this.injectableRegistry.registerInjectable(node);

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

@@ -9,4 +9,4 @@
 export * from './src/api';
 export {DtsMetadataReader} from './src/dts';
 export {CompoundMetadataRegistry, LocalMetadataRegistry, InjectableClassRegistry} from './src/registry';
-export {extractDirectiveGuards, CompoundMetadataReader} from './src/util';
+export {extractDirectiveTypeCheckMeta, CompoundMetadataReader} from './src/util';

packages/compiler-cli/src/ngtsc/metadata/src/api.ts

@@ -32,19 +32,55 @@ export interface NgModuleMeta {
   rawDeclarations: ts.Expression|null;
 }
 
+/**
+ * Typing metadata collected for a directive within an NgModule's scope.
+ */
+export interface DirectiveTypeCheckMeta {
+  /**
+   * List of static `ngTemplateGuard_xx` members found on the Directive's class.
+   * @see `TemplateGuardMeta`
+   */
+  ngTemplateGuards: TemplateGuardMeta[];
+
+  /**
+   * Whether the Directive's class has a static ngTemplateContextGuard function.
+   */
+  hasNgTemplateContextGuard: boolean;
+
+  /**
+   * The set of input fields which have a corresponding static `ngAcceptInputType_` on the
+   * Directive's class. This allows inputs to accept a wider range of types and coerce the input to
+   * a narrower type with a getter/setter. See https://angular.io/guide/template-typecheck.
+   */
+  coercedInputFields: Set<string>;
+
+  /**
+   * The set of input fields which map to `readonly`, `private`, or `protected` members in the
+   * Directive's class.
+   */
+  restrictedInputFields: Set<string>;
+
+  /**
+   * The set of input fields which do not have corresponding members in the Directive's class.
+   */
+  undeclaredInputFields: Set<string>;
+
+  /**
+   * Whether the Directive's class is generic, i.e. `class MyDir<T> {...}`.
+   */
+  isGeneric: boolean;
+}
+
 /**
  * Metadata collected for a directive within an NgModule's scope.
  */
-export interface DirectiveMeta extends T2DirectiveMeta {
+export interface DirectiveMeta extends T2DirectiveMeta, DirectiveTypeCheckMeta {
   ref: Reference<ClassDeclaration>;
   /**
    * Unparsed selector of the directive, or null if the directive does not have a selector.
    */
   selector: string|null;
   queries: string[];
-  ngTemplateGuards: TemplateGuardMeta[];
-  hasNgTemplateContextGuard: boolean;
-  coercedInputFields: Set<string>;
 
   /**
    * A `Reference` to the base class for the directive, if one was detected.

packages/compiler-cli/src/ngtsc/metadata/src/dts.ts

@@ -12,7 +12,7 @@ import {Reference} from '../../imports';
 import {ClassDeclaration, isNamedClassDeclaration, ReflectionHost} from '../../reflection';
 
 import {DirectiveMeta, MetadataReader, NgModuleMeta, PipeMeta} from './api';
-import {extractDirectiveGuards, extractReferencesFromType, readStringArrayType, readStringMapType, readStringType} from './util';
+import {extractDirectiveTypeCheckMeta, extractReferencesFromType, readStringArrayType, readStringMapType, readStringType} from './util';
 
 /**
  * A `MetadataReader` that can read metadata from `.d.ts` files, which have static Ivy properties
@@ -76,16 +76,17 @@ export class DtsMetadataReader implements MetadataReader {
       return null;
     }
 
+    const inputs = readStringMapType(def.type.typeArguments[3]);
     return {
       ref,
       name: clazz.name.text,
       isComponent: def.name === 'ɵcmp',
       selector: readStringType(def.type.typeArguments[1]),
       exportAs: readStringArrayType(def.type.typeArguments[2]),
-      inputs: readStringMapType(def.type.typeArguments[3]),
+      inputs,
       outputs: readStringMapType(def.type.typeArguments[4]),
       queries: readStringArrayType(def.type.typeArguments[5]),
-      ...extractDirectiveGuards(clazz, this.reflector),
+      ...extractDirectiveTypeCheckMeta(clazz, inputs, this.reflector),
       baseClass: readBaseClass(clazz, this.checker, this.reflector),
     };
   }

packages/compiler-cli/src/ngtsc/metadata/src/inheritance.ts

@@ -28,6 +28,8 @@ export function flattenInheritedDirectiveMetadata(
   let inputs: {[key: string]: string|[string, string]} = {};
   let outputs: {[key: string]: string} = {};
   let coercedInputFields = new Set<string>();
+  let undeclaredInputFields = new Set<string>();
+  let restrictedInputFields = new Set<string>();
   let isDynamic = false;
 
   const addMetadata = (meta: DirectiveMeta): void => {
@@ -48,6 +50,12 @@ export function flattenInheritedDirectiveMetadata(
     for (const coercedInputField of meta.coercedInputFields) {
       coercedInputFields.add(coercedInputField);
     }
+    for (const undeclaredInputField of meta.undeclaredInputFields) {
+      undeclaredInputFields.add(undeclaredInputField);
+    }
+    for (const restrictedInputField of meta.restrictedInputFields) {
+      restrictedInputFields.add(restrictedInputField);
+    }
   };
 
   addMetadata(topMeta);
@@ -57,6 +65,8 @@ export function flattenInheritedDirectiveMetadata(
     inputs,
     outputs,
     coercedInputFields,
+    undeclaredInputFields,
+    restrictedInputFields,
     baseClass: isDynamic ? 'dynamic' : null,
   };
 }

packages/compiler-cli/src/ngtsc/metadata/src/util.ts

@@ -12,7 +12,7 @@ import {Reference} from '../../imports';
 import {ClassDeclaration, ClassMember, ClassMemberKind, isNamedClassDeclaration, ReflectionHost, reflectTypeEntityToDeclaration} from '../../reflection';
 import {nodeDebugInfo} from '../../util/src/typescript';
 
-import {DirectiveMeta, MetadataReader, NgModuleMeta, PipeMeta, TemplateGuardMeta} from './api';
+import {DirectiveMeta, DirectiveTypeCheckMeta, MetadataReader, NgModuleMeta, PipeMeta, TemplateGuardMeta} from './api';
 
 export function extractReferencesFromType(
     checker: ts.TypeChecker, def: ts.TypeNode, ngModuleImportedFrom: string|null,
@@ -78,13 +78,16 @@ export function readStringArrayType(type: ts.TypeNode): string[] {
   return res;
 }
 
-
-export function extractDirectiveGuards(node: ClassDeclaration, reflector: ReflectionHost): {
-  ngTemplateGuards: TemplateGuardMeta[],
-  hasNgTemplateContextGuard: boolean,
-  coercedInputFields: Set<string>,
-} {
-  const staticMembers = reflector.getMembersOfClass(node).filter(member => member.isStatic);
+/**
+ * Inspects the class' members and extracts the metadata that is used when type-checking templates
+ * that use the directive. This metadata does not contain information from a base class, if any,
+ * making this metadata invariant to changes of inherited classes.
+ */
+export function extractDirectiveTypeCheckMeta(
+    node: ClassDeclaration, inputs: {[fieldName: string]: string|[string, string]},
+    reflector: ReflectionHost): DirectiveTypeCheckMeta {
+  const members = reflector.getMembersOfClass(node);
+  const staticMembers = members.filter(member => member.isStatic);
   const ngTemplateGuards = staticMembers.map(extractTemplateGuard)
                                .filter((guard): guard is TemplateGuardMeta => guard !== null);
   const hasNgTemplateContextGuard = staticMembers.some(
@@ -93,7 +96,40 @@ export function extractDirectiveGuards(node: ClassDeclaration, reflector: Reflec
   const coercedInputFields =
       new Set(staticMembers.map(extractCoercedInput)
                   .filter((inputName): inputName is string => inputName !== null));
-  return {hasNgTemplateContextGuard, ngTemplateGuards, coercedInputFields};
+
+  const restrictedInputFields = new Set<string>();
+  const undeclaredInputFields = new Set<string>();
+
+  for (const fieldName of Object.keys(inputs)) {
+    const field = members.find(member => member.name === fieldName);
+    if (field === undefined || field.node === null) {
+      undeclaredInputFields.add(fieldName);
+    } else if (isRestricted(field.node)) {
+      restrictedInputFields.add(fieldName);
+    }
+  }
+
+  const arity = reflector.getGenericArityOfClass(node);
+
+  return {
+    hasNgTemplateContextGuard,
+    ngTemplateGuards,
+    coercedInputFields,
+    restrictedInputFields,
+    undeclaredInputFields,
+    isGeneric: arity !== null && arity > 0,
+  };
+}
+
+function isRestricted(node: ts.Node): boolean {
+  if (node.modifiers === undefined) {
+    return false;
+  }
+
+  return node.modifiers.some(
+      modifier => modifier.kind === ts.SyntaxKind.PrivateKeyword ||
+          modifier.kind === ts.SyntaxKind.ProtectedKeyword ||
+          modifier.kind === ts.SyntaxKind.ReadonlyKeyword);
 }
 
 function extractTemplateGuard(member: ClassMember): TemplateGuardMeta|null {

packages/compiler-cli/src/ngtsc/scope/test/local_spec.ts

@@ -243,6 +243,9 @@ function fakeDirective(ref: Reference<ClassDeclaration>): DirectiveMeta {
     hasNgTemplateContextGuard: false,
     ngTemplateGuards: [],
     coercedInputFields: new Set<string>(),
+    restrictedInputFields: new Set<string>(),
+    undeclaredInputFields: new Set<string>(),
+    isGeneric: false,
     baseClass: null,
   };
 }

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

@@ -11,20 +11,17 @@ import * as ts from 'typescript';
 
 import {AbsoluteFsPath} from '../../file_system';
 import {Reference} from '../../imports';
-import {TemplateGuardMeta} from '../../metadata';
+import {DirectiveTypeCheckMeta} from '../../metadata';
 import {ClassDeclaration} from '../../reflection';
 
 
 /**
  * Extension of `DirectiveMeta` that includes additional information required to type-check the
  * usage of a particular directive.
  */
-export interface TypeCheckableDirectiveMeta extends DirectiveMeta {
+export interface TypeCheckableDirectiveMeta extends DirectiveMeta, DirectiveTypeCheckMeta {
   ref: Reference<ClassDeclaration>;
   queries: string[];
-  ngTemplateGuards: TemplateGuardMeta[];
-  coercedInputFields: Set<string>;
-  hasNgTemplateContextGuard: boolean;
 }
 
 export type TemplateId = string&{__brand: 'TemplateId'};

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

@@ -199,12 +199,12 @@ export class TypeCheckContextImpl implements TypeCheckContext {
     for (const dir of boundTarget.getUsedDirectives()) {
       const dirRef = dir.ref as Reference<ClassDeclaration<ts.ClassDeclaration>>;
       const dirNode = dirRef.node;
-      if (requiresInlineTypeCtor(dirNode, this.reflector)) {
+
+      if (dir.isGeneric && requiresInlineTypeCtor(dirNode, this.reflector)) {
         if (this.inlining === InliningMode.Error) {
           missingInlines.push(dirNode);
           continue;
         }
-
         // Add a type constructor operation for the directive.
         this.addInlineTypeCtor(fileData, dirNode.getSourceFile(), dirRef, {
           fnName: 'ngTypeCtor',

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

@@ -86,6 +86,21 @@ export function tsDeclareVariable(id: ts.Identifier, type: ts.TypeNode): ts.Vari
       /* declarationList */[decl]);
 }
 
+/**
+ * Creates a `ts.TypeQueryNode` for a coerced input.
+ *
+ * For example: `typeof MatInput.ngAcceptInputType_value`, where MatInput is `typeName` and `value`
+ * is the `coercedInputName`.
+ *
+ * @param typeName The `EntityName` of the Directive where the static coerced input is defined.
+ * @param coercedInputName The field name of the coerced input.
+ */
+export function tsCreateTypeQueryForCoercedInput(
+    typeName: ts.EntityName, coercedInputName: string): ts.TypeQueryNode {
+  return ts.createTypeQueryNode(
+      ts.createQualifiedName(typeName, `ngAcceptInputType_${coercedInputName}`));
+}
+
 /**
  * Create a `ts.VariableStatement` that initializes a variable with a given expression.
  *