Dealing with Asynchronous operations (promise)

Test case for service calls with promise - way 1

Author: dynamicbalaji

src/app/2-todos/todos.component.spec.ts

@@ -26,7 +26,8 @@ describe('TodosComponent', () => {
     component = fixture.componentInstance;
   });
 
-  it('should load todos from the server', () => {
+  // Test case for service calls with Observable
+  xit('should load todos from the server - Observable', () => {
     // If TodoService is given as provider in module
     let service = TestBed.get(TodoService);
     // If TodoService is given as provider in component
@@ -37,4 +38,16 @@ describe('TodosComponent', () => {
 
     expect(component.todos.length).toBe(3);
   });
+
+  // Test case for service calls with Promise - Way 1
+  it('should load todos from the server - Promise - Way 1', async(() => {
+    let service = TestBed.get(TodoService);
+    spyOn(service, 'getTodosPromise').and.returnValue(Promise.resolve( [1,2,3] ));
+    
+    fixture.detectChanges();
+
+    fixture.whenStable().then(() => {
+      expect(component.todos.length).toBe(3);
+    });
+  }));
 });

src/app/2-todos/todos.component.ts

@@ -13,7 +13,8 @@ export class TodosComponent implements OnInit {
   constructor(private service: TodoService) {}
 
   ngOnInit() { 
-    this.service.getTodos().subscribe(t => this.todos = t);
+    //this.service.getTodos().subscribe(t => this.todos = t);
+    this.service.getTodosPromise().then(t => this.todos = t);
   }
 
   add() {