[ADF-5146] Upgrade to Angular 10 (#5834)

* remove useless module

* upgrade to angular 8

* upgrade material to v8

* upgrade adf libs

* migrate demo shell to v8

* upgrade to angular 9

* upgrade material to v9

* remove hammer

* upgrade nx

* upgrade datetime picker

* upgrade flex layout

* update core api

* remove entry components

* code fixes

* upgrade testbed usage

* code fixes

* remove unnecessary core-js from tests

* upgrade CLI

* ts config fixes

* fix builds

* fix testing config

* compile fixes

* fix demo shell dev setup

* fix core tests

* fix card view import

* upgrade nx

* disable smart builds for now

* remove fdescribe

* restore smart builds

* fix issues

* unify tsconfigs and fix newly found issues

* fix configuration and cleanup package scripts

* improved production build from the same config

* use ADF libs directly instead of node_modules

* disable smart build

* single app configuration (angular)

* fix core build

* fix build scripts

* lint fixes

* fix linting setup

* fix linting rules

* various fixes

* disable affected libs for unit tests

* cleanup insights package.json

* simplify smart-build

* fix content tests

* fix tests

* test fixes

* fix tests

* fix test

* fix tests

* disable AppExtensionsModule (monaco example)

* remove monaco extension module

* upgrade bundle check rules

* fix insights tests and karma config

* fix protractor config

* e2e workaround

* upgrade puppeteer and split linting and build

* reusable resources config

* update protractor config

* fix after rebase

* fix protractor config

* fix e2e tsconfig

* update e2e setup

* Save demoshell artifact on S3 and remove travis cache

* Push the libs on S3 and fetch before releasing it

* Add deps

* Add dependencies among libs and run only affected unit test and build

* fix the travis stage name

* fix after renaming dev to demoshell

* force the order of the projects

* remove unused dependencies

* fix content e2e script

* exit codes fix

* add extra exit codes to core e2e

* postinstall hook and package cleanup

* cleanup packages

* remove deprecated code and dependency on router

* improve bundle analyzer script

* minor code fixes

* update spec

* fix code after rebase

* upgrade protractor after rebase

* fix e2e mapping lib

* Update tsconfig.e2e.json

* update e2e tsconfig

* fix angular config

* fix protractor runs

* cache dist folder for libs

* update material selectors for dropdowns

* selector fixes

* remove duplicated e2e that have unit tests already

* fix login selector

* fix e2e

* fix test

* fix import issues

* fix selector

* cleanup old monaco extension files

* cleanup demo shell login

* add protractor max retries

* disable customisations of protractor

* fix login validation

* fix after rebase

* fix after rebase, disable latest versions of libs

* Hide the report tab and rollback the localstorage

* rename protractor config back to js

* restore lint as part of build

* cleanup code

* do not copy anything to node_modules on dist test

* fix unit tests

* config fixes

* fix code

* fix code after rebase

* fix tests

* remove existing words from spellcheck

* remove useless directive decorators

* update package.json after rebase

* add js-api back

* code fixes

* add missing export

* update configs

* fix code

* try fix the sso login test

* fix

* remove puppeteer unit

* fix e2e script

* fix

* make provider easy

* fix routes module before upgrade

* fix unit tests

* upgrade angular cli

* upgrade to angular 10

Co-authored-by: maurizio vitale <maurizio.vitale@alfresco.com>
Co-authored-by: Eugenio Romano <eugenio.romano@alfresco.com>
Co-authored-by: Eugenio Romano <eromano@users.noreply.github.com>

lib/core/login/components/login-dialog-panel.component.spec.ts

@@ -41,7 +41,7 @@ describe('LoginDialogPanelComponent', () => {
         fixture = TestBed.createComponent(LoginDialogPanelComponent);
         element = fixture.nativeElement;
         component = fixture.componentInstance;
-        authService = TestBed.get(AuthenticationService);
+        authService = TestBed.inject(AuthenticationService);
         fixture.detectChanges();
         fixture.whenStable().then(() => {
             usernameInput = element.querySelector('#username');

lib/core/login/components/login-dialog-panel.component.ts

@@ -30,7 +30,7 @@ export class LoginDialogPanelComponent {
     @Output()
     success = new EventEmitter<LoginSuccessEvent>();
 
-    @ViewChild('adfLogin')
+    @ViewChild('adfLogin', { static: true })
     login: LoginComponent;
 
     submitForm(): void {

lib/core/login/components/login-dialog.component.ts

@@ -16,7 +16,7 @@
  */
 
 import { Component, Inject, ViewEncapsulation, ViewChild } from '@angular/core';
-import { MAT_DIALOG_DATA } from '@angular/material';
+import { MAT_DIALOG_DATA } from '@angular/material/dialog';
 import { LoginDialogComponentData } from './login-dialog-component-data.interface';
 import { LoginDialogPanelComponent } from './login-dialog-panel.component';
 @Component({
@@ -27,7 +27,7 @@ import { LoginDialogPanelComponent } from './login-dialog-panel.component';
 })
 export class LoginDialogComponent {
 
-    @ViewChild('adfLoginPanel')
+    @ViewChild('adfLoginPanel', { static: true })
     loginPanel: LoginDialogPanelComponent;
 
     buttonActionName = '';

lib/core/login/components/login.component.spec.ts

@@ -76,11 +76,11 @@ describe('LoginComponent', () => {
         component.showRememberMe = true;
         component.showLoginActions = true;
 
-        authService = TestBed.get(AuthenticationService);
-        router = TestBed.get(Router);
-        userPreferences = TestBed.get(UserPreferencesService);
-        appConfigService = TestBed.get(AppConfigService);
-        alfrescoApiService = TestBed.get(AlfrescoApiService);
+        authService = TestBed.inject(AuthenticationService);
+        router = TestBed.inject(Router);
+        userPreferences = TestBed.inject(UserPreferencesService);
+        appConfigService = TestBed.inject(AppConfigService);
+        alfrescoApiService = TestBed.inject(AlfrescoApiService);
 
         fixture.detectChanges();
 
@@ -281,18 +281,6 @@ describe('LoginComponent', () => {
         expect(element.querySelector('#login-action-register')).toBe(null);
     });
 
-    it('should not render a validation min-length as default', () => {
-        usernameInput.value = '1';
-        usernameInput.dispatchEvent(new Event('input'));
-
-        fixture.detectChanges();
-
-        expect(component.formError).toBeDefined();
-        expect(component.formError.username).toBeDefined();
-        expect(component.formError.username).toBe('');
-        expect(element.querySelector('#username-error')).toBeNull();
-    });
-
     describe('Error', () => {
 
         it('should render validation min-length error when the username is just 1 character with a custom validation Validators.minLength(3)', () => {

lib/core/login/components/login.component.ts

@@ -131,12 +131,6 @@ export class LoginComponent implements OnInit, OnDestroy {
     private _message: { [id: string]: { [id: string]: ValidationMessage } };
     private onDestroy$ = new Subject<boolean>();
 
-    /**
-     * Constructor
-     * @param _fb
-     * @param authService
-     * @param translate
-     */
     constructor(
         private _fb: FormBuilder,
         private authService: AuthenticationService,
@@ -148,12 +142,13 @@ export class LoginComponent implements OnInit, OnDestroy {
         private location: Location,
         private route: ActivatedRoute,
         private sanitizer: DomSanitizer
-    ) {
-        this.initFormError();
-        this.initFormFieldsMessages();
-    }
+    ) {}
 
     ngOnInit() {
+        this.initFormError();
+        this.initFormFieldsDefault();
+        this.initFormFieldsMessages();
+
         if (this.authService.isOauth()) {
             const oauth: OauthConfigModel = this.appConfig.get<OauthConfigModel>(AppConfigValues.OAUTHCONFIG, null);
             if (oauth && oauth.implicitFlow) {
@@ -172,12 +167,10 @@ export class LoginComponent implements OnInit, OnDestroy {
             });
         }
 
-        if (this.hasCustomFieldsValidation()) {
+        if (this.fieldsValidation) {
             this.form = this._fb.group(this.fieldsValidation);
-        } else {
-            this.initFormFieldsDefault();
-            this.initFormFieldsMessagesDefault();
         }
+
         this.form.valueChanges
             .pipe(takeUntil(this.onDestroy$))
             .subscribe(data => this.onValueChanged(data));
@@ -368,27 +361,15 @@ export class LoginComponent implements OnInit, OnDestroy {
      * Init form fields messages
      */
     private initFormFieldsMessages() {
-        this._message = {
-            username: {},
-            password: {}
-        };
-    }
-
-    /**
-     * Default form fields messages
-     */
-    private initFormFieldsMessagesDefault() {
         this._message = {
             username: {
                 required: {
                     value: 'LOGIN.MESSAGES.USERNAME-REQUIRED'
                 },
-                minLength: {
+                minlength: {
                     value: 'LOGIN.MESSAGES.USERNAME-MIN',
                     params: {
-                        get minLength() {
-                            return this.minLength;
-                        }
+                        minLength: this.minLength
                     }
                 }
 
@@ -403,7 +384,7 @@ export class LoginComponent implements OnInit, OnDestroy {
 
     private initFormFieldsDefault() {
         this.form = this._fb.group({
-            username: ['', Validators.required],
+            username: ['', Validators.compose([Validators.required, Validators.minLength(this.minLength)])],
             password: ['', Validators.required]
         });
     }
@@ -415,8 +396,4 @@ export class LoginComponent implements OnInit, OnDestroy {
         this.isError = false;
         this.initFormError();
     }
-
-    private hasCustomFieldsValidation(): boolean {
-        return this.fieldsValidation !== undefined;
-    }
 }

lib/core/login/login.module.ts

@@ -44,7 +44,6 @@ import { LoginDialogPanelComponent } from './components/login-dialog-panel.compo
         LoginDialogComponent,
         LoginDialogPanelComponent
     ],
-    entryComponents: [LoginDialogComponent, LoginDialogPanelComponent],
     exports: [
         LoginComponent,
         LoginFooterDirective,