feat(compiler-cli): report error if undecorated class with Angular features is discovered (#36921)

Previously in v9, we deprecated the pattern of undecorated base classes
that rely on Angular features. We ran a migration for this in version 9
and will run the same on in version 10 again.

To ensure that projects do not regress and start using the unsupported
pattern again, we report an error in ngtsc if such undecorated classes
are discovered.

We keep the compatibility code enabled in ngcc so that libraries
can be still be consumed, even if they have not been migrated yet.

Resolves FW-2130.

PR Close #36921
This commit is contained in:
Paul Gschwendtner
2020-05-04 21:20:00 +02:00
committed by Alex Rickabaugh
parent c6ecdc9a81
commit 4c92cf43cf
11 changed files with 146 additions and 591 deletions

View File

@ -545,6 +545,7 @@ runInEachFileSystem(os => {
Output as AngularOutput
} from '@angular/core';
@AngularDirective()
export class TestBase {
@AngularInput() input: any;
@AngularOutput() output: any;
@ -884,10 +885,11 @@ runInEachFileSystem(os => {
expect(jsContents).toContain('background-color: blue');
});
it('should include generic type for undecorated class declarations', () => {
it('should include generic type in directive definition', () => {
env.write('test.ts', `
import {Component, Input, NgModule} from '@angular/core';
import {Directive, Input, NgModule} from '@angular/core';
@Directive()
export class TestBase {
@Input() input: any;
}
@ -905,6 +907,76 @@ runInEachFileSystem(os => {
`static ɵdir: i0.ɵɵDirectiveDefWithMeta<TestBase, never, never, { "input": "input"; }, {}, never>;`);
});
describe('undecorated classes using Angular features', () => {
it('should error if @Input has been discovered',
() => assertErrorUndecoratedClassWithField('Input'));
it('should error if @Output has been discovered',
() => assertErrorUndecoratedClassWithField('Output'));
it('should error if @ViewChild has been discovered',
() => assertErrorUndecoratedClassWithField('ViewChild'));
it('should error if @ViewChildren has been discovered',
() => assertErrorUndecoratedClassWithField('ViewChildren'));
it('should error if @ContentChild has been discovered',
() => assertErrorUndecoratedClassWithField('ContentChildren'));
it('should error if @HostBinding has been discovered',
() => assertErrorUndecoratedClassWithField('HostBinding'));
it('should error if @HostListener has been discovered',
() => assertErrorUndecoratedClassWithField('HostListener'));
it(`should error if ngOnChanges lifecycle hook has been discovered`,
() => assertErrorUndecoratedClassWithLifecycleHook('ngOnChanges'));
it(`should error if ngOnInit lifecycle hook has been discovered`,
() => assertErrorUndecoratedClassWithLifecycleHook('ngOnInit'));
it(`should error if ngOnDestroy lifecycle hook has been discovered`,
() => assertErrorUndecoratedClassWithLifecycleHook('ngOnDestroy'));
it(`should error if ngDoCheck lifecycle hook has been discovered`,
() => assertErrorUndecoratedClassWithLifecycleHook('ngDoCheck'));
it(`should error if ngAfterViewInit lifecycle hook has been discovered`,
() => assertErrorUndecoratedClassWithLifecycleHook('ngAfterViewInit'));
it(`should error if ngAfterViewChecked lifecycle hook has been discovered`,
() => assertErrorUndecoratedClassWithLifecycleHook('ngAfterViewChecked'));
it(`should error if ngAfterContentInit lifecycle hook has been discovered`,
() => assertErrorUndecoratedClassWithLifecycleHook('ngAfterContentInit'));
it(`should error if ngAfterContentChecked lifecycle hook has been discovered`,
() => assertErrorUndecoratedClassWithLifecycleHook('ngAfterContentChecked'));
function assertErrorUndecoratedClassWithField(fieldDecoratorName: string) {
env.write('test.ts', `
import {Component, ${fieldDecoratorName}, NgModule} from '@angular/core';
export class SomeBaseClass {
@${fieldDecoratorName}() someMember: any;
}
`);
const errors = env.driveDiagnostics();
expect(errors.length).toBe(1);
expect(trim(errors[0].messageText as string))
.toContain(
'Class is using Angular features but is not decorated. Please add an explicit ' +
'Angular decorator.');
}
function assertErrorUndecoratedClassWithLifecycleHook(lifecycleName: string) {
env.write('test.ts', `
import {Component, NgModule} from '@angular/core';
export class SomeBaseClass {
${lifecycleName}() {
// empty
}
}
`);
const errors = env.driveDiagnostics();
expect(errors.length).toBe(1);
expect(trim(errors[0].messageText as string))
.toContain(
'Class is using Angular features but is not decorated. Please add an explicit ' +
'Angular decorator.');
}
});
it('should compile NgModules without errors', () => {
env.write('test.ts', `
import {Component, NgModule} from '@angular/core';