Merging angular-upgrade branch

angular.json

@@ -33,10 +33,22 @@
               "src/assets/js/altair_admin_common.min.js",
               "src/assets/js/common.min.js",
               "src/assets/js/pages/forms_wizard.js"
-            ]
+            ],
+            "vendorChunk": true,
+            "extractLicenses": false,
+            "buildOptimizer": false,
+            "sourceMap": true,
+            "optimization": false,
+            "namedChunks": true
           },
           "configurations": {
             "production": {
+              "budgets": [
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "6kb"
+                }
+              ],
               "fileReplacements": [
                 {
                   "replace": "src/environments/environment.ts",
@@ -46,14 +58,18 @@
               "optimization": true,
               "outputHashing": "all",
               "sourceMap": false,
-              "extractCss": true,
               "namedChunks": false,
-              "aot": true,
               "extractLicenses": true,
               "vendorChunk": false,
               "buildOptimizer": true
             },
             "beta": {
+              "budgets": [
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "6kb"
+                }
+              ],
               "fileReplacements": [
                 {
                   "replace": "src/environments/environment.ts",
@@ -63,14 +79,13 @@
               "optimization": true,
               "outputHashing": "all",
               "sourceMap": false,
-              "extractCss": true,
               "namedChunks": false,
-              "aot": true,
               "extractLicenses": true,
               "vendorChunk": false,
               "buildOptimizer": true
             }
-          }
+          },
+          "defaultConfiguration": ""
         },
         "serve": {
           "builder": "@angular-devkit/build-angular:dev-server",

package.json

@@ -3,58 +3,56 @@
   "version": "0.0.0",
   "scripts": {
     "ng": "ng",
-    "start": "ng serve",
+    "start": "ng serve --proxy-config proxy.conf.json",
     "start:proxy": "ng serve --proxy-config proxy.conf.json",
-    "build": "rm -rf dist; ng build --prod",
+    "build": "rm -rf dist; ng build --configuration production",
     "test": "ng test",
     "lint": "ng lint",
     "e2e": "ng e2e"
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^6.0.3",
+    "@angular/animations": "12.1.2",
-    "@angular/common": "^6.0.3",
+    "@angular/common": "12.1.2",
-    "@angular/compiler": "^6.0.3",
+    "@angular/compiler": "12.1.2",
-    "@angular/core": "^6.0.3",
+    "@angular/core": "12.1.2",
-    "@angular/forms": "^6.0.3",
+    "@angular/forms": "12.1.2",
-    "@angular/http": "^6.0.3",
+    "@angular/platform-browser": "12.1.2",
-    "@angular/platform-browser": "^6.0.3",
+    "@angular/platform-browser-dynamic": "^12.1.2",
-    "@angular/platform-browser-dynamic": "^6.0.3",
+    "@angular/router": "12.1.2",
-    "@angular/router": "^6.0.3",
     "altair": "^1.0.0",
-    "angular2-cookie-law": "^6.0.4",
     "bootstrap": "^4.1.3",
     "core-js": "^2.5.4",
-    "highcharts": "^7.2.1",
+    "highcharts": "^9.1.2",
-    "highcharts-angular": "^2.4.0",
+    "highcharts-angular": "^2.10.0",
     "jquery": "^3.4.1",
     "jquery-bez": "^1.0.11",
-    "ngx-bootstrap": "^3.0.1",
+    "ngx-bootstrap": "^4.3.0",
-    "ngx-matomo": "^0.1.2",
+    "ngx-matomo": "1.0.0-rc.0",
-    "rxjs": "6.3.3",
+    "rxjs": "6.6.7",
+    "tslib": "^2.0.0",
     "uikit": "^3.0.0-rc.19",
-    "zone.js": "^0.8.26"
+    "zone.js": "~0.11.4"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "~0.6.8",
+    "@angular-devkit/build-angular": "~12.1.2",
-    "@angular/cli": "~6.0.8",
+    "@angular/cli": "~12.1.2",
-    "@angular/compiler-cli": "^6.0.3",
+    "@angular/compiler-cli": "^12.1.2",
-    "@angular/language-service": "^6.0.3",
+    "@angular/language-service": "^12.1.2",
-    "@types/jasmine": "~2.8.6",
+    "@types/jasmine": "~3.6.0",
     "@types/jasminewd2": "~2.0.3",
-    "@types/node": "~8.9.4",
+    "@types/node": "^12.11.1",
-    "node-sass": "^4.0.0",
+    "codelyzer": "^6.0.0",
-    "codelyzer": "~4.2.1",
+    "jasmine-core": "~3.6.0",
-    "jasmine-core": "~2.99.1",
+    "jasmine-spec-reporter": "~5.0.0",
-    "jasmine-spec-reporter": "~4.2.1",
+    "karma": "~6.3.4",
-    "karma": "~4.0.0",
+    "karma-chrome-launcher": "~3.1.0",
-    "karma-chrome-launcher": "~2.2.0",
+    "karma-coverage-istanbul-reporter": "~3.0.2",
-    "karma-coverage-istanbul-reporter": "~2.0.0",
+    "karma-jasmine": "~4.0.0",
-    "karma-jasmine": "~1.1.1",
+    "karma-jasmine-html-reporter": "^1.5.0",
-    "karma-jasmine-html-reporter": "^0.2.2",
+    "protractor": "~7.0.0",
-    "protractor": "^5.4.1",
     "ts-node": "~5.0.1",
-    "tslint": "~5.9.1",
+    "tslint": "~6.1.0",
-    "typescript": "~2.7.2"
+    "typescript": "~4.3.5"
   }
 }

src/.browserslistrc

@@ -0,0 +1,9 @@
+# This file is currently used by autoprefixer to adjust CSS to support the below specified browsers
+# For additional information regarding the format and rule options, please see:
+# https://github.com/browserslist/browserslist#queries
+# For IE 9-11 support, please uncomment the last line of the file and adjust as needed
+> 0.5%
+last 2 versions
+Firefox ESR
+not dead
+# IE 9-11

src/app/app-routing.module.ts

@@ -33,13 +33,13 @@ const appRoutes: Routes = [
   },
   {
     path: 'repository',
-    loadChildren: './pages/repository/repository.module#RepositoryModule',
+    loadChildren: () => import('./pages/repository/repository.module').then(m => m.RepositoryModule),
     // loadChildren: () => import('./pages/repository/repository.module').then(m => m.RepositoryModule),
     canActivate: [AuthGuardService]
   },
   {
     path: 'repositoryAdmin',
-    loadChildren: './pages/repository/repository.module#RepositoryModule',
+    loadChildren: () => import('./pages/repository/repository.module').then(m => m.RepositoryModule),
     // loadChildren: () => import('./pages/repository/repository.module').then(m => m.RepositoryModule),
     canActivate: [AuthGuardService]
   },
