From 7783f02f58fc65078727a13f236e8aee19207383 Mon Sep 17 00:00:00 2001 From: kburk1997 Date: Tue, 17 Apr 2018 16:46:04 -0400 Subject: [PATCH 1/3] get department querying working --- .../department-list.component.html | 12 +- .../department-list.component.spec.ts | 220 +++++++++++++++++- .../department-list.component.ts | 40 +++- 3 files changed, 262 insertions(+), 10 deletions(-) diff --git a/yacs-admin-angular/src/app/department/department-list/department-list.component.html b/yacs-admin-angular/src/app/department/department-list/department-list.component.html index 62366d6..90948cd 100644 --- a/yacs-admin-angular/src/app/department/department-list/department-list.component.html +++ b/yacs-admin-angular/src/app/department/department-list/department-list.component.html @@ -26,8 +26,8 @@

New Department

-
-

All Departments

+
+

All Departments

Departments in the {{selectedSchool.name}}

New Department

- +
@@ -61,3 +61,9 @@

New Department

ID
+ +
+

An error occured!

+

The school you queried for does not exist.

+ +
diff --git a/yacs-admin-angular/src/app/department/department-list/department-list.component.spec.ts b/yacs-admin-angular/src/app/department/department-list/department-list.component.spec.ts index 5434ee8..86926ea 100644 --- a/yacs-admin-angular/src/app/department/department-list/department-list.component.spec.ts +++ b/yacs-admin-angular/src/app/department/department-list/department-list.component.spec.ts @@ -8,15 +8,181 @@ import {InMemoryDataService} from '../../services/in-memory-data.service'; import {HttpClientInMemoryWebApiModule} from 'angular-in-memory-web-api'; import {RouterTestingModule} from '@angular/router/testing'; import {YacsService} from '../../services/yacs.service'; -describe('DepartmentListComponent', () => { +import {ActivatedRoute} from '@angular/router'; +import {Observable} from 'rxjs/Rx'; +describe('DepartmentListComponent, no params', () => { let component: DepartmentListComponent; let fixture: ComponentFixture; + let mockParams = [{}]; + beforeEach(async(() => { + TestBed.configureTestingModule({ + imports: [FormsModule, HttpClientModule, HttpClientInMemoryWebApiModule.forRoot(InMemoryDataService, {passThruUnknownUrl: true}), RouterTestingModule], + declarations: [ DepartmentListComponent, DepartmentDetailComponent ], + providers: [{provide: YacsService, useClass: FakeYacsService}, + {provide: ActivatedRoute, useValue: + {'queryParams': Observable.from(mockParams)} + } + ] + }) + .compileComponents(); + })); + + beforeEach(() => { + + fixture = TestBed.createComponent(DepartmentListComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + spyOn(component, 'getDepts'); + spyOn(component, 'getSchools'); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); + it('should display a header titled \'All Departments\'',() => { + var header=document.getElementsByTagName('h2')[0]; + expect(header.textContent).toMatch('All Departments'); + }); + it('renders header', () => { + var header = document.getElementsByClassName("table"); + var ths = header[0].getElementsByTagName("th"); + expect(ths[0].textContent).toContain('ID'); + expect(ths[1].textContent).toContain('Code'); + expect(ths[2].textContent).toContain('Name'); + }); + + it('calls getDepts()', async()=>{ + tick(); + expect(component.getDepts).toHaveBeenCalled(); + }); + + it('renders deparment', async() => { + //making sure we can access component departments + //console.log(component.departments); + + //write the actual tests here + var tbody = document.getElementsByTagName("tbody"); + var rows = tbody[0].getElementsByTagName('tr'); + //console.log(tbody[0].getElementsByTagName('tr')); + + for (var i = 0; i { + + + it('should not display the form', () => { + expect(document.getElementById('newDept')).toBeNull(); + }); + + it('should display \'New Department\'',() => { + expect(document.getElementsByClassName('new-object-link')[0]).toBeTruthy(); + }); + }); + describe('after clicking \'New Department\'', () => { + beforeEach(async()=>{ + const newDeptBtn=document.getElementById('newDeptBtn'); + newDeptBtn.click(); + fixture.detectChanges(); + fixture.whenStable().then(() => { + fixture.detectChanges(); + }); + + }); + + beforeEach(()=>{ + fixture.detectChanges(); + fixture.whenStable().then(() => { + fixture.detectChanges(); + }); + }); + + it('should set creatingDept to true', async() => { + tick(); + expect(component.creatingDept).toEqual(true); + }); + it('should render the form', async() => { + tick(); + expect(document.getElementById('newDept')).toBeTruthy(); + //expect(component.selectedDept).toEqual(expectedDept); + }); + + describe('when \'Cancel\' is pressed', () => { + beforeEach(async()=>{ + const cancelBtn=document.getElementById('cancelBtn'); + cancelBtn.click(); + fixture.detectChanges(); + fixture.whenStable().then(() => { + fixture.detectChanges(); + }); + }); + + beforeEach(()=>{ + spyOn(component, 'cancelNewDept').and.callThrough(); + fixture.detectChanges(); + fixture.whenStable().then(() => { + fixture.detectChanges(); + }); + }); + + /*This spec is pending until we can replace + * this dialog with a Bootstrap modal.*/ + + xit('displays the dialog', async()=>{ + tick(); + expect(component.cancelNewDept).toHaveBeenCalled(); + }); + +}); + + describe('When \'Create Department\' is pressed', () => { + beforeEach(async()=>{ + const createBtn=document.getElementById('createBtn'); + createBtn.click(); + }); + + beforeEach(()=>{ + spyOn(component,'createDept'); + }); + + it('should call createDept', async()=>{ + tick(); + expect(component.createDept).toHaveBeenCalled(); + }); + }); + + }); + + +}); + +describe('DepartmentListComponent, valid school id passed', () => { + let component: DepartmentListComponent; + let fixture: ComponentFixture; + let mockParams = [{'school_id':3}]; beforeEach(async(() => { TestBed.configureTestingModule({ imports: [FormsModule, HttpClientModule, HttpClientInMemoryWebApiModule.forRoot(InMemoryDataService, {passThruUnknownUrl: true}), RouterTestingModule], declarations: [ DepartmentListComponent, DepartmentDetailComponent ], - providers: [{provide: YacsService, useClass: FakeYacsService}] + providers: [{provide: YacsService, useClass: FakeYacsService}, + {provide: ActivatedRoute, useValue: + {'queryParams': Observable.from(mockParams)} + } + ] }) .compileComponents(); })); @@ -41,7 +207,11 @@ describe('DepartmentListComponent', () => { expect(ths[1].textContent).toContain('Code'); expect(ths[2].textContent).toContain('Name'); }); - + it('should render header with school name', async() => { + var header=document.getElementsByTagName('h2')[0]; + var pattern = 'Departments in the '+component.selectedSchool.name; + expect(header.textContent).toMatch(pattern); + }); it('calls getDepts()', async()=>{ tick(); expect(component.getDepts).toHaveBeenCalled(); @@ -160,3 +330,47 @@ describe('DepartmentListComponent', () => { }); + + +describe('DepartmentListComponent, invalid school id passed', () => { + let component: DepartmentListComponent; + let fixture: ComponentFixture; + let mockParams = [{'school_id':42069}]; + beforeEach(async(() => { + TestBed.configureTestingModule({ + imports: [FormsModule, HttpClientModule, HttpClientInMemoryWebApiModule.forRoot(InMemoryDataService, {passThruUnknownUrl: true}), RouterTestingModule], + declarations: [ DepartmentListComponent, DepartmentDetailComponent ], + providers: [{provide: YacsService, useClass: FakeYacsService}, + {provide: ActivatedRoute, useValue: + {'queryParams': Observable.from(mockParams)} + } + ] + }) + .compileComponents(); + })); + + beforeEach(() => { + + fixture = TestBed.createComponent(DepartmentListComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + spyOn(component, 'getDepts'); + spyOn(component, 'getSchools'); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); + + it('should set error to true',()=>{ + expect(component.error).toBe(true); + }); + + it('should display an error message', async() => { + tick(); + var errorMessage=document.getElementById('errorMsg'); + expect(errorMessage).toBeTruthy(); + }); + + +}); diff --git a/yacs-admin-angular/src/app/department/department-list/department-list.component.ts b/yacs-admin-angular/src/app/department/department-list/department-list.component.ts index d1ce5cf..e6890f8 100644 --- a/yacs-admin-angular/src/app/department/department-list/department-list.component.ts +++ b/yacs-admin-angular/src/app/department/department-list/department-list.component.ts @@ -2,7 +2,7 @@ import { Component, OnInit } from '@angular/core'; import { Department } from '../department'; import {YacsService} from '../../services/yacs.service'; import {School} from '../../school/school'; - +import { ActivatedRoute } from '@angular/router'; @Component({ selector: 'department-list', templateUrl: './department-list.component.html', @@ -15,7 +15,10 @@ export class DepartmentListComponent implements OnInit { creatingDept: boolean; departments: Department[]; schools: School[]; - constructor(private yacsService: YacsService) { } + school_id: number; + selectedSchool: School; + error: boolean; + constructor(private route: ActivatedRoute, private yacsService: YacsService) { } /*selectedDept: Department; onSelect(dept: Department): void{ let newDept = new Department(dept.id,dept.code, dept.name, dept.school_id); @@ -26,6 +29,11 @@ export class DepartmentListComponent implements OnInit { this.yacsService.getDepts() .subscribe(departments => this.departments = departments); } + + getDeptsById(id: number): void{ + this.yacsService.getDeptsBySchoolID(id) + .subscribe(departments => this.departments = departments); + } getSchools(): void{ this.yacsService.getSchools() @@ -70,11 +78,35 @@ export class DepartmentListComponent implements OnInit { } - + setSchoolId(): void{ + this.route.queryParams + .filter(params => params.school_id) + .subscribe(params =>{ + this.school_id=Number(params.school_id); + this.yacsService.getSchoolByID(this.school_id) + .subscribe( school=>{ + if(!school){ + this.error=true; + } + else{ + this.selectedSchool = school; + console.log(this.selectedSchool); + } + }, error=>{this.error=true;} ); + }); + } ngOnInit() { this.creatingDept=false; + this.error=false; + + this.setSchoolId(); this.getSchools(); - this.getDepts(); + if(this.school_id){ + this.getDeptsById(this.school_id); + } + else{ + this.getDepts(); + } } } From bc72807e816efb27aede12456209c9dba317eec8 Mon Sep 17 00:00:00 2001 From: kburk1997 Date: Tue, 17 Apr 2018 16:48:10 -0400 Subject: [PATCH 2/3] link to show depts in school --- .../src/app/school/school-list/school-list.component.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/yacs-admin-angular/src/app/school/school-list/school-list.component.html b/yacs-admin-angular/src/app/school/school-list/school-list.component.html index 97efe60..e8f5af9 100644 --- a/yacs-admin-angular/src/app/school/school-list/school-list.component.html +++ b/yacs-admin-angular/src/app/school/school-list/school-list.component.html @@ -33,7 +33,7 @@

New School

{{school.id}} {{school.name}} Details - Show Depts. + Show Depts. Delete From e8221fdedb47762c14bb44a4e9241c4aafff72b0 Mon Sep 17 00:00:00 2001 From: kburk1997 Date: Tue, 17 Apr 2018 17:29:50 -0400 Subject: [PATCH 3/3] bug fix - would retreive all departments regardless of whether or not a school was selected when new dept created or deleted --- .../department-list/department-list.component.ts | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) diff --git a/yacs-admin-angular/src/app/department/department-list/department-list.component.ts b/yacs-admin-angular/src/app/department/department-list/department-list.component.ts index e6890f8..4c5e785 100644 --- a/yacs-admin-angular/src/app/department/department-list/department-list.component.ts +++ b/yacs-admin-angular/src/app/department/department-list/department-list.component.ts @@ -55,7 +55,12 @@ export class DepartmentListComponent implements OnInit { if(confirm(promptString)){ this.yacsService.deleteDepartment(dept) .subscribe(()=>{ - this.getDepts(); + if(this.school_id){ + this.getDeptsById(this.school_id); + } + else{ + this.getDepts(); + } }); } } @@ -70,7 +75,12 @@ export class DepartmentListComponent implements OnInit { this.yacsService.addDepartment(newDept) .subscribe( ()=>{ //Get departments with new dept - this.getDepts(); + if(this.school_id){ + this.getDeptsById(this.school_id); + } + else{ + this.getDepts(); + } this.creatingDept=false; } );