3 files changed, 12 insertions, 11 deletions
diff --git a/Timeline/ClientApp/src/app/todo-list-page/todo-list-page.component.spec.ts b/Timeline/ClientApp/src/app/todo-list-page/todo-list-page.component.spec.ts
index 7fc4164d..e01e91fb 100644
--- a/Timeline/ClientApp/src/app/todo-list-page/todo-list-page.component.spec.ts
+++ b/Timeline/ClientApp/src/app/todo-list-page/todo-list-page.component.spec.ts
@@ -1,5 +1,5 @@
 import { Component, NO_ERRORS_SCHEMA } from '@angular/core';
-import { async, ComponentFixture, TestBed, tick } from '@angular/core/testing';
+import { async, ComponentFixture, TestBed, fakeAsync, tick } from '@angular/core/testing';
 
 import { defer, Observable } from 'rxjs';
 
@@ -8,7 +8,8 @@ import { TodoListService, WorkItem } from './todo-list.service';
 import { By } from '@angular/platform-browser';
 
 @Component({
-  selector: 'mat-progress-bar',
+/* tslint:disable-next-line:component-selector*/
+selector: 'mat-progress-bar',
   template: ''
 })
 class MatProgressBarStubComponent {
@@ -45,21 +46,22 @@ describe('TodoListPageComponent', () => {
   beforeEach(() => {
     fixture = TestBed.createComponent(TodoListPageComponent);
     component = fixture.componentInstance;
-    fixture.detectChanges();
   });
 
   it('should create', () => {
+    fixture.detectChanges();
     expect(component).toBeTruthy();
   });
 
   it('should show progress bar during loading', () => {
+    fixture.detectChanges();
     expect(fixture.debugElement.query(By.css('mat-progress-bar'))).toBeTruthy();
   });
 
-  it('should hide progress bar after loading', async(() => {
-    fixture.whenStable().then(() => {
-      fixture.detectChanges();
-      expect(fixture.debugElement.query(By.css('mat-progress-bar'))).toBeFalsy();
-    });
+  it('should hide progress bar after loading', fakeAsync(() => {
+    fixture.detectChanges();
+    tick();
+    fixture.detectChanges();
+    expect(fixture.debugElement.query(By.css('mat-progress-bar'))).toBeFalsy();
   }));
 });
diff --git a/Timeline/ClientApp/src/app/todo-list-page/todo-list-page.component.ts b/Timeline/ClientApp/src/app/todo-list-page/todo-list-page.component.ts
index 8af1f5ef..06f49923 100644
--- a/Timeline/ClientApp/src/app/todo-list-page/todo-list-page.component.ts
+++ b/Timeline/ClientApp/src/app/todo-list-page/todo-list-page.component.ts
@@ -11,10 +11,9 @@ export class TodoListPageComponent implements OnInit {
   items: WorkItem[];
 
   constructor(private todoService: TodoListService) {
-    todoService.getWorkItemList().subscribe(result => this.items = result);
   }
 
   ngOnInit() {
+    this.todoService.getWorkItemList().subscribe(result => this.items = result);
   }
-
 }
diff --git a/Timeline/ClientApp/src/test.ts b/Timeline/ClientApp/src/test.ts
index 2513deed..688add40 100644
--- a/Timeline/ClientApp/src/test.ts
+++ b/Timeline/ClientApp/src/test.ts
@@ -1,7 +1,7 @@
 // This file is required by karma.conf.js and loads recursively all the .spec and framework files
 
-import 'zone.js/dist/zone-patch-rxjs-fake-async';
 import 'zone.js/dist/zone-testing';
+import 'zone.js/dist/zone-patch-rxjs-fake-async';
 
 import { getTestBed } from '@angular/core/testing';
 import {