@@ -52,16 +52,16 @@ const appRoutes: Routes = [
   // },
   {
     path: 'sources',
-    loadChildren: './pages/sources/sources.module#SourcesModule',
+    loadChildren: () => import('./pages/sources/sources.module').then(m => m.SourcesModule),
     canActivate: [AuthGuardService]
   },
   {
     path: 'compatibility',
-    loadChildren: './pages/compatibility/compatibility.module#CompatibilityModule'
+    loadChildren: () => import('./pages/compatibility/compatibility.module').then(m => m.CompatibilityModule)
   },
   {
     path: 'content',
-    loadChildren: './pages/content/content.module#ContentModule',
+    loadChildren: () => import('./pages/content/content.module').then(m => m.ContentModule),
     canActivate: [AuthGuardService]
   },
   // {
@@ -71,7 +71,7 @@ const appRoutes: Routes = [
   // },
   {
     path: 'admin',
-    loadChildren: './pages/adminPg/adminPg.module#AdminPgModule',
+    loadChildren: () => import('./pages/adminPg/adminPg.module').then(m => m.AdminPgModule),
   },
   {
     path: '403-forbidden',
@@ -92,7 +92,7 @@ const appRoutes: Routes = [
 
 
 @NgModule ({
-  imports: [RouterModule.forRoot(appRoutes)],
+  imports: [RouterModule.forRoot(appRoutes, { relativeLinkResolution: 'legacy' })],
   exports: [RouterModule]
 })
 

src/app/app.component.spec.ts

@@ -1,24 +1,24 @@
-import { TestBed, async } from '@angular/core/testing';
+import { TestBed, waitForAsync } from '@angular/core/testing';
 import { AppComponent } from './app.component';
 describe('AppComponent', () => {
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [
         AppComponent
       ],
     }).compileComponents();
   }));
-  it('should create the app', async(() => {
+  it('should create the app', waitForAsync(() => {
     const fixture = TestBed.createComponent(AppComponent);
     const app = fixture.debugElement.componentInstance;
     expect(app).toBeTruthy();
   }));
-  it(`should have as title 'app'`, async(() => {
+  it(`should have as title 'app'`, waitForAsync(() => {
     const fixture = TestBed.createComponent(AppComponent);
     const app = fixture.debugElement.componentInstance;
     expect(app.title).toEqual('app');
   }));
-  it('should render title in a h1 tag', async(() => {
+  it('should render title in a h1 tag', waitForAsync(() => {
     const fixture = TestBed.createComponent(AppComponent);
     fixture.detectChanges();
     const compiled = fixture.debugElement.nativeElement;

src/app/app.component.ts

@@ -2,7 +2,7 @@ import {Component, OnInit, ViewChild} from '@angular/core';
 import { NavigationEnd, Router, RoutesRecognized } from '@angular/router';
 import { AuthenticationService } from './services/authentication.service';
 import { environment } from '../environments/environment';
-import { MatomoInjector, MatomoTracker } from 'ngx-matomo';
+import { MatomoTracker } from 'ngx-matomo';
 import { ConfirmationDialogComponent } from './shared/reusablecomponents/confirmation-dialog.component';
 import { RepositoryService } from './services/repository.service';
 import { RepositorySnippet } from './domain/typeScriptClasses';
@@ -34,27 +34,12 @@ export class AppComponent implements OnInit {
 
   constructor(private router: Router,
               private authService: AuthenticationService,
-              private matomoInjector: MatomoInjector,
               private matomoTracker: MatomoTracker,
               private repositoryService: RepositoryService,
               private fb: FormBuilder) {
 
     console.log('21-06-2019. Fixed matomo to log userIds?');
 
-    let piwikUrl;
-    if (window.location.origin.includes('beta')) {
-      // piwikUrl = 'https://analytics.openaire.eu/piwik.php?idsite=92&rec=1';
-      piwikUrl = '92';
-    } else if (window.location.origin.includes('localhost:4200') ||
-               window.location.origin.includes('athenarc')) {
-      // piwikUrl = 'https://analytics.openaire.eu/piwik.php?idsite=92&rec=1';
-      piwikUrl = '9222222';
-    } else {
-      // piwikUrl = 'https://analytics.openaire.eu/piwik.php?idsite=111&rec=1';
-      piwikUrl = '111';
-    }
-    this.matomoInjector.init('https://analytics.openaire.eu/', piwikUrl);
-
     /*disabling console.log in production*/
     if ( environment.production === true ) {
       console.log = function () {};

src/app/app.module.ts

@@ -1,29 +1,30 @@
-import { AppComponent } from './app.component';
+import {AppComponent} from './app.component';
-import { NgModule } from '@angular/core';
+import {NgModule} from '@angular/core';
-import { BrowserModule } from '@angular/platform-browser';
+import {BrowserModule} from '@angular/platform-browser';
-import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import {NoopAnimationsModule} from '@angular/platform-browser/animations';
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import {FormsModule, ReactiveFormsModule} from '@angular/forms';
-import { HTTP_INTERCEPTORS, HttpClientModule } from '@angular/common/http';
+import {HTTP_INTERCEPTORS, HttpClientModule} from '@angular/common/http';
-import { ReusableComponentsModule } from './shared/reusablecomponents/reusable-components.module';
+import {ReusableComponentsModule} from './shared/reusablecomponents/reusable-components.module';
-import { CookieLawModule } from './shared/reusablecomponents/cookie-law/cookie-law.module';
+import {CookieLawModule} from './shared/reusablecomponents/cookie-law/cookie-law.module';
-import { AppRoutingModule } from './app-routing.module';
+import {AppRoutingModule} from './app-routing.module';
-import { AuthenticationInterceptor } from './services/authentication-interceptor';
+import {AuthenticationInterceptor} from './services/authentication-interceptor';
-import { BrokerService } from './services/broker.service';
+import {BrokerService} from './services/broker.service';
-import { MonitorService } from './services/monitor.service';
+import {MonitorService} from './services/monitor.service';
-import { PiwikService } from './services/piwik.service';
+import {PiwikService} from './services/piwik.service';
-import { RepositoryService } from './services/repository.service';
+import {RepositoryService} from './services/repository.service';
-import { ValidatorService } from './services/validator.service';
+import {ValidatorService} from './services/validator.service';
-import { UsagestatsService } from './services/usagestats.service';
+import {UsagestatsService} from './services/usagestats.service';
-import { StatisticsService } from './services/statistics.service';
+import {StatisticsService} from './services/statistics.service';
-import { AuthGuardService } from './services/auth-guard.service';
+import {AuthGuardService} from './services/auth-guard.service';
-import { AuthenticationService } from './services/authentication.service';
+import {AuthenticationService} from './services/authentication.service';
-import { HomeComponent } from './pages/landing/home/home.component';
+import {HomeComponent} from './pages/landing/home/home.component';
-import { MatomoModule } from 'ngx-matomo';
+import {MatomoModule} from 'ngx-matomo';
-import { DashboardService } from "./services/dashboard.service";
+import {DashboardService} from './services/dashboard.service';
-import { EmptyPageComponent } from "./pages/emptypage/empty-page.component";
+import {EmptyPageComponent} from './pages/emptypage/empty-page.component';
-import { SharedService } from "./services/shared.service";
+import {SharedService} from './services/shared.service';
-import { JoinComponent } from "./pages/join/join.component";
+import {JoinComponent} from './pages/join/join.component';
-import { AboutComponent } from "./pages/landing/about/about.component";
+import {AboutComponent} from './pages/landing/about/about.component';
+import {environment} from '../environments/environment';
 
 
 @NgModule({
@@ -42,7 +43,18 @@ import { AboutComponent } from "./pages/landing/about/about.component";
     HttpClientModule,
     ReusableComponentsModule,
     CookieLawModule,
-    MatomoModule,
+    MatomoModule.forRoot({
+      scriptUrl: environment.MATOMO_URL + 'matomo.js',
+      trackers: [
+        {
+          trackerUrl: environment.MATOMO_URL + 'matomo.php',
+          siteId: environment.MATOMO_SITE
+        }
+      ],
+      routeTracking: {
+        enable: true
+      }
+    }),
     AppRoutingModule
   ],
   providers: [
@@ -65,4 +77,5 @@ import { AboutComponent } from "./pages/landing/about/about.component";
   ],
   bootstrap: [AppComponent]
 })
-export class AppModule { }
+export class AppModule {
+}

src/app/pages/adminPg/adminPg-metrics.component.ts

@@ -15,7 +15,6 @@ import {RepositoryService} from '../../services/repository.service';
 import {ActivatedRoute, Router} from '@angular/router';
 import {PiwikInfoPage} from '../../domain/page-content';
 import {environment} from '../../../environments/environment';
-import {st} from '@angular/core/src/render3';
 
 @Component ({
   selector: 'app-admin-metrics',
@@ -44,7 +43,7 @@ export class AdminPgMetricsComponent implements OnInit {
 
   dataForm: FormGroup;
 
-  @ViewChild('confirmApprovalModal')
+  @ViewChild('confirmApprovalModal', { static: true })
   public confirmApprovalModal: ConfirmationDialogComponent;
   private pageTotal: number;
   private piwiksTotal: number;

src/app/pages/compatibility/compatibility-validate-type.component.ts

@@ -27,13 +27,13 @@ export class CompatibilityValidateTypeComponent implements OnInit {
    * the param that is used is 'step' and the values are: 'baseUrl','guidelines','crisEntities'/'parameters','finish'
    */
   currentStep: number;
-  @ViewChild('topHelperContent')
+  @ViewChild('topHelperContent', { static: true })
   public topHelperContent: HelpContentComponent;
-  @ViewChild('leftHelperContent')
+  @ViewChild('leftHelperContent', { static: true })
   public leftHelperContent: AsideHelpContentComponent;
-  @ViewChild('rightHelperContent')
+  @ViewChild('rightHelperContent', { static: true })
   public rightHelperContent: AsideHelpContentComponent;
-  @ViewChild('bottomHelperContent')
+  @ViewChild('bottomHelperContent', { static: true })
   public bottomHelperContent: HelpContentComponent;
 
   baseUrlList: string[] = [];

src/app/pages/compatibility/compatibility-validation-results.component.ts

@@ -7,7 +7,6 @@ import { loadingJobSummary, loadingJobSummaryError, noContentRulesResults,
 import { ConfirmationDialogComponent } from '../../shared/reusablecomponents/confirmation-dialog.component';
 import { AuthenticationService } from '../../services/authentication.service';
 import * as Highcharts from 'highcharts';
-import {text} from '@angular/core/src/render3/instructions';
 
 @Component({
   selector: 'app-compatibility-validation-results',
@@ -41,7 +40,7 @@ export class CompatibilityValidationResultsComponent implements OnInit {
   chartOptionsForContent: Highcharts.Options;
   chartOptionsForUsage: Highcharts.Options;
 
-  @ViewChild('checkErrors')
+  @ViewChild('checkErrors', { static: true })
   public checkErrors: ConfirmationDialogComponent;
 
   constructor (private route: ActivatedRoute,

src/app/pages/repository/events/content-events-of-repo-eventslist.component.ts

@@ -57,7 +57,7 @@ export class ContentEventsOfRepoEventslistComponent implements OnInit {
   modalErrorMessage: string;
 
   isModalShown: boolean;
-  @ViewChild('subscribeToEventsModal')
+  @ViewChild('subscribeToEventsModal', { static: true })
   public subscribeToEventsModal: ConfirmationDialogComponent;
 
   constructor (private route: ActivatedRoute,

src/app/pages/repository/metrics/metrics-enable.component.ts

@@ -29,7 +29,7 @@ export class MetricsEnableComponent implements OnInit {
   modalButton = 'Yes, enable it';
   isModalShown: boolean;
 
-  @ViewChild('confirmEnablingModal')
+  @ViewChild('confirmEnablingModal', { static: true })
   public confirmEnablingModal: ConfirmationDialogComponent;
 
 

src/app/pages/repository/repository-routing.module.ts

@@ -25,17 +25,17 @@ const repositoryRoutes: Routes = [
           },
           {
             path: 'getImpact',
-            loadChildren: './metrics/metrics.module#MetricsModule',
+            loadChildren: () => import('./metrics/metrics.module').then(m => m.MetricsModule),
             canActivate: [AuthGuardService]
           },
           {
             path: 'aggregationHistory',
-            loadChildren: './aggregationhistory/compatibility-monitor.module#AggregationHistoryModule',
+            loadChildren: () => import('./aggregationhistory/compatibility-monitor.module').then(m => m.AggregationHistoryModule),
             canActivate: [AuthGuardService]
           },
           {
             path: 'events',
-            loadChildren: './events/events.module#EventsModule',
+            loadChildren: () => import('./events/events.module').then(m => m.EventsModule),
             canActivate: [AuthGuardService]
           },
           {

src/app/pages/repository/update/sources-update-repo.component.ts

@@ -1,16 +1,16 @@
-import { Component, OnInit, QueryList, ViewChild, ViewChildren } from '@angular/core';
+import {Component, OnInit, QueryList, ViewChild, ViewChildren} from '@angular/core';
-import { FormBuilder, FormGroup } from '@angular/forms';
+import {FormBuilder, FormGroup} from '@angular/forms';
-import { Repository, RepositoryInterface } from '../../../domain/typeScriptClasses';
+import {Repository, RepositoryInterface} from '../../../domain/typeScriptClasses';
-import { RepositoryService } from '../../../services/repository.service';
+import {RepositoryService} from '../../../services/repository.service';
-import { ActivatedRoute, Router } from '@angular/router';
+import {ActivatedRoute, Router} from '@angular/router';
-import { formInfoLoading, loadingRepoError } from '../../../domain/shared-messages';
+import {loadingRepoError} from '../../../domain/shared-messages';
-import { DatasourceUpdateFormComponent } from '../../../shared/reusablecomponents/sources-forms/datasource-update-form.component';
+import {DatasourceUpdateFormComponent} from '../../../shared/reusablecomponents/sources-forms/datasource-update-form.component';
-import { ConfirmationDialogComponent } from '../../../shared/reusablecomponents/confirmation-dialog.component';
+import {ConfirmationDialogComponent} from '../../../shared/reusablecomponents/confirmation-dialog.component';
-import { AuthenticationService } from '../../../services/authentication.service';
+import {AuthenticationService} from '../../../services/authentication.service';
-import { DatasourceNewInterfaceFormComponent } from '../../../shared/reusablecomponents/sources-forms/datasource-new-interface-form.component';
+import {DatasourceNewInterfaceFormComponent} from '../../../shared/reusablecomponents/sources-forms/datasource-new-interface-form.component';
-import { SharedService } from '../../../services/shared.service';
+import {SharedService} from '../../../services/shared.service';
 
-@Component ({
+@Component({
   selector: 'sources-update-repo',
   templateUrl: 'sources-update-repo.component.html',
 })
@@ -32,21 +32,22 @@ export class SourcesUpdateRepoComponent implements OnInit {
   dataForInterfaceComp: any[] = [];
 
   isModalShown: boolean;
-  @ViewChild('updateLogoUrlModal')
+  @ViewChild('updateLogoUrlModal', {static: true})
   public updateLogoUrlModal: ConfirmationDialogComponent;
 
-  constructor ( private fb: FormBuilder,
+  constructor(private fb: FormBuilder,
-                private repoService: RepositoryService,
+              private repoService: RepositoryService,
-                private authService: AuthenticationService,
+              private authService: AuthenticationService,
-                private route: ActivatedRoute,
+              private route: ActivatedRoute,
-                private sharedService: SharedService,
+              private sharedService: SharedService,
-                private router: Router) { }
+              private router: Router) {
+  }
 
-  @ViewChild('updateTermsForm')
+  @ViewChild('updateTermsForm') updateTermsForm: DatasourceUpdateFormComponent;
 
   ngOnInit() {
 
-    if(this.sharedService.getRepository()) {
+    if (this.sharedService.getRepository()) {
       this.repo = this.sharedService.getRepository();
       this.logoURL = this.repo.logoUrl;
       this.getRepoInterfaces();
@@ -63,11 +64,11 @@ export class SourcesUpdateRepoComponent implements OnInit {
     );
 
     // this.readRepoId();
-    let body = document.getElementsByTagName('body')[0];
+    const body = document.getElementsByTagName('body')[0];
-    body.classList.remove("top_bar_active");   //remove the class
+    body.classList.remove('top_bar_active');   // remove the class
-    body.classList.remove("page_heading_active");
+    body.classList.remove('page_heading_active');
-    body.classList.remove("landing");
+    body.classList.remove('landing');
-    body.classList.add("dashboard");
+    body.classList.add('dashboard');
   }
 
   // readRepoId() {
@@ -100,7 +101,7 @@ export class SourcesUpdateRepoComponent implements OnInit {
     this.group = this.fb.group({});
     this.repoService.getRepositoryInterface(this.repo.id).subscribe(
       interfaces => {
-        this.repoInterfaces = interfaces.sort( function(a, b) {
+        this.repoInterfaces = interfaces.sort(function (a, b) {
           if (a.id < b.id) {
             return -1;
           } else if (a.id > b.id) {
@@ -130,7 +131,8 @@ export class SourcesUpdateRepoComponent implements OnInit {
       for (let i = 0; i < this.repoInterfaces.length; i++) {
         this.dataForInterfaceComp.push([
           false, i,
-          { id: this.repo.id,
+          {
+            id: this.repo.id,
             datasourceType: this.repo.datasourceType,
             datasourceClass: this.repo.datasourceClass,
             registeredBy: this.repo.registeredBy
@@ -141,7 +143,8 @@ export class SourcesUpdateRepoComponent implements OnInit {
     } else {
       this.dataForInterfaceComp.push([
         false, 0,
-        { id: this.repo.id,
+        {
+          id: this.repo.id,
           datasourceType: this.repo.datasourceType,
           datasourceClass: this.repo.datasourceClass,
           registeredBy: this.repo.registeredBy
@@ -152,8 +155,10 @@ export class SourcesUpdateRepoComponent implements OnInit {
 
   addInterfaceToList(intrf?: RepositoryInterface) {
     const curIndex = this.dataForInterfaceComp.length;
-    const curRepoInfo = { id: this.repo.id, datasourceType: this.repo.datasourceType,
+    const curRepoInfo = {
-      datasourceClass: this.repo.datasourceClass, registeredBy: this.repo.registeredBy };
+      id: this.repo.id, datasourceType: this.repo.datasourceType,
+      datasourceClass: this.repo.datasourceClass, registeredBy: this.repo.registeredBy
+    };
     if (intrf) {
       this.dataForInterfaceComp.push([false, curIndex, curRepoInfo, intrf]);
     } else {
@@ -193,7 +198,7 @@ export class SourcesUpdateRepoComponent implements OnInit {
 
   }
 
-  getNewLogoUrl( event: any ) {
+  getNewLogoUrl(event: any) {
     this.logoURL = event.target.value;
 
   }

src/app/pages/repository/update/update-repo-admins.component.html

@@ -75,7 +75,7 @@
 
 
 <confirmation-dialog #addRepositoryAdminModal [title]="'Add new datasource admin'" [isModalShown]="isAddModalShown"
-                     [confirmButNotCloseButton]="'Submit'" (emitObject)="addRepositoryAdmin($event)">
+                     [confirmButNotCloseButton]="'Submit'" (emitObject)="addRepositoryAdmin()">
 
   <div *ngIf="modalErrorMessage" class="uk-alert uk-alert-danger">{{modalErrorMessage}}</div>
 

src/app/pages/repository/update/update-repo-admins.component.ts

@@ -24,11 +24,11 @@ export class UpdateRepoAdminsComponent implements OnChanges {
   selectedAdminForDelete: User;
 
   isDeleteModalShown: boolean;
-  @ViewChild('deleteRepositoryAdminModal')
+  @ViewChild('deleteRepositoryAdminModal', { static: true })
   public deleteRepositoryAdminModal: ConfirmationDialogComponent;
 
   isAddModalShown: boolean;
-  @ViewChild('addRepositoryAdminModal')
+  @ViewChild('addRepositoryAdminModal', { static: true })
   public addRepositoryAdminModal: ConfirmationDialogComponent;
 
   modalErrorMessage: string;

src/app/pages/sources/sources-register/register-existing-datasource.component.ts

@@ -42,22 +42,22 @@ export class RegisterExistingDatasourceComponent implements OnInit {
    * currentStep represents the number of the current step
    */
   currentStep: number;
-  @ViewChild('topHelperContent')
+  @ViewChild('topHelperContent', { static: true })
   public topHelperContent: HelpContentComponent;
-  @ViewChild('leftHelperContent')
+  @ViewChild('leftHelperContent', { static: true })
   public leftHelperContent: AsideHelpContentComponent;
-  @ViewChild('rightHelperContent')
+  @ViewChild('rightHelperContent', { static: true })
   public rightHelperContent: AsideHelpContentComponent;
-  @ViewChild('bottomHelperContent')
+  @ViewChild('bottomHelperContent', { static: true })
   public bottomHelperContent: HelpContentComponent;
 
   @ViewChild('datasourcesByCountry')
   public datasourcesByCountry: RegisterDatasourceSelectExistingComponent;
 
-  @ViewChild ('registerDatasource')
+  @ViewChild('registerDatasource')
   registerDatasource: DatasourceUpdateFormComponent;
 
-  @ViewChild ('interfaceComments')
+  @ViewChild('interfaceComments')
   interfaceComments: DatasourceNewInterfaceFormComponent;
 
   @ViewChildren('interfacesArray') interfacesArray: QueryList<DatasourceNewInterfaceFormComponent>;

src/app/pages/sources/sources-register/register-new-datasource.component.ts

@@ -30,19 +30,19 @@ export class RegisterNewDatasourceComponent implements OnInit {
    * currentStep represents the number of the current step
    */
   currentStep: number;
-  @ViewChild('topHelperContent')
+  @ViewChild('topHelperContent', { static: true })
   public topHelperContent: HelpContentComponent;
-  @ViewChild('leftHelperContent')
+  @ViewChild('leftHelperContent', { static: true })
   public leftHelperContent: AsideHelpContentComponent;
-  @ViewChild('rightHelperContent')
+  @ViewChild('rightHelperContent', { static: true })
   public rightHelperContent: AsideHelpContentComponent;
-  @ViewChild('bottomHelperContent')
+  @ViewChild('bottomHelperContent', { static: true })
   public bottomHelperContent: HelpContentComponent;
 
-  @ViewChild ('registerDatasource')
+  @ViewChild('registerDatasource')
   registerDatasource: DatasourceCreateFormComponent;
 
-  @ViewChild ('interfaceComments')
+  @ViewChild('interfaceComments')
   interfaceComments: DatasourceNewInterfaceFormComponent;
 
   @ViewChildren('interfacesArray') interfacesArray: QueryList<DatasourceNewInterfaceFormComponent>;

src/app/services/shared.service.ts

@@ -1,6 +1,6 @@
-import { Injectable } from "@angular/core";
+import {Injectable} from '@angular/core';
-import { Repository, RepositorySnippet } from "../domain/typeScriptClasses";
+import {Repository, RepositorySnippet} from '../domain/typeScriptClasses';
-import { Subject } from "rxjs/internal/Subject";
+import {Subject} from 'rxjs/internal/Subject';
 
 @Injectable()
 export class SharedService {
@@ -12,7 +12,6 @@ export class SharedService {
   private repositoriesOfUser: Subject<RepositorySnippet[]> = new Subject<RepositorySnippet[]>();
 
 
-
   get repository$() {
     return this.repository.asObservable();
   }
@@ -21,7 +20,7 @@ export class SharedService {
     return this.repositoryCopy;
   }
 
-  setRepository(data:Repository) {
+  setRepository(data: Repository) {
     this.repository.next(data);
     this.repositoryCopy = data;
   }

src/app/shared/reusablecomponents/forms/my-array.interface.ts

@@ -44,7 +44,7 @@ export class MyArray extends MyGroup {
 
   @Input() public initEmpty: boolean = false;
 
-  @ViewChild(MyFormDirective) protected formComponents: MyFormDirective;
+  @ViewChild(MyFormDirective, { static: true }) protected formComponents: MyFormDirective;
 
   protected _cfr: ComponentFactoryResolver;
 

src/app/shared/reusablecomponents/forms/my-wrapper.interface.ts

@@ -1,12 +1,13 @@
 /**
  * Created by stefanos on 19/5/2017.
  */
-import { EventEmitter, Input, OnInit, Output, ViewChild, ViewRef } from '@angular/core';
+import { EventEmitter, Input, OnInit, Output, ViewChild, ViewRef, Directive } from '@angular/core';
 import { Description } from '../../../domain/oa-description';
 import { MyFormDirective } from './my-form.directive';
 import { throwError } from 'rxjs';
 
 
+@Directive()
 export abstract class MyWrapper implements OnInit{
 
   @Input() public component: ViewRef;
@@ -17,7 +18,7 @@ export abstract class MyWrapper implements OnInit{
 
   @Output() deleteNotifier: EventEmitter<ViewRef> = new EventEmitter();
 
-  @ViewChild(MyFormDirective) private formComponents: MyFormDirective;
+  @ViewChild(MyFormDirective, { static: true }) private formComponents: MyFormDirective;
 
   public first = true;
 

src/app/shared/reusablecomponents/read-more.component.ts

@@ -22,7 +22,7 @@ export class ReadMoreComponent implements AfterContentInit {
     //@Input() text: string;
     //maximum height of the container
     @Input("maxHeight") maxHeight: number = 100;
-    @ViewChild("readMoreDiv")
+    @ViewChild("readMoreDiv", { static: true })
     readMoreDiv: ElementRef;
     //set these to false to get the height of the expended container
     public isCollapsed: boolean = false;

src/assets/css/landingpage/custom.css

@@ -14,13 +14,13 @@
 @import url('https://fonts.googleapis.com/css?family=Sura:400,700');
 
 body.landing {
-  padding-top: 0px;
+  padding-top: 0;
 }
 
 /* yard */
 .tm-page {
- border-width:0px!important;
+ border-width:0!important;
- border:0px!important;
+ border:0!important;
 }
 body { font-family: 'Open Sans', sans-serif !important;}
 /*
@@ -71,7 +71,7 @@ font-weight: 400!important;
 
 }
 .news .wk-panel-box, .news .wk-panel-header {
-padding :20px 0px 30px 0px;
+padding :20px 0 30px 0;
 margin-bottom:40px;
 }
 /*
@@ -94,7 +94,7 @@ margin-bottom:40px;
 .wk-twitter-firstpage .wk-article-meta{
 	font-size:12px!important;
 	line-height:16px;
-	margin:0px;
+	margin:0;
 
 }
 .wk-twitter-firstpage .wk-margin {
@@ -164,7 +164,7 @@ font-weight:300;
 .service-button > .wk-subnav>li>a,
 .boxedpills > .uk-subnav>li>a {
 	border: 1px solid #9c9c9c!important;
-	border-radius: 0px!important;
+	border-radius: 0!important;
 	color: #9c9c9c!important;
 
 }
@@ -204,11 +204,11 @@ font-weight:300;
    background: #fff;
     /* border: 1px solid #e5e5e5; */
     border: none!important;
-    border-radius: 0px;
+    border-radius: 0;
     background: #fff;
     color: #767779;
     color: rgb(108, 109, 116);
-    box-shadow: rgba(0, 0, 0, 0.08) 0px 5px 15px;
+    box-shadow: rgba(0, 0, 0, 0.08) 0 5px 15px;
     background: rgb(255, 255, 255)!important;
 }
 
@@ -325,8 +325,8 @@ background-color:#222080;}
 .tm-toolbar {
 position:relative;
 color: #fff;
-padding-top: 0px;
+padding-top: 0;
-padding-bottom:0px;
+padding-bottom:0;
 background:rgba(255,255,255, 0.0);
 z-index:10000;
 /*background: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,0)), url(/images/toolbar_bg.png);*/
@@ -345,19 +345,19 @@ background:rgba(255,255,255, 0.4);
 }
 .uk-logo > img {max-height:80px;}
 .inner {
- left:0px;
+ left:0;
   margin-top:-5px;
   background-color: #222080;
 }
 .tm-toolbar .uk-container {
-padding-right:0px;
+padding-right:0;
 }
 
 .tm-toolbar ul.uk-subnav.uk-subnav-line,
 .tm-toolbar ul.uk-subnav{
  margin-top:-10px;
  margin-top: -5px; /* no border on top */
- padding:10px 10px  0px 0px;
+ padding:10px 10px  0 0;
   -ms-transform: skew(25deg);
   -webkit-transform: skew(25deg);
   transform: skew(25deg);
@@ -390,7 +390,7 @@ padding-right:0px;
 .uk-subnav-line > :nth-child(n + 2):before,
 .tm-toolbar .uk-subnav > :nth-child(n + 2):before {
     margin-right: 10px;
-    border-left: 0px ;
+    border-left: 0 ;
 }
 
 .tm-toolbar .uk-subnav-line li  a,
@@ -432,7 +432,7 @@ li.home-hover
 }
 
 .tm-toolbar .uk-dotnav, .tm-toolbar .uk-subnav {
-  margin-bottom:0px!important;
+  margin-bottom:0!important;
 }
 
 .tm-toolbar .uk-subnav-line li a:hover,
@@ -461,13 +461,13 @@ li.home-hover
   white-space: nowrap;
   /*white-space:pre-wrap;*/
   text-align:center;
-  -moz-border-radius: 0px;
+  -moz-border-radius: 0;
-  -webkit-border-radius: 0px;
+  -webkit-border-radius: 0;
-  border-radius: 0px;
+  border-radius: 0;
   background:  #fff;
-  -moz-box-shadow: 0px 0px 1px #666;
+  -moz-box-shadow: 0 0 1px #666;
-  -webkit-box-shadow: 0px 0px 1px #666;
+  -webkit-box-shadow: 0 0 1px #666;
-  box-shadow: 0px 0px 1px #666;
+  box-shadow: 0 0 1px #666;
 }
 
 .tm-toolbar .uk-subnav a[title]:hover:before{
@@ -747,13 +747,13 @@ color: #17106E;
 .uk-section-secondary:not(.uk-preserve-color) .uk-navbar-nav > li > a:focus,
 .uk-section-secondary:not(.uk-preserve-color) .uk-navbar-nav > li > a.uk-open,
 .uk-card-primary.uk-card-body .uk-navbar-nav > li:hover > a, .uk-card-primary.uk-card-body .uk-navbar-nav > li > a:focus,
-.uk-card-primary.uk-card-body .uk-navbar-nav > li > a.uk-open, .uk-card-primary > :not([class * ='uk-card-media']) .uk-navbar-nav > li:hover > a,
+.uk-card-primary.uk-card-body .uk-navbar-nav > li > a.uk-open, .uk-card-primary > :not([class *='uk-card-media']) .uk-navbar-nav > li:hover > a,
-.uk-card-primary > :not([class * ='uk-card-media']) .uk-navbar-nav > li > a:focus,
+.uk-card-primary > :not([class *='uk-card-media']) .uk-navbar-nav > li > a:focus,
-.uk-card-primary > :not([class * ='uk-card-media']) .uk-navbar-nav > li > a.uk-open,
+.uk-card-primary > :not([class *='uk-card-media']) .uk-navbar-nav > li > a.uk-open,
 .uk-card-secondary.uk-card-body .uk-navbar-nav > li:hover > a, .uk-card-secondary.uk-card-body .uk-navbar-nav > li > a:focus,
-.uk-card-secondary.uk-card-body .uk-navbar-nav > li > a.uk-open, .uk-card-secondary > :not([class * ='uk-card-media']) .uk-navbar-nav > li:hover > a,
+.uk-card-secondary.uk-card-body .uk-navbar-nav > li > a.uk-open, .uk-card-secondary > :not([class *='uk-card-media']) .uk-navbar-nav > li:hover > a,
-.uk-card-secondary > :not([class * ='uk-card-media']) .uk-navbar-nav > li > a:focus,
+.uk-card-secondary > :not([class *='uk-card-media']) .uk-navbar-nav > li > a:focus,
-.uk-card-secondary > :not([class * ='uk-card-media']) .uk-navbar-nav > li > a.uk-open,
+.uk-card-secondary > :not([class *='uk-card-media']) .uk-navbar-nav > li > a.uk-open,
 .uk-overlay-primary .uk-navbar-nav > li:hover > a, .uk-overlay-primary .uk-navbar-nav > li > a:focus,
 .uk-overlay-primary .uk-navbar-nav > li > a.uk-open, .uk-navbar-container:not(.uk-navbar-transparent) .uk-navbar-nav > li:hover > a,
 .uk-navbar-container:not(.uk-navbar-transparent) .uk-navbar-nav > li > a:focus,
@@ -805,7 +805,7 @@ color: #17106E;
  color: #63BDE9!important;
 }
 */
-*/
+
 /*
 .uk-tile-primary {background-color: #17106E;}
 */
@@ -913,7 +913,7 @@ transform: translateY(-50%);
   color:#fff;
 }
 .first_page_panel {
-  border: 0px solid #e5e5e7!important;
+  border: 0 solid #e5e5e7!important;
  padding:20px 20px!important;
 /*width:100%!important;*/
   font-size:24pt!important;
@@ -997,8 +997,8 @@ border-top: 1px solid #6c6c6c;
 	border-bottom: 1px solid #c5c5c5;
 }
 .mod_events_latest_table td p{
-	margin-bottom:0px;
+	margin-bottom:0;
-	margin-top:0px;
+	margin-top:0;
 }
 
 .mod_events_latest_date {
@@ -1013,7 +1013,7 @@ border-top: 1px solid #6c6c6c;
 	margin-right:8px;
 	margin-top:5px;
 	text-align:center;
-	padding:10px 0px;
+	padding:10px 0;
 	line-height:20px;
 	*/
 	color: #4687E6;
@@ -1031,7 +1031,7 @@ border-top: 1px solid #6c6c6c;
 	line-height:14px;
 	font-weight:400;
 	font-size:12px;
-	padding: 5px 0px;
+	padding: 5px 0;
 	margin-bottom: 8px;
 	text-transform:none;
 	*/
@@ -1094,7 +1094,7 @@ font-family: 'Heebo', sans-serif;
 	font-size:13px!important;
 	line-height: 18px;
 	font-weight:normal!important;
-	margin-top: 0px;
+	margin-top: 0;
 	margin-bottom: 8px;
 }
 .nspArt  { border-bottom: 1px solid #c5c5c5;}
@@ -1112,7 +1112,7 @@ font-family: 'Heebo', sans-serif;
 .nspLinks ul li p {
 	text-transform:none;
 	font-size: 14px;
-	margin:0px;
+	margin:0;
 }
 .readon-button{
 background:0!important;
@@ -1203,16 +1203,16 @@ color: rgba(255, 255, 255, 0.5)!important;
 #btl .btl-panel > span .btl-dropdown { border:3!important;}
 
 #btl .btl-panel > span{
-	border: 0px!important;
+	border: 0!important;
 	background-color: transparent!important;
 	color:#444!important;
 	padding-right:30px;
 	padding-left:6px;
-	height:0px!important;
+	height:0!important;
 	line-height:20px!important;
-	margin:0px !important;
+	margin:0 !important;
-	box-shadow: 0px 0px 0px;
+	box-shadow: 0 0 0;
-	border-radius:0px!important;
+	border-radius:0!important;
 	display: inline-table!important;
 	text-transform:none!important;
 	font-size: 14px;
@@ -1250,12 +1250,12 @@ border-bottom-left-radius: 2px;
 border-bottom-right-radius: 2px;
 border-top-left-radius: 2px;
 border-top-right-radius: 2px;
-box-shadow: rgba(41, 44, 61, 0.0980392) 2px 15px 50px 0px;
+box-shadow: rgba(41, 44, 61, 0.0980392) 2px 15px 50px 0;
 box-sizing: border-box;
 color: rgb(79, 82, 96);
 display: none;
 height: auto;
-margin-top: 0px;
+margin-top: 0;
 padding-bottom: 25px;
 padding-left: 25px;
 padding-right: 25px;
@@ -1285,8 +1285,8 @@ list-style-image: none;
 list-style-position: outside;
 list-style-type: none;
 padding-bottom: 6px;
-padding-left: 0px;
+padding-left: 0;
-padding-right: 0px;
+padding-right: 0;
 padding-top: 6px;
 text-align: left;
 text-decoration: none;
@@ -1433,7 +1433,7 @@ color: #2D72D6;
 box-shadow:none;
 	border: 1px solid #eee;
 
-	padding:0px 30px 15px 30px;
+	padding:0 30px 15px 30px;
 
 	background: #fff;
 color: #767779;
@@ -1442,7 +1442,7 @@ box-shadow: 0 6px 50px rgba(0,0,0,.05);
 }
 
 .ifaq-tpl-clean_blue_arrow .ifaq-collapsible > a {
-display: block; padding: 1px 0 1px 0px;
+display: block; padding: 1px 0 1px 0;
 background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2213%22%20height%3D%2213%22%20viewBox%3D%220%200%2013%2013%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Crect%20fill%3D%22%236C6D74%22%20width%3D%2213%22%20height%3D%221%22%20x%3D%220%22%20y%3D%226%22%3E%3C%2Frect%3E%0A%20%20%20%20%3Crect%20fill%3D%22%236C6D74%22%20width%3D%221%22%20height%3D%2213%22%20x%3D%226%22%20y%3D%220%22%3E%3C%2Frect%3E%0A%3C%2Fsvg%3E");
 background-repeat: no-repeat;
 background-position: 98% 50%;

src/environments/environment.beta.ts

@@ -1,5 +1,7 @@
 export const environment = {
   production: true,
+  MATOMO_URL: 'https://analytics.openaire.eu/',
+  MATOMO_SITE: 92,
   API_ENDPOINT: '/api',
   FAQ_ENDPOINT: 'https://provide.openaire.eu/uoa-admin-tools/api',
   FAQ_HOMEPAGE: 'https://provide.openaire.eu/uoa-admin-tools/dashboard'

src/environments/environment.prod.ts

@@ -1,5 +1,7 @@
 export const environment = {
   production: true,
+  MATOMO_URL: 'https://analytics.openaire.eu/',
+  MATOMO_SITE: 111,
   API_ENDPOINT: '/api',
   FAQ_ENDPOINT: '/uoa-admin-tools/api',
   FAQ_HOMEPAGE: '/uoa-admin-tools/dashboard'

src/environments/environment.ts

@@ -5,6 +5,8 @@
 export const environment = {
   production: false,
   API_ENDPOINT: '/uoa-repository-manager-service',
+  MATOMO_URL: 'https://analytics.openaire.eu/',
+  MATOMO_SITE: 9222222,
   // FAQ_ENDPOINT: 'http://88.197.53.69:5555/api',
   // FAQ_HOMEPAGE: 'http://88.197.53.69:5555'
   FAQ_ENDPOINT: 'https://provide.openaire.eu/uoa-admin-tools/api',
@@ -17,4 +19,4 @@ export const environment = {
  * import the following file, but please comment it out in production mode
  * because it will have performance impact when throw error
  */
-// import 'zone.js/dist/zone-error';  // Included with Angular CLI.
+// import 'zone.js/plugins/zone-error';  // Included with Angular CLI.

src/polyfills.ts

@@ -11,68 +11,51 @@
  * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera),
  * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile.
  *
- * Learn more in https://angular.io/docs/ts/latest/guide/browser-support.html
+ * Learn more in https://angular.io/guide/browser-support
  */
 
 /***************************************************************************************************
  * BROWSER POLYFILLS
  */
 
-/** IE9, IE10 and IE11 requires all of the following polyfills. **/
-import 'core-js/es6/symbol';
-import 'core-js/es6/object';
-import 'core-js/es6/function';
-import 'core-js/es6/parse-int';
-import 'core-js/es6/parse-float';
-import 'core-js/es6/number';
-import 'core-js/es6/math';
-import 'core-js/es6/string';
-import 'core-js/es6/date';
-import 'core-js/es6/array';
-import 'core-js/es6/regexp';
-import 'core-js/es6/map';
-import 'core-js/es6/weak-map';
-import 'core-js/es6/set';
-
 /** IE10 and IE11 requires the following for NgClass support on SVG elements */
 // import 'classlist.js';  // Run `npm install --save classlist.js`.
 
-/** IE10 and IE11 requires the following for the Reflect API. */
-import 'core-js/es6/reflect';
-
-
-/** Evergreen browsers require these. **/
-// Used for reflect-metadata in JIT. If you use AOT (and only Angular decorators), you can remove.
-import 'core-js/es7/reflect';
-
-
 /**
  * Web Animations `@angular/platform-browser/animations`
  * Only required if AnimationBuilder is used within the application and using IE/Edge or Safari.
  * Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0).
- **/
+ */
 // import 'web-animations-js';  // Run `npm install --save web-animations-js`.
 
 /**
  * By default, zone.js will patch all possible macroTask and DomEvents
  * user can disable parts of macroTask/DomEvents patch by setting following flags
+ * because those flags need to be set before `zone.js` being loaded, and webpack
+ * will put import in the top of bundle, so user need to create a separate file
+ * in this directory (for example: zone-flags.ts), and put the following flags
+ * into that file, and then add the following code before importing zone.js.
+ * import './zone-flags.ts';
+ *
+ * The flags allowed in zone-flags.ts are listed here.
+ *
+ * The following flags will work for all browsers.
+ *
+ * (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
+ * (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
+ * (window as any).__zone_symbol__UNPATCHED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
+ *
+ *  in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
+ *  with the following flag, it will bypass `zone.js` patch for IE/Edge
+ *
+ *  (window as any).__Zone_enable_cross_context_check = true;
+ *
  */
 
- // (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
- // (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
- // (window as any).__zone_symbol__BLACK_LISTED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
-
- /*
- * in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
- * with the following flag, it will bypass `zone.js` patch for IE/Edge
- */
-// (window as any).__Zone_enable_cross_context_check = true;
-
 /***************************************************************************************************
  * Zone JS is required by default for Angular itself.
  */
-import 'zone.js/dist/zone';  // Included with Angular CLI.
+import 'zone.js';  // Included with Angular CLI.
-
 
 
 /***************************************************************************************************

src/test.ts

@@ -1,6 +1,6 @@
 // This file is required by karma.conf.js and loads recursively all the .spec and framework files
 
-import 'zone.js/dist/zone-testing';
+import 'zone.js/testing';
 import { getTestBed } from '@angular/core/testing';
 import {
   BrowserDynamicTestingModule,

src/tsconfig.app.json

@@ -2,12 +2,13 @@
   "extends": "../tsconfig.json",
   "compilerOptions": {
     "outDir": "../out-tsc/app",
-//    "module": "es2015",
-    "module": "esnext",
     "types": []
   },
-  "exclude": [
+  "files": [
-    "src/test.ts",
+    "main.ts",
-    "**/*.spec.ts"
+    "polyfills.ts"
+  ],
+  "include": [
+    "src/**/*.d.ts"
   ]
 }

src/tsconfig.spec.json

@@ -2,7 +2,6 @@
   "extends": "../tsconfig.json",
   "compilerOptions": {
     "outDir": "../out-tsc/spec",
-    "module": "commonjs",
     "types": [
       "jasmine",
       "node"

tsconfig.json

@@ -2,13 +2,14 @@
   "compileOnSave": false,
   "compilerOptions": {
     "baseUrl": "./",
+    "downlevelIteration": true,
+    "module": "es2020",
     "outDir": "./dist/out-tsc",
     "sourceMap": true,
     "declaration": false,
     "moduleResolution": "node",
-    "emitDecoratorMetadata": true,
     "experimentalDecorators": true,
-    "target": "es5",
+    "target": "es2015",
     "typeRoots": [
       "node_modules/@types"
     ],

tslint.json

@@ -72,7 +72,6 @@
     "no-trailing-whitespace": true,
     "no-unnecessary-initializer": true,
     "no-unused-expression": true,
-    "no-use-before-declare": true,
     "no-var-keyword": true,
     "object-literal-sort-keys": false,
     "one-line": [
@@ -117,12 +116,12 @@
       "check-type"
     ],
     "no-output-on-prefix": true,
-    "use-input-property-decorator": true,
+    "no-inputs-metadata-property": true,
-    "use-output-property-decorator": true,
+    "no-outputs-metadata-property": true,
-    "use-host-property-decorator": true,
+    "no-host-metadata-property": true,
     "no-input-rename": true,
     "no-output-rename": true,
-    "use-life-cycle-interface": true,
+    "use-lifecycle-interface": true,
     "use-pipe-transform-interface": true,
     "component-class-suffix": true,
     "directive-class-suffix": true