Use SchedulerService for all setTimeout/setInterval calls

SchedulerService provides more convenient way of running these async
callbacks and internally implements setInterval, setTimeout functions
to run outside of angular zone. This is required for protractor tests.

Also SchedulerService provides easier testability and maintainability.

Author: klinki

ui/src/main/webapp/src/app/configuration/rules-modal.component.ts

@@ -1,19 +1,32 @@
-import {Component, Input, AfterViewInit} from "@angular/core";
+import {Component, Input, AfterViewInit, NgZone, OnDestroy} from "@angular/core";
 import * as $ from "jquery";
 import {RuleProviderEntity} from "../generated/windup-services";
+import {SchedulerService} from "../shared/scheduler.service";
 
 declare function prettyPrint();
 
 @Component({
     selector: 'wu-rules-modal',
     templateUrl: 'rules-modal.component.html'
 })
-export class RulesModalComponent {
+export class RulesModalComponent implements OnDestroy {
     @Input()
     ruleProviderEntity: RuleProviderEntity = <RuleProviderEntity>{};
 
+    prettyPrintTimeout: any;
+
+    public constructor(private _schedulerService: SchedulerService, private _zone: NgZone) {
+    }
+
+    ngOnDestroy(): void {
+        if (this.prettyPrintTimeout) {
+            this._schedulerService.clearTimeout(this.prettyPrintTimeout);
+            this.prettyPrintTimeout = null;
+        }
+    }
+
     show(): void {
         (<any>$('#rulesModal')).modal();
-        setTimeout(() => prettyPrint(), 1000);
+        this.prettyPrintTimeout = this._schedulerService.setTimeout(() => prettyPrint(), 1000);
     }
 }

ui/src/main/webapp/src/app/executions/execution-detail.component.ts

@@ -1,4 +1,4 @@
-import {Component, OnDestroy, OnInit} from "@angular/core";
+import {Component, NgZone, OnDestroy, OnInit} from "@angular/core";
 import {ActivatedRoute, Router} from "@angular/router";
 import {WindupService} from "../services/windup.service";
 import {WindupExecution, RegisteredApplication} from "../generated/windup-services";
@@ -12,6 +12,7 @@ import {RuleProviderExecutionsService} from "./rule-provider-executions/rule-pro
 import {ExecutionPhaseModel} from "../generated/tsModels/ExecutionPhaseModel";
 import {RoutedComponent} from "../shared/routed.component";
 import {RouteFlattenerService} from "../core/routing/route-flattener.service";
+import {SchedulerService} from "../shared/scheduler.service";
 
 @Component({
     templateUrl: './execution-detail.component.html',
@@ -33,7 +34,9 @@ export class ExecutionDetailComponent extends RoutedComponent implements OnInit,
         _routeFlattener: RouteFlattenerService,
         private _eventBus: EventBusService,
         private _windupService: WindupService,
-        private _ruleProviderExecutionsService: RuleProviderExecutionsService
+        private _ruleProviderExecutionsService: RuleProviderExecutionsService,
+        private _schedulerService: SchedulerService,
+        private _zone: NgZone
     ) {
         super(_router, _activatedRoute, _routeFlattener);
     }
@@ -60,16 +63,17 @@ export class ExecutionDetailComponent extends RoutedComponent implements OnInit,
             });
         }));
 
