service test

Author: macrisguncay

src/app/components/options-sidebar/project-management/project-management.component.spec.ts

@@ -1,11 +1,15 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { async, ComponentFixture, TestBed, inject } from '@angular/core/testing';
 
 import { ProjectManagementComponent } from './project-management.component';
 import { Project } from '../../../interfaces/project';
+import { ProjectService } from '../../../services/project.service';
+import { of } from 'rxjs';
 
 describe('ProjectManagementComponent', () => {
   let component: ProjectManagementComponent;
   let fixture: ComponentFixture<ProjectManagementComponent>;
+  let projectService: ProjectService;
+
   const projects: Project[] = [{
     id: 1,
     name: 'app 1',
@@ -29,9 +33,17 @@ describe('ProjectManagementComponent', () => {
   }
   ];
 
+  const projectServiceStub = {
+    getProjects() {
+      const projectsMock = projects;
+      return of(projectsMock);
+    }
+  };
+
   beforeEach(async(() => {
     TestBed.configureTestingModule({
-      declarations: [ ProjectManagementComponent ]
+      declarations: [ ProjectManagementComponent ],
+      providers: [ { provide: ProjectService, useValue: projectServiceStub }]
     })
     .compileComponents();
   }));
@@ -40,9 +52,18 @@ describe('ProjectManagementComponent', () => {
     fixture = TestBed.createComponent(ProjectManagementComponent);
     component = fixture.componentInstance;
     fixture.detectChanges();
+
+    projectService = TestBed.inject(ProjectService);
     component.projects = projects;
   });
 
+
+  it('Service injected via inject(...) and TestBed.get(...) should be the same instance',
+    inject([ProjectService], (injectService: ProjectService) => {
+      expect(injectService).toBe(projectService);
+    })
+  );
+
   it('should create', () => {
     expect(component).toBeTruthy();
   });
@@ -97,4 +118,34 @@ describe('ProjectManagementComponent', () => {
     component.cancelForm();
     expect(component.project).toBe(null);
   });
+
+  it('should call getProjects method on init', () => {
+    const preojectServiceSpy = spyOn(projectService, 'getProjects').and.callThrough();
+    const componentSpy = spyOn(component, 'getProjects').and.callThrough();
+
+    expect(preojectServiceSpy).not.toHaveBeenCalled();
+    expect(componentSpy).not.toHaveBeenCalled();
+
+    component.ngOnInit();
+
+    expect(preojectServiceSpy).toHaveBeenCalledTimes(1);
+    expect(componentSpy).toHaveBeenCalledTimes(1);
+  });
+
+
+  it('should call getProjects and return a list of projects', async(() => {
+
+    spyOn(projectService, 'getProjects').and.returnValue(of(projects));
+
+    component.ngOnInit();
+
+    expect(component.projects).toEqual(projects);
+  }));
+
+  it('should delete a project #deleteProject', () => {
+    const projectId = 1;
+
+    component.deleteProject(projectId);
+    expect(component.projects.length).toEqual(2);
+  });
 });

src/app/components/options-sidebar/project-management/project-management.component.ts

@@ -16,7 +16,6 @@ export class ProjectManagementComponent implements OnInit {
   projects: Project[] = [];
 
   constructor(private projectService: ProjectService) {
-    this.getProjects();
   }
 
   ngOnInit(): void {

src/app/services/project.service.spec.ts

@@ -1,16 +1,23 @@
-import { TestBed } from '@angular/core/testing';
+import { TestBed, inject, async } from '@angular/core/testing';
+import { HttpClientTestingModule } from '@angular/common/http/testing';
 
 import { ProjectService } from './project.service';
 
 describe('ProjectService', () => {
   let service: ProjectService;
 
   beforeEach(() => {
-    TestBed.configureTestingModule({});
+    TestBed.configureTestingModule({
+      imports: [HttpClientTestingModule]
+    });
     service = TestBed.inject(ProjectService);
   });
 
-  it('should be created', () => {
-    expect(service).toBeTruthy();
-  });
+
+  it('should create', inject([HttpClientTestingModule, ProjectService],
+    (httpClient: HttpClientTestingModule, apiService: ProjectService) => {
+      expect(apiService).toBeTruthy();
+      expect(httpClient).toBeTruthy();
+  }));
+
 });

src/app/services/project.service.ts

@@ -1,10 +1,7 @@
 import { Injectable } from '@angular/core';
 import { Project } from '../interfaces/project';
 import { HttpClient } from '@angular/common/http';
-import { Observable, of } from 'rxjs';
-import { map, filter } from 'rxjs/operators';
-
-
+import { Observable } from 'rxjs';
 
 @Injectable({
   providedIn: 'root'
@@ -19,11 +16,4 @@ export class ProjectService {
   getProjects(): Observable<Project[]> {
     return this.http.get<Project[]>(this.url);
   }
-
-  // getProject(projectId): Observable<Project> {
-  //   return this.http.get<Project>(this.url).pipe(
-  //     filter((project: Project) => project.id === projectId)[0]
-  //   );
-  // }
-
 }