From a14a7ee1098df29193487ffcdbeff1e2d6fea9ec Mon Sep 17 00:00:00 2001 From: Christopher Cortes Date: Sun, 27 Oct 2019 09:37:04 +0100 Subject: [PATCH] refactor(all): enable `strictPropertyInitialization` in TsConfig and fix the affected code --- demo-app/src/app/app.component.ts | 6 +++--- .../src/app/components/card/card.component.ts | 8 ++++---- .../language-selector.component.ts | 16 ++++++++-------- .../simple-form-error.component.ts | 2 +- .../translated-form-error.component.ts | 4 ++-- .../ngx-forms-example.component.ts | 8 +++----- .../reactive-forms-example.component.ts | 8 +++----- .../template-driven-forms-example.component.ts | 14 +++++--------- .../form-errors-group.directive.spec.ts | 2 +- src/directives/form-errors-group.directive.ts | 2 +- src/directives/form-errors.directive.spec.ts | 12 +++++------- src/directives/form-errors.directive.ts | 10 +++++----- src/services/form-errors-message.service.spec.ts | 4 ++-- tsconfig.json | 2 -- 14 files changed, 43 insertions(+), 55 deletions(-) diff --git a/demo-app/src/app/app.component.ts b/demo-app/src/app/app.component.ts index 26a0d92..5a8003b 100644 --- a/demo-app/src/app/app.component.ts +++ b/demo-app/src/app/app.component.ts @@ -13,12 +13,12 @@ const MEDIA_MATCH = "(max-width: 600px)"; }) export class AppComponent implements OnInit, OnDestroy { @ViewChild("sidenav") - private _sidenav: MatSidenav; + private _sidenav!: MatSidenav; public mobileQueryMatches = false; - private _routerSubscription: Subscription; - private _mediaQuerySubscription: Subscription; + private _routerSubscription!: Subscription; + private _mediaQuerySubscription!: Subscription; public constructor(private _router: Router, public breakpointObserver: BreakpointObserver) {} diff --git a/demo-app/src/app/components/card/card.component.ts b/demo-app/src/app/components/card/card.component.ts index 84d664e..39ebfd3 100644 --- a/demo-app/src/app/components/card/card.component.ts +++ b/demo-app/src/app/components/card/card.component.ts @@ -7,13 +7,13 @@ import { Component, HostBinding, Input } from "@angular/core"; }) export class CardComponent { @HostBinding("class.app-color-primary") - public primaryColor: boolean; + public primaryColor = false; @HostBinding("class.app-color-accent") - public accentColor: boolean; + public accentColor = false; @HostBinding("class.app-color-warning") - public warningColor: boolean; + public warningColor = false; @HostBinding("class.app-color-success") - public successColor: boolean; + public successColor = false; @Input() public set color(color: "primary" | "accent" | "warning" | "success") { diff --git a/demo-app/src/app/components/language-selector/language-selector.component.ts b/demo-app/src/app/components/language-selector/language-selector.component.ts index f07c0e2..debed9d 100644 --- a/demo-app/src/app/components/language-selector/language-selector.component.ts +++ b/demo-app/src/app/components/language-selector/language-selector.component.ts @@ -35,14 +35,7 @@ export class LanguageSelectorComponent implements OnInit, OnDestroy { * Class constructor * @param translateService - the translation service of the application */ - public constructor(protected translateService: TranslateService) {} - - /** - * Component lifecycle hook - */ - public ngOnInit(): void { - console.log(componentName + ": controller initialized"); - + public constructor(protected translateService: TranslateService) { this.selectedLanguage = this.translateService.currentLang; this.languageChangeSubscription = this.translateService.onLangChange.subscribe( @@ -51,6 +44,13 @@ export class LanguageSelectorComponent implements OnInit, OnDestroy { ); } + /** + * Component lifecycle hook + */ + public ngOnInit(): void { + console.log(componentName + ": controller initialized"); + } + /** * Component lifecycle hook */ diff --git a/demo-app/src/app/components/simple-form-error/simple-form-error.component.ts b/demo-app/src/app/components/simple-form-error/simple-form-error.component.ts index cb22b9a..e73b3e3 100644 --- a/demo-app/src/app/components/simple-form-error/simple-form-error.component.ts +++ b/demo-app/src/app/components/simple-form-error/simple-form-error.component.ts @@ -11,7 +11,7 @@ export class SimpleFormErrorComponent implements NgxFormErrorComponent { public cssClass = "simple-form-error"; public errors: NgxFormFieldError[] = []; - public errors$: Observable; + public errors$!: Observable; public constructor() { /* empty constructor */ diff --git a/demo-app/src/app/components/translated-form-error/translated-form-error.component.ts b/demo-app/src/app/components/translated-form-error/translated-form-error.component.ts index 651d01a..548f50e 100644 --- a/demo-app/src/app/components/translated-form-error/translated-form-error.component.ts +++ b/demo-app/src/app/components/translated-form-error/translated-form-error.component.ts @@ -12,8 +12,8 @@ export class TranslatedFormErrorComponent implements NgxFormErrorComponent, OnIn public cssClass = "translated-form-error"; public errors: NgxFormFieldError[] = []; - public errors$: Observable; - public fieldName: string; + public errors$!: Observable; + public fieldName = "undefined"; public constructor(public translateService: TranslateService) {} diff --git a/demo-app/src/app/pages/ngx-forms-example/ngx-forms-example.component.ts b/demo-app/src/app/pages/ngx-forms-example/ngx-forms-example.component.ts index 73c0b95..7f0ce5c 100644 --- a/demo-app/src/app/pages/ngx-forms-example/ngx-forms-example.component.ts +++ b/demo-app/src/app/pages/ngx-forms-example/ngx-forms-example.component.ts @@ -1,5 +1,5 @@ /*tslint:disable:trackBy-function template-cyclomatic-complexity*/ -import { Component, OnInit } from "@angular/core"; +import { Component } from "@angular/core"; import { AbstractControl, FormBuilder, FormControl, FormGroup, ValidationErrors, Validators } from "@angular/forms"; import { ErrorStateMatcher } from "@angular/material/core"; import { ParentErrorStateMatcher } from "../../parent-error-state-matcher"; @@ -10,16 +10,14 @@ import { PasswordValidator } from "../../password-validator"; templateUrl: "./ngx-forms-example.component.html", styleUrls: ["./ngx-forms-example.component.scss"] }) -export class NgxFormsExampleComponent implements OnInit { +export class NgxFormsExampleComponent { public formGroup: FormGroup; public parentErrorStateMatcher: ErrorStateMatcher = new ParentErrorStateMatcher(); public passwordPattern = "^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])[a-zA-Z0-9]+$"; public showValidationDetails = false; public showValidationSummary = true; - public constructor(private formBuilder: FormBuilder) {} - - public ngOnInit(): void { + public constructor(private formBuilder: FormBuilder) { this.formGroup = this.formBuilder.group({ username: [undefined, Validators.required], matchingPasswords: new FormGroup( diff --git a/demo-app/src/app/pages/reactive-forms-example/reactive-forms-example.component.ts b/demo-app/src/app/pages/reactive-forms-example/reactive-forms-example.component.ts index a6f63b6..3dd2df9 100644 --- a/demo-app/src/app/pages/reactive-forms-example/reactive-forms-example.component.ts +++ b/demo-app/src/app/pages/reactive-forms-example/reactive-forms-example.component.ts @@ -1,5 +1,5 @@ /*tslint:disable:trackBy-function template-cyclomatic-complexity*/ -import { Component, OnInit } from "@angular/core"; +import { Component } from "@angular/core"; import { AbstractControl, FormBuilder, FormControl, FormGroup, ValidationErrors, Validators } from "@angular/forms"; import { ErrorStateMatcher } from "@angular/material/core"; import { PasswordValidator } from "../../password-validator"; @@ -10,7 +10,7 @@ import { ParentErrorStateMatcher } from "../../parent-error-state-matcher"; templateUrl: "./reactive-forms-example.component.html", styleUrls: ["./reactive-forms-example.component.scss"] }) -export class ReactiveFormsExampleComponent implements OnInit { +export class ReactiveFormsExampleComponent { public formGroup: FormGroup; public validationMessages: { [key: string]: { type: string; message: string }[] }; public parentErrorStateMatcher: ErrorStateMatcher = new ParentErrorStateMatcher(); @@ -18,9 +18,7 @@ export class ReactiveFormsExampleComponent implements OnInit { public showValidationDetails = false; public showValidationSummary = true; - public constructor(private formBuilder: FormBuilder) {} - - public ngOnInit(): void { + public constructor(private formBuilder: FormBuilder) { this.formGroup = this.formBuilder.group({ username: [undefined, Validators.required], matchingPasswords: new FormGroup( diff --git a/demo-app/src/app/pages/template-driven-forms-example/template-driven-forms-example.component.ts b/demo-app/src/app/pages/template-driven-forms-example/template-driven-forms-example.component.ts index 4dc1816..2a4cf8b 100644 --- a/demo-app/src/app/pages/template-driven-forms-example/template-driven-forms-example.component.ts +++ b/demo-app/src/app/pages/template-driven-forms-example/template-driven-forms-example.component.ts @@ -1,5 +1,5 @@ /*tslint:disable:trackBy-function template-cyclomatic-complexity*/ -import { Component, OnInit } from "@angular/core"; +import { Component } from "@angular/core"; import { NgForm } from "@angular/forms"; import { ErrorStateMatcher } from "@angular/material/core"; import { ParentErrorStateMatcher } from "../../parent-error-state-matcher"; @@ -9,10 +9,10 @@ import { ParentErrorStateMatcher } from "../../parent-error-state-matcher"; templateUrl: "./template-driven-forms-example.component.html", styleUrls: ["./template-driven-forms-example.component.scss"] }) -export class TemplateDrivenFormsExampleComponent implements OnInit { - public username: string; - public password: string; - public confirmPassword: string; +export class TemplateDrivenFormsExampleComponent { + public username = ""; + public password = ""; + public confirmPassword = ""; public parentErrorStateMatcher: ErrorStateMatcher = new ParentErrorStateMatcher(); public passwordPattern = "^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])[a-zA-Z0-9]+$"; @@ -21,10 +21,6 @@ export class TemplateDrivenFormsExampleComponent implements OnInit { public showValidationSummary = true; public constructor() { - /*empty*/ - } - - public ngOnInit(): void { this.validationMessages = { username: [ { diff --git a/src/directives/form-errors-group.directive.spec.ts b/src/directives/form-errors-group.directive.spec.ts index 8ef6af1..44f8f1d 100644 --- a/src/directives/form-errors-group.directive.spec.ts +++ b/src/directives/form-errors-group.directive.spec.ts @@ -14,7 +14,7 @@ describe("NgxFormErrorsGroupDirective", () => { public dummyGroup: string = groupName; @ViewChild(NgxFormErrorsGroupDirective) - public formErrorGroup: NgxFormErrorsGroupDirective; + public formErrorGroup!: NgxFormErrorsGroupDirective; } let fixture: ComponentFixture; diff --git a/src/directives/form-errors-group.directive.ts b/src/directives/form-errors-group.directive.ts index 79dc370..08d435c 100644 --- a/src/directives/form-errors-group.directive.ts +++ b/src/directives/form-errors-group.directive.ts @@ -23,7 +23,7 @@ export class NgxFormErrorsGroupDirective implements OnInit { /** * @ignore */ - private _formErrorsGroup: string; + private _formErrorsGroup!: string; /** * Class constructor diff --git a/src/directives/form-errors.directive.spec.ts b/src/directives/form-errors.directive.spec.ts index 1a56f40..2cc8a04 100644 --- a/src/directives/form-errors.directive.spec.ts +++ b/src/directives/form-errors.directive.spec.ts @@ -1,5 +1,5 @@ /* tslint:disable:no-big-function completed-docs */ -import { Component, OnInit, QueryList, ViewChildren } from "@angular/core"; +import { Component, QueryList, ViewChildren } from "@angular/core"; import { FormBuilder, FormControl, FormGroup, FormsModule, ReactiveFormsModule, Validators } from "@angular/forms"; import { ComponentFixture, fakeAsync, TestBed } from "@angular/core/testing"; import { BrowserDynamicTestingModule } from "@angular/platform-browser-dynamic/testing"; @@ -52,17 +52,15 @@ describe("NgxFormErrorsDirective", () => { selector: "test-component", template: templateWithFormControl }) - class TestComponent implements OnInit { + class TestComponent { public formNgxError: FormGroup; public formControlName: string = formControlName; public formControlAlias: string = formControlAlias; @ViewChildren(NgxFormErrorsDirective) - public formErrorsDirectives: QueryList; + public formErrorsDirectives!: QueryList; - public constructor(public formBuilder: FormBuilder) {} - - public ngOnInit(): void { + public constructor(public formBuilder: FormBuilder) { this.formNgxError = this.formBuilder.group({ [this.formControlName]: [ "John Doe", @@ -79,7 +77,7 @@ describe("NgxFormErrorsDirective", () => { ` }) class FormErrorComponent implements NgxFormErrorComponent { - public errors$: Observable; + public errors$!: Observable; public subscribeToErrors(): void { /*empty*/ diff --git a/src/directives/form-errors.directive.ts b/src/directives/form-errors.directive.ts index c11ad07..a5e759d 100644 --- a/src/directives/form-errors.directive.ts +++ b/src/directives/form-errors.directive.ts @@ -40,7 +40,7 @@ export class NgxFormErrorsDirective implements OnInit, OnChanges, OnDestroy { */ /* tslint:disable-next-line:no-input-rename */ @Input("ngxFormErrors") - public formControlName: string; + public formControlName!: string; /** * The field name or alias to be displayed in the validation messages instead of the form control's name. @@ -48,12 +48,12 @@ export class NgxFormErrorsDirective implements OnInit, OnChanges, OnDestroy { */ /* tslint:disable-next-line:no-input-rename */ @Input("ngxFormErrorsFieldName") - public fieldName: string; + public fieldName?: string; /** * The form control bound to this directive */ - public _formControl: AbstractControl; + public _formControl!: AbstractControl; /** * Subject used as source to emit the validation errors from the form control @@ -73,12 +73,12 @@ export class NgxFormErrorsDirective implements OnInit, OnChanges, OnDestroy { /** * Represents a component created by a `ComponentFactory`. */ - public _componentRef: ComponentRef; + public _componentRef!: ComponentRef; /** * Subscription to the changes observable of the form control bound to this directive */ - private _controlChangesSubscription: Subscription; + private _controlChangesSubscription!: Subscription; /** * Class constructor diff --git a/src/services/form-errors-message.service.spec.ts b/src/services/form-errors-message.service.spec.ts index adfbea1..1cc4edd 100644 --- a/src/services/form-errors-message.service.spec.ts +++ b/src/services/form-errors-message.service.spec.ts @@ -171,9 +171,9 @@ describe("NgxFormErrorsMessageService", () => { }); class NgxFormErrorsMessageServiceHelper extends NgxFormErrorsMessageService { - public errorMessages: NgxValidationErrorMessages; + public errorMessages: NgxValidationErrorMessages = {}; - public fieldNames: NgxValidationErrorFieldNames; + public fieldNames: NgxValidationErrorFieldNames = {}; public constructor() { super(); diff --git a/tsconfig.json b/tsconfig.json index fae0fa7..8c70a96 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -6,8 +6,6 @@ "typeRoots": ["./node_modules/@types"], "lib": ["dom", "dom.iterable", "es2017"], "paths": {}, - // FIXME set this to true asap we have a newer version of IntelliJ - "strictPropertyInitialization": false, "outDir": "./dist" } }