Use fakeAsync instead of async.

1 files changed, 8 insertions, 7 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..7623d7aa 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';
 
@@ -45,21 +45,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();
   }));
 });