feat(ngcc): add a migration for undecorated child classes (#33362)

In Angular View Engine, there are two kinds of decorator inheritance:

1) both the parent and child classes have decorators

This case is supported by InheritDefinitionFeature, which merges some fields
of the definitions (such as the inputs or queries).

2) only the parent class has a decorator

If the child class is missing a decorator, the compiler effectively behaves
as if the parent class' decorator is applied to the child class as well.
This is the "undecorated child" scenario, and this commit adds a migration
to ngcc to support this pattern in Ivy.

This migration has 2 phases. First, the NgModules of the application are
scanned for classes in 'declarations' which are missing decorators, but
whose base classes do have decorators. These classes are the undecorated
children. This scan is performed recursively, so even if a declared class
has a base class that itself inherits a decorator, this case is handled.

Next, a synthetic decorator (either @Component or @Directive) is created
on the child class. This decorator copies some critical information such
as 'selector' and 'exportAs', as well as supports any decorated fields
(@Input, etc). A flag is passed to the decorator compiler which causes a
special feature `CopyDefinitionFeature` to be included on the compiled
definition. This feature copies at runtime the remaining aspects of the
parent definition which `InheritDefinitionFeature` does not handle,
completing the "full" inheritance of the child class' decorator from its
parent class.

PR Close #33362

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

@@ -19,7 +19,7 @@ import {flattenInheritedDirectiveMetadata} from '../../metadata/src/inheritance'
 import {EnumValue, PartialEvaluator} from '../../partial_evaluator';
 import {ClassDeclaration, Decorator, ReflectionHost, reflectObjectLiteral} from '../../reflection';
 import {ComponentScopeReader, LocalModuleScopeRegistry} from '../../scope';
-import {AnalysisOutput, CompileResult, DecoratorHandler, DetectResult, HandlerPrecedence, ResolveResult} from '../../transform';
+import {AnalysisOutput, CompileResult, DecoratorHandler, DetectResult, HandlerFlags, HandlerPrecedence, ResolveResult} from '../../transform';
 import {TemplateSourceMapping, TypeCheckContext} from '../../typecheck';
 import {NoopResourceDependencyRecorder, ResourceDependencyRecorder} from '../../util/src/resource_recorder';
 import {tsSourceMapBug29300Fixed} from '../../util/src/ts_source_map_bug_29300';
@@ -137,7 +137,8 @@ export class ComponentDecoratorHandler implements
     }
   }
 
-  analyze(node: ClassDeclaration, decorator: Decorator): AnalysisOutput<ComponentHandlerData> {
+  analyze(node: ClassDeclaration, decorator: Decorator, flags: HandlerFlags = HandlerFlags.NONE):
+      AnalysisOutput<ComponentHandlerData> {
     const containingFile = node.getSourceFile().fileName;
     this.literalCache.delete(decorator);
 
@@ -145,7 +146,7 @@ export class ComponentDecoratorHandler implements
     // on it.
     const directiveResult = extractDirectiveMetadata(
         node, decorator, this.reflector, this.evaluator, this.defaultImportRecorder, this.isCore,
-        this.elementSchemaRegistry.getDefaultComponentElementName());
+        flags, this.elementSchemaRegistry.getDefaultComponentElementName());
     if (directiveResult === undefined) {
       // `extractDirectiveMetadata` returns undefined when the @Directive has `jit: true`. In this
       // case, compilation of the decorator is skipped. Returning an empty object signifies

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

@@ -15,7 +15,7 @@ import {MetadataRegistry} from '../../metadata';
 import {extractDirectiveGuards} from '../../metadata/src/util';
 import {DynamicValue, EnumValue, PartialEvaluator} from '../../partial_evaluator';
 import {ClassDeclaration, ClassMember, ClassMemberKind, Decorator, ReflectionHost, filterToMembersWithDecorator, reflectObjectLiteral} from '../../reflection';
-import {AnalysisOutput, CompileResult, DecoratorHandler, DetectResult, HandlerPrecedence} from '../../transform';
+import {AnalysisOutput, CompileResult, DecoratorHandler, DetectResult, HandlerFlags, HandlerPrecedence} from '../../transform';
 
 import {compileNgFactoryDefField} from './factory';
 import {generateSetClassMetadataCall} from './metadata';
@@ -51,9 +51,11 @@ export class DirectiveDecoratorHandler implements
     }
   }
 
