-
Notifications
You must be signed in to change notification settings - Fork 4
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
fix(Manage Students): Remove student does not update the UI
- Loading branch information
1 parent
09286ee
commit d1aa863
Showing
9 changed files
with
183 additions
and
59 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
119 changes: 76 additions & 43 deletions
119
...nitor/classroomMonitorComponents/manageStudents/manage-team/manage-team.component.spec.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,75 +1,108 @@ | ||
| import { ComponentFixture, TestBed } from '@angular/core/testing'; | ||
| import { MatCardModule } from '@angular/material/card'; | ||
| import { MatDialog } from '@angular/material/dialog'; | ||
| import { MatDialog, MatDialogModule, MatDialogRef } from '@angular/material/dialog'; | ||
| import { MatSnackBarModule } from '@angular/material/snack-bar'; | ||
| import { By } from '@angular/platform-browser'; | ||
| import { UpdateWorkgroupService } from '../../../../../../app/services/updateWorkgroupService'; | ||
| import { ConfigService } from '../../../../services/configService'; | ||
| import { ManageTeamComponent } from './manage-team.component'; | ||
| import { NO_ERRORS_SCHEMA } from '@angular/core'; | ||
| import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed'; | ||
| import { ManageTeamHarness } from './manage-team.harness'; | ||
| import { ManageStudentsModule } from '../manage-students.module'; | ||
| import { HttpClientTestingModule } from '@angular/common/http/testing'; | ||
| import { of } from 'rxjs'; | ||
| import { RemoveUserConfirmDialogComponent } from '../remove-user-confirm-dialog/remove-user-confirm-dialog.component'; | ||
| import { HttpClient } from '@angular/common/http'; | ||
| import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; | ||
|
|
||
| class ConfigServiceStub { | ||
| getPermissions() {} | ||
| retrieveConfig() { | ||
| return {}; | ||
| } | ||
| } | ||
|
|
||
| class UpdateWorkgroupServiceStub {} | ||
|
|
||
| let component: ManageTeamComponent; | ||
| let configService: ConfigService; | ||
| let dialog: MatDialog; | ||
| let fixture: ComponentFixture<ManageTeamComponent>; | ||
| let component: ManageTeamComponent; | ||
| let getPermissionsSpy: jasmine.Spy; | ||
| let http: HttpClient; | ||
| let manageTeamHarness: ManageTeamHarness; | ||
| const studentName = 'a a'; | ||
| const studentUsername = 'aa0101'; | ||
|
|
||
| describe('ManageTeamComponent', () => { | ||
| beforeEach(() => { | ||
| beforeEach(async () => { | ||
| TestBed.configureTestingModule({ | ||
| declarations: [ManageTeamComponent], | ||
| imports: [MatSnackBarModule, MatCardModule], | ||
| providers: [ | ||
| { provide: ConfigService, useClass: ConfigServiceStub }, | ||
| { provide: UpdateWorkgroupService, useClass: UpdateWorkgroupServiceStub }, | ||
| { provide: MatDialog, useValue: {} } | ||
| imports: [ | ||
| BrowserAnimationsModule, | ||
| HttpClientTestingModule, | ||
| ManageStudentsModule, | ||
| MatCardModule, | ||
| MatDialogModule, | ||
| MatSnackBarModule | ||
| ], | ||
| providers: [ConfigService, UpdateWorkgroupService], | ||
| schemas: [NO_ERRORS_SCHEMA] | ||
| }); | ||
| configService = TestBed.inject(ConfigService); | ||
| dialog = TestBed.inject(MatDialog); | ||
| fixture = TestBed.createComponent(ManageTeamComponent); | ||
| http = TestBed.inject(HttpClient); | ||
| getPermissionsSpy = spyOn(configService, 'getPermissions'); | ||
| spyOn(configService, 'getRunId').and.returnValue(1); | ||
| spyOnCanGradeStudentWork(true); | ||
| component = fixture.componentInstance; | ||
| component.team = { workgroupId: 3, users: [{ id: 1 }] }; | ||
| component.team = { | ||
| workgroupId: 10, | ||
| users: [{ id: 1, name: studentName, username: studentUsername }] | ||
| }; | ||
| manageTeamHarness = await TestbedHarnessEnvironment.harnessForFixture( | ||
| fixture, | ||
| ManageTeamHarness | ||
| ); | ||
| }); | ||
| changePeriodLinkVisible(); | ||
| changePeriodLinkVisibility(); | ||
| removeStudent(); | ||
| }); | ||
|
|
||
| function changePeriodLinkVisible() { | ||
| function spyOnCanGradeStudentWork(canGrade: boolean) { | ||
| getPermissionsSpy.and.returnValue({ | ||
| canGradeStudentWork: canGrade, | ||
| canViewStudentNames: true, | ||
| canAuthorProject: true | ||
| }); | ||
| } | ||
|
|
||
| function changePeriodLinkVisibility() { | ||
| describe('change period link', () => { | ||
| it('should appear when user has GradeStudentWork permission', () => { | ||
| spyOnCanGradeStudentWork(true); | ||
| fixture.detectChanges(); | ||
| expect(getChangePeriodLink()).toBeTruthy(); | ||
| describe('teacher has GradeStudentWork permission', () => { | ||
| it('makes change period link visible', async () => { | ||
| expect(await manageTeamHarness.isChangePeriodLinkVisible()).toBeTrue(); | ||
| }); | ||
| }); | ||
| it('should not appear when user does not have GradeStudentWork permission', () => { | ||
| spyOnCanGradeStudentWork(false); | ||
| fixture.detectChanges(); | ||
| expect(getChangePeriodLink()).toBeFalsy(); | ||
| describe('teacher does not have GradeStudentWork permission', () => { | ||
| it('makes change period link not visible', async () => { | ||
| spyOnCanGradeStudentWork(false); | ||
| component.ngOnInit(); | ||
| expect(await manageTeamHarness.isChangePeriodLinkVisible()).toBeFalse(); | ||
| }); | ||
| }); | ||
| it('should not appear when there are no members', () => { | ||
| component.team.users = []; | ||
| spyOnCanGradeStudentWork(true); | ||
| fixture.detectChanges(); | ||
| expect(getChangePeriodLink()).toBeFalsy(); | ||
| describe('team has no members', () => { | ||
| it('makes change period link not visible', async () => { | ||
| component.team.users = []; | ||
| expect(await manageTeamHarness.isChangePeriodLinkVisible()).toBeFalse(); | ||
| }); | ||
| }); | ||
| }); | ||
| } | ||
|
|
||
| function spyOnCanGradeStudentWork(canGrade: boolean) { | ||
| spyOn(configService, 'getPermissions').and.returnValue({ | ||
| canGradeStudentWork: canGrade, | ||
| canViewStudentNames: true, | ||
| canAuthorProject: true | ||
| function removeStudent() { | ||
| describe('removeStudent()', () => { | ||
| describe('click remove student button on a student', () => { | ||
| it('removes student from the team', async () => { | ||
| spyOn(dialog, 'open').and.returnValue({ | ||
| afterClosed: () => of(true) | ||
| } as MatDialogRef<typeof RemoveUserConfirmDialogComponent>); | ||
| spyOn(http, 'delete').and.returnValue(of({})); | ||
| await manageTeamHarness.clickRemoveUser(`${studentName} (${studentUsername})`); | ||
| expect(await manageTeamHarness.getMemberCount()).toBe(0); | ||
| }); | ||
| }); | ||
| }); | ||
| } | ||
|
|
||
| function getChangePeriodLink() { | ||
| return fixture.debugElement.query(By.css('.change-period')); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
30 changes: 30 additions & 0 deletions
30
...sroomMonitor/classroomMonitorComponents/manageStudents/manage-team/manage-team.harness.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,30 @@ | ||
| import { ComponentHarness } from '@angular/cdk/testing'; | ||
| import { ManageUserHarness } from '../manage-user/manage-user.harness'; | ||
|
|
||
| export class ManageTeamHarness extends ComponentHarness { | ||
| static hostSelector = 'manage-team'; | ||
| protected getChangePeriodLink = this.locatorForOptional('.change-period'); | ||
| protected getMembers = this.locatorForAll(ManageUserHarness); | ||
|
|
||
| async isChangePeriodLinkVisible(): Promise<boolean> { | ||
| return (await this.getChangePeriodLink()) != null; | ||
| } | ||
|
|
||
| async getMember(username: string): Promise<ManageUserHarness> { | ||
| for (const member of await this.getMembers()) { | ||
| if ((await member.getUsername()) === username) { | ||
| return member; | ||
| } | ||
| } | ||
| return null; | ||
| } | ||
|
|
||
| async clickRemoveUser(username: string): Promise<void> { | ||
| const member = await this.getMember(username); | ||
| await member.clickRemoveUserButton(); | ||
| } | ||
|
|
||
| async getMemberCount(): Promise<number> { | ||
| return (await this.getMembers()).length; | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
19 changes: 19 additions & 0 deletions
19
...sroomMonitor/classroomMonitorComponents/manageStudents/manage-user/manage-user.harness.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,19 @@ | ||
| import { ComponentHarness } from '@angular/cdk/testing'; | ||
| import { MatButtonHarness } from '@angular/material/button/testing'; | ||
| import { ShowStudentInfoHarness } from '../show-student-info/show-student-info.harness'; | ||
|
|
||
| export class ManageUserHarness extends ComponentHarness { | ||
| static hostSelector = 'manage-user'; | ||
| protected getStudentInfo = this.locatorForOptional(ShowStudentInfoHarness); | ||
| protected getRemoveUserButton = this.locatorFor( | ||
| MatButtonHarness.with({ selector: '[aria-label="Remove student"]' }) | ||
| ); | ||
|
|
||
| async clickRemoveUserButton(): Promise<void> { | ||
| (await this.getRemoveUserButton()).click(); | ||
| } | ||
|
|
||
| async getUsername(): Promise<string> { | ||
| return await (await this.getStudentInfo()).getUsernameText(); | ||
| } | ||
| } |
10 changes: 10 additions & 0 deletions
10
.../classroomMonitorComponents/manageStudents/show-student-info/show-student-info.harness.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,10 @@ | ||
| import { ComponentHarness } from '@angular/cdk/testing'; | ||
|
|
||
| export class ShowStudentInfoHarness extends ComponentHarness { | ||
| static hostSelector = 'show-student-info'; | ||
| protected getUsername = this.locatorFor('.username'); | ||
|
|
||
| async getUsernameText(): Promise<string> { | ||
| return (await this.getUsername()).text(); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters