update view profile unit tests

This commit is contained in:
Denys Vuika
2023-02-14 12:48:17 -05:00
committed by Sheena Malhotra
parent 62ad3cd786
commit 7c89b53928
4 changed files with 96 additions and 70 deletions

View File

@@ -9,9 +9,9 @@
<div *ngIf="profileForm" class="app-profile-row" [formGroup]="profileForm">
<div class="app-profile-general">
<div class="app-profile-general-section">
<mat-icon (click)="toggleGeneralDropdown()" id="toggle-general-dropdown">
{{ generalSectionDropdown ? 'expand_more' : 'chevron_right'}}
</mat-icon>
<button mat-icon-button (click)="toggleGeneralDropdown()" id="toggle-general-dropdown">
<mat-icon>{{ generalSectionDropdown ? 'expand_more' : 'chevron_right'}}</mat-icon>
</button>
<h4 class="app-general-title">{{'APP.EDIT_PROFILE.GENERAL' | translate}}</h4>
</div>
@@ -92,8 +92,9 @@
<div *ngIf="profileForm" class="app-profile-row" [formGroup]="profileForm">
<div class="app-profile-general">
<div class="app-profile-general-section">
<mat-icon (click)="toggleContactDropdown()" id="toggle-contact-dropdown">
{{ contactSectionDropdown ? 'expand_more' : 'chevron_right'}}</mat-icon>
<button mat-icon-button (click)="toggleContactDropdown()" id="toggle-contact-dropdown">
<mat-icon>{{ contactSectionDropdown ? 'expand_more' : 'chevron_right'}}</mat-icon>
</button>
<h4 class="app-general-title">{{'APP.EDIT_PROFILE.COMPANY_DETAILS' | translate}}</h4>
</div>

View File

@@ -57,7 +57,7 @@
.app-general-title {
margin-left: 0.6rem;
margin-top: 4px;
margin-top: 11px;
letter-spacing: .5px;
}

View File

@@ -32,80 +32,109 @@ describe('ViewProfileComponent', () => {
router.initialNavigation();
});
afterEach(() => {
fixture.destroy();
});
it('should company dropdown remains close', async () => {
expect(component.contactSectionDropdown).toBe(false);
});
it('should save button is disabled if form has invalid mobile number', () => {
component.ngOnInit();
const profileFormGroup = component.profileForm;
it('should save button is disabled if form has invalid mobile number', async () => {
spyOn(component.peopleApi, 'getPerson').and.returnValue(
Promise.resolve({
entry: {
id: 'user1',
firstName: 'User1',
lastName: 'User1',
email: 'user1@company.com',
enabled: true,
jobTitle: 'Developer',
location: 'US',
telephone: '2744245',
mobile: 'AB8866322112',
company: {
organization: 'test Name',
postcode: '12345',
address1: 'test address',
telephone: '27442266',
email: 'email@test.com'
}
}
})
);
profileFormGroup.setValue({
jobTitle: 'Developer',
location: 'US',
telephone: '2744245',
mobile: 'AB8866322112',
oldPassword: 'admin@123',
newPassword: 'admin@1234',
verifyPassword: 'admin@1234',
companyName: 'test Name',
companyPostCode: '12345',
companyAddress: 'test address',
companyTelephone: '27442266',
companyEmail: 'email@test.com'
});
fixture.detectChanges();
await fixture.whenStable();
expect(profileFormGroup.valid).toEqual(false);
expect(component.profileForm.valid).toEqual(false);
expect(component.isSaveButtonDisabled()).toBeTruthy();
});
it('should save button is disabled if form has invalid email', () => {
component.ngOnInit();
const profileFormGroup = component.profileForm;
it('should save button is disabled if form has invalid email', async () => {
spyOn(component.peopleApi, 'getPerson').and.returnValue(
Promise.resolve({
entry: {
id: 'user1',
firstName: 'User1',
lastName: 'User1',
email: 'user1@company.com',
enabled: true,
jobTitle: 'Developer',
location: 'US',
telephone: '2744245',
mobile: 'AB8866322112',
company: {
organization: 'test Name',
postcode: '12345',
address1: 'test address',
telephone: '27442266',
email: 'email'
}
}
})
);
profileFormGroup.setValue({
jobTitle: 'Developer',
location: 'US',
telephone: '27442445',
mobile: '457554',
oldPassword: 'admin@123',
newPassword: 'admin@1234',
verifyPassword: 'admin@1234',
companyName: 'test Name',
companyPostCode: '12345',
companyAddress: 'test address',
companyTelephone: '27442266',
companyEmail: 'email'
});
fixture.detectChanges();
await fixture.whenStable();
expect(profileFormGroup.valid).toEqual(false);
expect(component.profileForm.valid).toEqual(false);
expect(component.isSaveButtonDisabled()).toBeTruthy();
});
it('should save button is enabled if form has valid inputs', () => {
component.ngOnInit();
const profileFormGroup = component.profileForm;
it('should enable save button if form is valid', async () => {
spyOn(component.peopleApi, 'getPerson').and.returnValue(
Promise.resolve({
entry: {
id: 'user1',
firstName: 'User1',
lastName: 'User1',
email: 'user1@company.com',
enabled: true,
jobTitle: 'Developer',
location: 'US',
telephone: '274-422-55',
mobile: '886-632-2112',
company: {
organization: 'testCompany',
postcode: '12345',
address1: 'test address',
telephone: '274-22-66',
email: 'testEmail@test.com'
}
}
})
);
profileFormGroup.setValue({
jobTitle: 'Developer',
location: 'US',
telephone: '274-422-55',
mobile: '886-632-2112',
oldPassword: 'test@123',
newPassword: 'test@1234',
verifyPassword: 'test@1234',
companyName: 'testCompany',
companyPostCode: '12345',
companyAddress: 'test address',
companyTelephone: '274-22-66',
companyEmail: 'testEmail@test.com'
});
fixture.detectChanges();
await fixture.whenStable();
expect(profileFormGroup.valid).toEqual(true);
expect(component.profileForm.valid).toEqual(true);
expect(component.isSaveButtonDisabled()).toBeFalsy();
});
it('should expand or compress general dropdown when arrow button is clicked', () => {
component.populateForm({} as any);
spyOn(component, 'toggleGeneralDropdown').and.callThrough();
component.generalSectionDropdown = false;
fixture.detectChanges();
@@ -118,6 +147,7 @@ describe('ViewProfileComponent', () => {
});
it('should expand or compress contact dropdown when arrow button is clicked', () => {
component.populateForm({} as any);
spyOn(component, 'toggleContactDropdown').and.callThrough();
component.contactSectionDropdown = false;
fixture.detectChanges();
@@ -130,6 +160,7 @@ describe('ViewProfileComponent', () => {
});
it('should toggle form view when edit or cancel buttons is clicked for general form', () => {
component.populateForm({} as any);
spyOn(component, 'toggleGeneralButtons').and.callThrough();
fixture.detectChanges();
@@ -144,6 +175,7 @@ describe('ViewProfileComponent', () => {
});
it('should toggle form view when edit or cancel buttons is clicked for contact form', () => {
component.populateForm({} as any);
spyOn(component, 'toggleContactButtons').and.callThrough();
fixture.detectChanges();

View File

@@ -43,24 +43,17 @@ export class ViewProfileComponent implements OnInit {
ngOnInit() {
this.peopleApi
.getPerson('-me-')
.then((userInfo) => {
this.personDetails = userInfo?.entry;
this.populateForm(userInfo?.entry);
})
.catch((error) => {
throwError(error);
});
.then((userInfo) => this.populateForm(userInfo?.entry))
.catch((error) => throwError(error));
}
populateForm(userInfo: Person) {
this.personDetails = userInfo;
this.profileForm = new FormGroup({
jobTitle: new FormControl(userInfo?.jobTitle || ''),
location: new FormControl(userInfo?.location || ''),
telephone: new FormControl(userInfo?.telephone || '', [Validators.pattern('^([0-9]+-)*[0-9]+$')]),
mobile: new FormControl(userInfo?.mobile || '', [Validators.pattern('^([0-9]+-)*[0-9]+$')]),
oldPassword: new FormControl(''),
newPassword: new FormControl(''),
verifyPassword: new FormControl(''),
companyName: new FormControl(userInfo?.company?.organization || ''),
companyPostCode: new FormControl(userInfo?.company?.postcode || ''),
companyAddress: new FormControl(userInfo?.company?.address1 || ''),