-        this.currentTimeTimer = <any> setInterval(() => {
+        this.currentTimeTimer = this._schedulerService.setInterval(this._zone.run(() => {
             this.currentTime = new Date().getTime();
             console.log("Updating the current time field");
-        }, 5000);
+        }), 5000);
     }
 
     ngOnDestroy(): void {
         super.ngOnDestroy();
-        if (this.currentTimeTimer != null)
-            clearInterval(this.currentTimeTimer);
+        if (this.currentTimeTimer != null) {
+            this._schedulerService.clearInterval(this.currentTimeTimer);
+        }
     }
 
     get loglines(): Observable<string[]> {

ui/src/main/webapp/src/app/executions/executions-list.component.ts

@@ -1,4 +1,4 @@
-import {Component, ElementRef, EventEmitter, Input, OnDestroy, OnInit, Output, ViewChild} from "@angular/core";
+import {Component, ElementRef, EventEmitter, Input, NgZone, OnDestroy, OnInit, Output, ViewChild} from "@angular/core";
 import {WindupService} from "../services/windup.service";
 import {MigrationProject, WindupExecution} from "../generated/windup-services";
 import {NotificationService} from "../core/notification/notification.service";
@@ -8,6 +8,7 @@ import {MigrationProjectService} from "../project/migration-project.service";
 import {WindupExecutionService} from "../services/windup-execution.service";
 import {ConfirmationModalComponent} from "../shared/dialog/confirmation-modal.component";
 import {AbstractComponent} from "../shared/AbstractComponent";
+import {SchedulerService} from "../shared/scheduler.service";
 
 @Component({
     selector: 'wu-executions-list',
@@ -53,7 +54,9 @@ export class ExecutionsListComponent extends AbstractComponent implements OnInit
         private _windupService: WindupService,
         private _notificationService: NotificationService,
         private _sortingService: SortingService<WindupExecution>,
-        private _projectService: MigrationProjectService
+        private _projectService: MigrationProjectService,
+        private _schedulerService: SchedulerService,
+        private _zone: NgZone
     ) {
         super();
         this.element = _elementRef.nativeElement;
@@ -72,14 +75,17 @@ export class ExecutionsListComponent extends AbstractComponent implements OnInit
             this.doDeleteExecution(execution);
         });
 
-        this.currentTimeTimer = <any> setInterval(() => {
-            this.currentTime = new Date().getTime();
+        this.currentTimeTimer =  this._schedulerService.setInterval(() => {
+            this._zone.run(() => {
+                this.currentTime = new Date().getTime();
+            });
         }, 5000);
     }
 
     ngOnDestroy(): void {
-        if (this.currentTimeTimer)
-            clearInterval(this.currentTimeTimer);
+        if (this.currentTimeTimer) {
+            this._schedulerService.clearInterval(this.currentTimeTimer);
+        }
     }
 
     @Input()

ui/src/main/webapp/src/app/executions/project-executions.component.ts

@@ -1,4 +1,4 @@
-import {Component, OnInit} from "@angular/core";
+import {Component, NgZone, OnDestroy, OnInit} from "@angular/core";
 import {AnalysisContext, MigrationProject, WindupExecution} from "../generated/windup-services";
 import {RegisteredApplication} from "../generated/windup-services";
 import {ActivatedRoute} from "@angular/router";
@@ -10,24 +10,28 @@ import {ExecutionEvent} from "../core/events/windup-event";
 import {AnalysisContextService} from "../analysis-context/analysis-context.service";
 import {NotificationService} from "../core/notification/notification.service";
 import {utils} from "../shared/utils";
+import {SchedulerService} from "../shared/scheduler.service";
 
 @Component({
     templateUrl: './project-executions.component.html'
 })
-export class ProjectExecutionsComponent extends ExecutionsMonitoringComponent implements OnInit {
+export class ProjectExecutionsComponent extends ExecutionsMonitoringComponent implements OnInit, OnDestroy {
     executions: WindupExecution[];
     private doNotRefreshList: boolean;
     private analysisContext: AnalysisContext;
 
     protected showRunAnalysisButton: boolean;
+    protected refreshTimeout: any;
 
     constructor(
         private _activatedRoute: ActivatedRoute,
         _windupExecutionService: WindupExecutionService,
         private _eventBus: EventBusService,
         private _windupService: WindupService,
         private _analysisContextService: AnalysisContextService,
-        private _notificationService: NotificationService
+        private _notificationService: NotificationService,
+        private _schedulerService: SchedulerService,
+        private _ngZone: NgZone
     ) {
         super(_windupExecutionService);
     }
@@ -56,13 +60,23 @@ export class ProjectExecutionsComponent extends ExecutionsMonitoringComponent im
         this.doNotRefreshList = false;
     }
 
+    ngOnDestroy(): void {
+        super.ngOnDestroy();
+
+        if (this.refreshTimeout) {
+            this._schedulerService.clearTimeout(this.refreshTimeout);
+            this.refreshTimeout = null;
+        }
+    }
+
     refreshExecutionList() {
         this._windupService.getProjectExecutions(this.project.id).subscribe(executions => {
             this.executions = executions;
 
             // If there are cancelled jobs that have not yet had a cancelled date added, then refresh the list
-            if (this.executions.find(execution => execution.state == "CANCELLED" && execution.timeCompleted == null) != null)
-                setTimeout(() => this.refreshExecutionList(), 1000);
+            if (this.executions.find(execution => execution.state == "CANCELLED" && execution.timeCompleted == null) != null) {
+                this.refreshTimeout = this._schedulerService.setTimeout(this._ngZone.run(() => this.refreshExecutionList()), 1000);
+            }
 
             this.loadActiveExecutions(this.executions);
         });

ui/src/main/webapp/src/app/reports/migration-issues/migration-issues-table.component.ts

@@ -1,4 +1,4 @@
-import {ChangeDetectionStrategy, Component, Input, OnInit} from "@angular/core";
+import {ChangeDetectionStrategy, Component, Input, NgZone, OnInit} from "@angular/core";
 import {Router, ActivatedRoute} from "@angular/router";
 import "../source/prism";
 
@@ -7,6 +7,7 @@ import {NotificationService} from "../../core/notification/notification.service"
 import {SortingService, OrderDirection} from "../../shared/sort/sorting.service";
 import {RouteFlattenerService} from "../../core/routing/route-flattener.service";
 import {FilterableReportComponent} from "../filterable-report.component";
+import {SchedulerService} from "../../shared/scheduler.service";
 
 @Component({
     selector: 'wu-migration-issues-table',
@@ -32,7 +33,8 @@ export class MigrationIssuesTableComponent extends FilterableReportComponent imp
         _activatedRoute: ActivatedRoute,
         private _migrationIssuesService: MigrationIssuesService,
         private _notificationService: NotificationService,
-        private _sortingService: SortingService<ProblemSummary>
+        private _sortingService: SortingService<ProblemSummary>,
+        private _schedulerService: SchedulerService
     ) {
         super(_router, _activatedRoute, _routeFlattener);
     }
@@ -76,7 +78,7 @@ export class MigrationIssuesTableComponent extends FilterableReportComponent imp
 
     private delayedPrismRender() {
         // Colorize the included code snippets on the first displaying.
-        setTimeout(() => Prism.highlightAll(false), 1000);
+        this._schedulerService.setTimeout(() => Prism.highlightAll(false), 1000);
     }
 
     toggleFiles(summary: ProblemSummary) {

ui/src/main/webapp/src/app/reports/migration-issues/problem-summary-files.component.ts

@@ -1,17 +1,18 @@
-import {Component, Input, OnInit} from "@angular/core";
+import {Component, Input, NgZone, OnDestroy, OnInit} from "@angular/core";
 import {FileModel} from "../../generated/tsModels/FileModel";
 import {ActivatedRoute, Router} from "@angular/router";
 import {GraphJSONToModelService} from "../../services/graph/graph-json-to-model.service";
 import {PaginationService} from "../../shared/pagination.service";
 
 import * as showdown from "showdown";
+import {SchedulerService} from "../../shared/scheduler.service";
 
 @Component({
     selector: 'wu-problem-summary-files',
     templateUrl: './problem-summary-files.component.html',
     styleUrls: ['./problem-summary-files.component.scss']
 })
-export class ProblemSummaryFilesComponent implements OnInit {
+export class ProblemSummaryFilesComponent implements OnInit, OnDestroy {
     _problemSummaryFiles: any[];
 
     @Input()
@@ -29,11 +30,14 @@ export class ProblemSummaryFilesComponent implements OnInit {
 
     private markdownCache: Map<string, string> = new Map<string, string>();
 
+    private renderTimeout;
+
     public constructor(
         private _router: Router,
         private _activatedRoute: ActivatedRoute,
         private _graphJsonToModelService: GraphJSONToModelService<any>,
-        private _paginationService: PaginationService
+        private _paginationService: PaginationService,
+        private _schedulerService: SchedulerService
     ) {
     }
 
@@ -52,6 +56,13 @@ export class ProblemSummaryFilesComponent implements OnInit {
         this.parseExecutedRulesPath();
     }
 
+    ngOnDestroy(): void {
+        if (this.renderTimeout) {
+            this._schedulerService.clearTimeout(this.renderTimeout);
+            this.renderTimeout = null;
+        }
+    }
+
     protected parseExecutedRulesPath() {
         let currentUrl = this._activatedRoute.snapshot.pathFromRoot.reduce<string>((accumulator, item) => {
             let currentPart = item.url.reduce((acc, itm) => {
@@ -86,7 +97,7 @@ export class ProblemSummaryFilesComponent implements OnInit {
     private delayedPrismRender() {
         const timeout = 60 * 1000;
         // Colorize the included code snippets on the first displaying.
-        setTimeout(() => Prism.highlightAll(false), timeout);
+        this.renderTimeout = this._schedulerService.setTimeout(() => Prism.highlightAll(false), timeout);
     }
 
     renderMarkdownToHtml(markdownCode: string): string {

ui/src/main/webapp/src/app/shared/js-tree-angular-wrapper.component.ts

@@ -1,10 +1,11 @@
 import {
     Component, OnInit, Input, ElementRef, SimpleChange, Output, EventEmitter, NgZone,
-    OnChanges
+    OnChanges, OnDestroy
 } from "@angular/core";
 import {Package} from "../generated/windup-services";
 import * as $ from "jquery";
 import 'jstree';
+import {SchedulerService} from "./scheduler.service";
 
 /**
  * Wrapper for jstree from: https://www.jstree.com/
@@ -14,7 +15,7 @@ import 'jstree';
     selector: 'wu-js-tree-wrapper',
     host: { 'style': 'display: block; overflow: auto;' }
 })
-export class JsTreeAngularWrapperComponent implements OnInit, OnChanges {
+export class JsTreeAngularWrapperComponent implements OnInit, OnChanges, OnDestroy {
     @Input()
     treeNodes: TreeData[];
 
@@ -39,7 +40,9 @@ export class JsTreeAngularWrapperComponent implements OnInit, OnChanges {
     protected updateSelectionCallback: Function = () => {};
     protected static EMPTY_CALLBACK = () => {};
 
-    public constructor(element: ElementRef, private _zone: NgZone) {
+    protected treeRedrawTimeout: any;
+
+    public constructor(element: ElementRef, private _zone: NgZone, private _schedulerService: SchedulerService) {
         this.element = element.nativeElement;
     }
 
@@ -60,7 +63,7 @@ export class JsTreeAngularWrapperComponent implements OnInit, OnChanges {
 
             if (changes.hasOwnProperty('selectedNodes')) {
                 // Another ugly workaround, now to give enough time to initialize jsTree first
-                setTimeout(() => this.redrawSelection(), 100);
+                this._schedulerService.setTimeout(this._zone.run(() => this.redrawSelection()), 100);
             }
         }
 
@@ -121,6 +124,13 @@ export class JsTreeAngularWrapperComponent implements OnInit, OnChanges {
         $(this.element).on('changed.jstree loaded.jstree', (event, data) => this.redrawSelection());
     }
 
+    ngOnDestroy(): void {
+        if (this.treeRedrawTimeout) {
+            this._schedulerService.clearTimeout(this.treeRedrawTimeout);
+            this.treeRedrawTimeout = null;
+        }
+    }
+
     fireNodeClicked(event, data) {
         this.nodeClicked.emit(this.treeNodesMap[data.node.id]);
     }

ui/src/main/webapp/src/app/shared/notification.component.ts

@@ -1,7 +1,8 @@
-import {Component, OnDestroy, OnInit, Input} from "@angular/core";
+import {Component, OnDestroy, OnInit, Input, NgZone} from "@angular/core";
 import {NotificationService} from "../core/notification/notification.service";
 import {Subscription} from "rxjs/Subscription";
 import {Notification, NotificationLevel} from "../core/notification/notification";
+import {SchedulerService} from "./scheduler.service";
 
 @Component({
     selector: 'wu-notification',
@@ -21,7 +22,13 @@ export class NotificationComponent implements OnInit, OnDestroy {
 
     notificationsStack: Notification[] = [];
 
-    constructor(private _notificationService: NotificationService) {
+    protected closeTimeoutHandle: any;
+
+    constructor(
+        private _notificationService: NotificationService,
+        private _schedulerService: SchedulerService,
+        private _zone: NgZone
+    ) {
 
     }
 
@@ -37,7 +44,10 @@ export class NotificationComponent implements OnInit, OnDestroy {
         this.notificationsStack.push(notification);
 
         if (this.autoCloseNotifications) {
-            setTimeout(() => this.closeNotification(notification), this.closeTimeout * 1000);
+            this.closeTimeoutHandle = this._schedulerService.setTimeout(
+                this._zone.run(() => this.closeNotification(notification)),
+                this.closeTimeout * 1000
+            );
         }
     }
 
@@ -92,5 +102,10 @@ export class NotificationComponent implements OnInit, OnDestroy {
 
     ngOnDestroy(): any {
         this.subscription.unsubscribe();
+
+        if (this.closeTimeoutHandle) {
+            this._schedulerService.clearTimeout(this.closeTimeoutHandle);
+            this.closeTimeoutHandle = null;
+        }
     }
 }