diff --git a/src/app/components/options-sidebar/project-management/project-management.component.spec.ts b/src/app/components/options-sidebar/project-management/project-management.component.spec.ts index 99d961944..1674699b8 100644 --- a/src/app/components/options-sidebar/project-management/project-management.component.spec.ts +++ b/src/app/components/options-sidebar/project-management/project-management.component.spec.ts @@ -1,9 +1,11 @@ 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'; +import { CreateProjectComponent } from '../../../components/shared/create-project/create-project.component'; +import { ProjectListComponent } from '../../../components/shared/project-list/project-list.component'; +import { FormsModule, ReactiveFormsModule } from '@angular/forms'; describe('ProjectManagementComponent', () => { let component: ProjectManagementComponent; @@ -42,8 +44,12 @@ describe('ProjectManagementComponent', () => { beforeEach(async(() => { TestBed.configureTestingModule({ - declarations: [ ProjectManagementComponent ], - providers: [ { provide: ProjectService, useValue: projectServiceStub }] + declarations: [ ProjectManagementComponent, CreateProjectComponent, ProjectListComponent ], + providers: [ { provide: ProjectService, useValue: projectServiceStub }], + imports: [ + FormsModule, + ReactiveFormsModule + ] }) .compileComponents(); })); diff --git a/src/app/components/options-sidebar/project-management/project-management.component.ts b/src/app/components/options-sidebar/project-management/project-management.component.ts index b3404d6a3..f11ec63fb 100644 --- a/src/app/components/options-sidebar/project-management/project-management.component.ts +++ b/src/app/components/options-sidebar/project-management/project-management.component.ts @@ -35,7 +35,6 @@ export class ProjectManagementComponent implements OnInit { }; this.projects = this.projects.concat(newProject); } - console.log(this.projects); } editProject(projectId) { diff --git a/src/app/components/shared/create-project/create-project.component.spec.ts b/src/app/components/shared/create-project/create-project.component.spec.ts index 538ae7b73..3141b587c 100644 --- a/src/app/components/shared/create-project/create-project.component.spec.ts +++ b/src/app/components/shared/create-project/create-project.component.spec.ts @@ -2,6 +2,7 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing'; import { CreateProjectComponent } from './create-project.component'; import { Validators, FormBuilder } from '@angular/forms'; +import { FormsModule, ReactiveFormsModule } from '@angular/forms'; describe('CreateProjectComponent', () => { let component: CreateProjectComponent; @@ -10,9 +11,10 @@ describe('CreateProjectComponent', () => { beforeEach(async(() => { TestBed.configureTestingModule({ declarations: [ CreateProjectComponent ], - providers: [ - FormBuilder - ], + imports: [ + FormsModule, + ReactiveFormsModule + ] }) .compileComponents(); })); @@ -26,4 +28,74 @@ describe('CreateProjectComponent', () => { it('should create', () => { expect(component).toBeTruthy(); }); + + it('should send the form data on onSubmit buton #onSubmit', () => { + const project = { + name: 'app 4', + details: 'It is a good app', + status: 'inactive', + completed: true + }; + + spyOn(component.savedProject, 'emit'); + component.onSubmit(project); + expect(component.savedProject.emit).toHaveBeenCalled(); + }); + + it('should clean the form and send a cancelForm event #reset', () => { + const project = { + name: 'app 4', + details: 'It is a good app', + status: 'inactive', + completed: true + }; + + component.projectForm.setValue(project); + spyOn(component.cancelForm, 'emit'); + component.reset(); + expect(component.projectForm.value.name).toEqual(null); + expect(component.projectForm.value.details).toEqual(null); + expect(component.projectForm.value.status).toEqual(null); + expect(component.projectForm.value.completed).toEqual(null); + + expect(component.cancelForm.emit).toHaveBeenCalled(); + }); + + it('form invalid when empty', () => { + expect(component.projectForm.valid).toBeFalsy(); + }); + + it('name field validity', () => { + const name = component.projectForm.controls.name; + expect(name.valid).toBeFalsy(); + + name.setValue(''); + expect(name.hasError('required')).toBeTruthy(); + + name.setValue('A'); + expect(name.hasError('required')).toBeFalsy(); + }); + + it('details field validity', () => { + const details = component.projectForm.controls.details; + expect(details.valid).toBeFalsy(); + + details.setValue(''); + expect(details.hasError('required')).toBeTruthy(); + + details.setValue('A'); + expect(details.hasError('required')).toBeFalsy(); + }); + + it('status field validity', () => { + const status = component.projectForm.controls.status; + expect(status.valid).toBeFalsy(); + + status.setValue(''); + expect(status.hasError('required')).toBeTruthy(); + + status.setValue('A'); + expect(status.hasError('required')).toBeFalsy(); + }); + }); diff --git a/src/app/components/shared/modal/modal.component.spec.ts b/src/app/components/shared/modal/modal.component.spec.ts index fc32a90f0..986c9587b 100644 --- a/src/app/components/shared/modal/modal.component.spec.ts +++ b/src/app/components/shared/modal/modal.component.spec.ts @@ -22,4 +22,22 @@ describe('ModalComponent', () => { it('should create', () => { expect(component).toBeTruthy(); }); + + it('should emit removeProject event #removedProject', () => { + const project = { + id: 1, + name: 'app 4', + details: 'It is a good app', + status: 'inactive', + completed: true + }; + + spyOn(component.removeProject, 'emit'); + component.project = project; + fixture.detectChanges(); + component.removedProject(project.id); + expect(component.removeProject.emit).toHaveBeenCalled(); + component.cancelDeleteModal.nativeElement.click(); + }); }); + diff --git a/src/app/components/shared/project-list/project-list.component.spec.ts b/src/app/components/shared/project-list/project-list.component.spec.ts index 6bdebcedd..438257e77 100644 --- a/src/app/components/shared/project-list/project-list.component.spec.ts +++ b/src/app/components/shared/project-list/project-list.component.spec.ts @@ -22,4 +22,37 @@ describe('ProjectListComponent', () => { it('should create', () => { expect(component).toBeTruthy(); }); + + it('should emit deleteProject event #removeProject', () => { + const project = { + id: 1, + name: 'app 4', + details: 'It is a good app', + status: 'inactive', + completed: true + }; + + component.projectToDelete = project; + spyOn(component.deleteProject, 'emit'); + component.removeProject(project.id); + expect(component.deleteProject.emit).toHaveBeenCalled(); + expect(component.projectToDelete).toBe(null); + }); + + it('should open delete modal #openModal', () => { + const project = { + id: 1, + name: 'app 4', + details: 'It is a good app', + status: 'inactive', + completed: true + }; + + component.openModal(project); + expect(component.projectToDelete.id).toBe(1); + expect(component.projectToDelete.name).toBe('app 4'); + expect(component.projectToDelete.details).toBe('It is a good app'); + expect(component.projectToDelete.status).toBe('inactive'); + expect(component.projectToDelete.completed).toBe(true); + }); }); diff --git a/src/app/services/project.service.spec.ts b/src/app/services/project.service.spec.ts index 856ff3780..3648b5b41 100644 --- a/src/app/services/project.service.spec.ts +++ b/src/app/services/project.service.spec.ts @@ -1,18 +1,46 @@ import { TestBed, inject, async } from '@angular/core/testing'; -import { HttpClientTestingModule } from '@angular/common/http/testing'; - +import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing'; +import { Project } from '../interfaces/project'; import { ProjectService } from './project.service'; describe('ProjectService', () => { let service: ProjectService; + let httpMock: HttpTestingController; + + const projects: Project[] = [{ + id: 1, + name: 'app 1', + details: 'It is a good app', + status: 'inactive', + completed: true + }, + { + id: 2, + name: 'app 2', + details: 'It is a good app', + status: 'inactive', + completed: false + }, + { + id: 3, + name: 'app 3', + details: 'It is a good app', + status: 'active', + completed: true + } + ]; beforeEach(() => { TestBed.configureTestingModule({ imports: [HttpClientTestingModule] }); service = TestBed.inject(ProjectService); + httpMock = TestBed.inject(HttpTestingController); }); + afterEach (() => { + httpMock.verify (); + }); it('should create', inject([HttpClientTestingModule, ProjectService], (httpClient: HttpClientTestingModule, apiService: ProjectService) => { @@ -20,4 +48,14 @@ describe('ProjectService', () => { expect(httpClient).toBeTruthy(); })); + it('should get projects API/GET #getProjects', () => { + service.getProjects().subscribe(projects => { + expect(projects.length).toBe(3); + expect(projects).toEqual(projects); + }); + const request = httpMock.expectOne('assets/project.json'); + expect(request.request.method).toBe('GET'); + request.flush(projects); + }); + });