-  analyze(node: ClassDeclaration, decorator: Decorator): AnalysisOutput<DirectiveHandlerData> {
+  analyze(node: ClassDeclaration, decorator: Decorator, flags = HandlerFlags.NONE):
+      AnalysisOutput<DirectiveHandlerData> {
     const directiveResult = extractDirectiveMetadata(
-        node, decorator, this.reflector, this.evaluator, this.defaultImportRecorder, this.isCore);
+        node, decorator, this.reflector, this.evaluator, this.defaultImportRecorder, this.isCore,
+        flags);
     const analysis = directiveResult && directiveResult.metadata;
     if (analysis === undefined) {
       return {};
@@ -111,7 +113,7 @@ export class DirectiveDecoratorHandler implements
 export function extractDirectiveMetadata(
     clazz: ClassDeclaration, decorator: Decorator, reflector: ReflectionHost,
     evaluator: PartialEvaluator, defaultImportRecorder: DefaultImportRecorder, isCore: boolean,
-    defaultSelector: string | null = null): {
+    flags: HandlerFlags, defaultSelector: string | null = null): {
   decorator: Map<string, ts.Expression>,
   metadata: R3DirectiveMetadata,
   decoratedElements: ClassMember[],
@@ -236,6 +238,7 @@ export function extractDirectiveMetadata(
     },
     inputs: {...inputsFromMeta, ...inputsFromFields},
     outputs: {...outputsFromMeta, ...outputsFromFields}, queries, viewQueries, selector,
+    fullInheritance: !!(flags & HandlerFlags.FULL_INHERITANCE),
     type: new WrappedNodeExpr(clazz.name),
     typeArgumentCount: reflector.getGenericArityOfClass(clazz) || 0,
     typeSourceSpan: EMPTY_SOURCE_SPAN, usesInheritance, exportAs, providers

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

@@ -313,15 +313,10 @@ export function isWrappedTsNodeExpr(expr: Expression): expr is WrappedNodeExpr<t
 export function readBaseClass(
     node: ClassDeclaration, reflector: ReflectionHost,
     evaluator: PartialEvaluator): Reference<ClassDeclaration>|'dynamic'|null {
-  if (!isNamedClassDeclaration(node)) {
-    // If the node isn't a ts.ClassDeclaration, consider any base class to be dynamic for now.
-    return reflector.hasBaseClass(node) ? 'dynamic' : null;
-  }
-
   const baseExpression = reflector.getBaseClassExpression(node);
   if (baseExpression !== null) {
     const baseClass = evaluator.evaluate(baseExpression);
-    if (baseClass instanceof Reference && isNamedClassDeclaration(baseClass.node)) {
+    if (baseClass instanceof Reference && reflector.isClass(baseClass.node)) {
       return baseClass as Reference<ClassDeclaration>;
     } else {
       return 'dynamic';

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

@@ -37,6 +37,27 @@ export enum HandlerPrecedence {
   WEAK,
 }
 
+/**
+ * A set of options which can be passed to a `DecoratorHandler` by a consumer, to tailor the output
+ * of compilation beyond the decorators themselves.
+ */
+export enum HandlerFlags {
+  /**
+   * No flags set.
+   */
+  NONE = 0x0,
+
+  /**
+   * Indicates that this decorator is fully inherited from its parent at runtime. In addition to
+   * normally inherited aspects such as inputs and queries, full inheritance applies to every aspect
+   * of the component or directive, such as the template function itself.
+   *
+   * Its primary effect is to cause the `CopyDefinitionFeature` to be applied to the definition
+   * being compiled. See that class for more information.
+   */
+  FULL_INHERITANCE = 0x00000001,
+}
+
 
 /**
  * Provides the interface between a decorator compiler from @angular/compiler and the Typescript
@@ -75,7 +96,7 @@ export interface DecoratorHandler<A, M> {
    * if successful, or an array of diagnostic messages if the analysis fails or the decorator
    * isn't valid.
    */
-  analyze(node: ClassDeclaration, metadata: M): AnalysisOutput<A>;
+  analyze(node: ClassDeclaration, metadata: M, handlerFlags?: HandlerFlags): AnalysisOutput<A>;
 
   /**
    * Registers information about the decorator for the indexing phase in a