[ADF-5348] - fix user info icons (#6744)

* [ADF-5342] - fix user info icons

* make user info unit tests trusty
This commit is contained in:
Silviu Popa
2021-03-01 13:22:54 +02:00
committed by GitHub
parent 29316dad4f
commit 03af7e5ffd
3 changed files with 319 additions and 315 deletions

View File

@@ -22,10 +22,10 @@ export class FullNamePipe implements PipeTransform {
transform(user: any): string { transform(user: any): string {
let fullName = ''; let fullName = '';
if (user) { if (user) {
if (user.firstName) { if (user.firstName && user.firstName !== 'null') {
fullName += user.firstName; fullName += user.firstName;
} }
if (user.lastName) { if (user.lastName && user.lastName !== 'null') {
fullName += fullName.length > 0 ? ' ' : ''; fullName += fullName.length > 0 ? ' ' : '';
fullName += user.lastName; fullName += user.lastName;
} }

View File

@@ -19,14 +19,14 @@
data-automation-id="adf-user-profile"> data-automation-id="adf-user-profile">
<div class="adf-userinfo-button-profile" id="user-profile"> <div class="adf-userinfo-button-profile" id="user-profile">
<div *ngIf="identityUser$ | async as identityUser; else showBpmAndEcmUserImage" id="identity-user-image"> <div *ngIf="identityUser$ | async as identityUser; else showBpmAndEcmUserImage" id="identity-user-image">
<div *ngIf="ecmUser$ | async as ecmUser; else initialTemplate"> <div *ngIf="(ecmUser$ | async)?.avatarId as avatarId; else initialTemplate">
<div *ngIf="ecmUser.avatarId" class="adf-userinfo-profile-container"> <div class="adf-userinfo-profile-container">
<img id="logged-user-img" [src]="getEcmAvatar(ecmUser.avatarId)" alt="user-info-profile-button" <img id="logged-user-img" [src]="getEcmAvatar(avatarId)" alt="user-info-profile-button"
class="adf-userinfo-profile-image"/> class="adf-userinfo-profile-image"/>
</div> </div>
</div> </div>
<ng-template #initialTemplate> <ng-template #initialTemplate>
<div [outerHTML]="identityUser | usernameInitials:'adf-userinfo-pic'"></div> <div [innerHTML]="identityUser | usernameInitials:'adf-userinfo-pic'"></div>
</ng-template> </ng-template>
</div> </div>
<ng-template #showBpmAndEcmUserImage> <ng-template #showBpmAndEcmUserImage>

View File

@@ -31,6 +31,7 @@ import { of } from 'rxjs';
import { setupTestBed } from '../../testing/setup-test-bed'; import { setupTestBed } from '../../testing/setup-test-bed';
import { CoreTestingModule } from '../../testing/core.testing.module'; import { CoreTestingModule } from '../../testing/core.testing.module';
import { TranslateModule } from '@ngx-translate/core'; import { TranslateModule } from '@ngx-translate/core';
import { MatMenuModule } from '@angular/material/menu';
class FakeSanitizer extends DomSanitizer { class FakeSanitizer extends DomSanitizer {
@@ -88,7 +89,8 @@ describe('User info component', () => {
setupTestBed({ setupTestBed({
imports: [ imports: [
TranslateModule.forRoot(), TranslateModule.forRoot(),
CoreTestingModule CoreTestingModule,
MatMenuModule
] ]
}); });
@@ -103,7 +105,8 @@ describe('User info component', () => {
contentService = TestBed.inject(ContentService); contentService = TestBed.inject(ContentService);
identityUserService = TestBed.inject(IdentityUserService); identityUserService = TestBed.inject(IdentityUserService);
spyOn(bpmUserService, 'getCurrentUserProfileImage').and.returnValue(''); spyOn(window, 'requestAnimationFrame').and.returnValue(true);
spyOn(bpmUserService, 'getCurrentUserProfileImage').and.returnValue('app/rest/admin/profile-picture');
spyOn(contentService, 'getContentUrl').and.returnValue('alfresco-logo.svg'); spyOn(contentService, 'getContentUrl').and.returnValue('alfresco-logo.svg');
})); }));
@@ -125,17 +128,24 @@ describe('User info component', () => {
describe('when user is logged on ecm', () => { describe('when user is logged on ecm', () => {
let getCurrenEcmtUserInfoStub;
let isOauthStub;
let isEcmLoggedInStub;
let isLoggedInStub;
let isBpmLoggedInStub;
beforeEach(() => {
isOauthStub = spyOn(authService, 'isOauth').and.returnValue(false);
isEcmLoggedInStub = spyOn(authService, 'isEcmLoggedIn').and.returnValue(true);
isLoggedInStub = spyOn(authService, 'isLoggedIn').and.returnValue(true);
isBpmLoggedInStub = spyOn(authService, 'isBpmLoggedIn').and.returnValue(false);
getCurrenEcmtUserInfoStub = spyOn(ecmUserService, 'getCurrentUserInfo').and.returnValue(of(fakeEcmUser));
});
describe('ui ', () => { describe('ui ', () => {
beforeEach(() => { it('should able to fetch ecm userInfo', (done) => {
spyOn(authService, 'isOauth').and.returnValue(false); component.getUserInfo();
spyOn(authService, 'isEcmLoggedIn').and.returnValue(true);
spyOn(authService, 'isLoggedIn').and.returnValue(true);
spyOn(ecmUserService, 'getCurrentUserInfo').and.returnValue(of(fakeEcmEditedUser));
fixture.detectChanges();
});
it('should able to fetch ecm userInfo', async(() => {
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { fixture.whenStable().then(() => {
component.ecmUser$.subscribe((response: EcmUserModel) => { component.ecmUser$.subscribe((response: EcmUserModel) => {
@@ -143,114 +153,104 @@ describe('User info component', () => {
expect(response.firstName).toBe('fake-ecm-first-name'); expect(response.firstName).toBe('fake-ecm-first-name');
expect(response.lastName).toBe('fake-ecm-last-name'); expect(response.lastName).toBe('fake-ecm-last-name');
expect(response.email).toBe('fakeEcm@ecmUser.com'); expect(response.email).toBe('fakeEcm@ecmUser.com');
done();
}); });
}); });
})); });
it('should show ecm only last name when user first name is null ', async(() => { it('should show ecm only last name when user first name is null ', async () => {
getCurrenEcmtUserInfoStub.and.returnValue(of(fakeEcmEditedUser));
component.getUserInfo();
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { await fixture.whenStable();
fixture.detectChanges(); fixture.detectChanges();
const imageButton: HTMLButtonElement = <HTMLButtonElement> element.querySelector('#logged-user-img'); openUserInfo();
imageButton.click(); expect(element.querySelector('#userinfo_container')).toBeDefined();
fixture.detectChanges(); const ecmUsername = fixture.debugElement.query(By.css('#ecm-username'));
expect(element.querySelector('#userinfo_container')).toBeDefined(); expect(ecmUsername).toBeDefined();
const ecmUsername = fixture.debugElement.query(By.css('#ecm-username')); expect(ecmUsername).not.toBeNull();
expect(ecmUsername).toBeDefined(); expect(ecmUsername.nativeElement.textContent).not.toContain('fake-ecm-first-name');
expect(ecmUsername).not.toBeNull(); expect(ecmUsername.nativeElement.textContent).not.toContain('null');
expect(ecmUsername.nativeElement.textContent).not.toContain('fake-ecm-first-name'); });
expect(ecmUsername.nativeElement.textContent).not.toContain('null');
});
}));
it('should show the username when showName attribute is true', async(() => { it('should show the username when showName attribute is true', async () => {
fixture.whenStable().then(() => { await fixture.whenStable().then(() => {
fixture.detectChanges(); fixture.detectChanges();
expect(component.showName).toBeTruthy(); expect(component.showName).toBeTruthy();
expect(element.querySelector('#adf-userinfo-ecm-name-display')).not.toBeNull(); expect(element.querySelector('#adf-userinfo-ecm-name-display')).not.toBeNull();
}); });
}));
it('should hide the username when showName attribute is false', async(() => { it('should hide the username when showName attribute is false', async () => {
component.showName = false; component.showName = false;
fixture.whenStable().then(() => { await fixture.whenStable();
fixture.detectChanges(); fixture.detectChanges();
expect(element.querySelector('#adf-userinfo-ecm-name-display')).toBeNull(); expect(element.querySelector('#adf-userinfo-ecm-name-display')).toBeNull();
}); });
}));
it('should have the defined class to show the name on the right side', async(() => { it('should have the defined class to show the name on the right side', async () => {
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { await fixture.whenStable();
fixture.detectChanges(); fixture.detectChanges();
expect(element.querySelector('#userinfo_container').classList).toContain('adf-userinfo-name-right'); expect(element.querySelector('#userinfo_container').classList).toContain('adf-userinfo-name-right');
}); });
}));
it('should not have the defined class to show the name on the left side', async(() => { it('should not have the defined class to show the name on the left side', async () => {
component.namePosition = 'left'; component.namePosition = 'left';
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { await fixture.whenStable();
fixture.detectChanges(); fixture.detectChanges();
expect(element.querySelector('#userinfo_container').classList).not.toContain('adf-userinfo-name-right'); expect(element.querySelector('#userinfo_container').classList).not.toContain('adf-userinfo-name-right');
}); });
})); });
});
describe('and has image', () => { describe('and has image', () => {
beforeEach(async(() => { beforeEach(async(() => {
spyOn(authService, 'isOauth').and.returnValue(false); isOauthStub.and.returnValue(false);
spyOn(authService, 'isEcmLoggedIn').and.returnValue(true); isEcmLoggedInStub.and.returnValue(true);
spyOn(authService, 'isLoggedIn').and.returnValue(true); isLoggedInStub.and.returnValue(true);
spyOn(ecmUserService, 'getCurrentUserInfo').and.returnValue(of(fakeEcmUser)); getCurrenEcmtUserInfoStub.and.returnValue(of(fakeEcmUser));
fixture.detectChanges();
}));
it('should get the ecm current user image from the service', async(() => {
fixture.whenStable().then(() => {
fixture.detectChanges(); fixture.detectChanges();
const imageButton: HTMLButtonElement = <HTMLButtonElement> element.querySelector('#logged-user-img'); }));
imageButton.click();
it('should get the ecm current user image from the service', async () => {
await fixture.whenStable();
fixture.detectChanges(); fixture.detectChanges();
openUserInfo();
const loggedImage = fixture.debugElement.query(By.css('#logged-user-img')); const loggedImage = fixture.debugElement.query(By.css('#logged-user-img'));
expect(element.querySelector('#userinfo_container')).not.toBeNull(); expect(element.querySelector('#userinfo_container')).not.toBeNull();
expect(loggedImage).not.toBeNull(); expect(loggedImage).not.toBeNull();
expect(loggedImage.properties.src).toContain('alfresco-logo.svg'); expect(loggedImage.properties.src).toContain('alfresco-logo.svg');
}); });
}));
it('should display the current user image if user has avatarId', async(() => { it('should display the current user image if user has avatarId', (done) => {
fixture.detectChanges();
fixture.whenStable().then(() => {
fixture.detectChanges(); fixture.detectChanges();
const imageButton: HTMLButtonElement = <HTMLButtonElement> element.querySelector('#logged-user-img'); fixture.whenStable().then(() => {
imageButton.click(); fixture.detectChanges();
fixture.detectChanges(); openUserInfo();
const loggedImage = fixture.debugElement.query(By.css('#logged-user-img')); const loggedImage = fixture.debugElement.query(By.css('#logged-user-img'));
component.ecmUser$.subscribe((response: EcmUserModel) => { component.ecmUser$.subscribe((response: EcmUserModel) => {
expect(response).toBeDefined(); expect(response).toBeDefined();
expect(response.avatarId).toBe('fake-avatar-id'); expect(response.avatarId).toBe('fake-avatar-id');
done();
});
expect(element.querySelector('#userinfo_container')).not.toBeNull();
expect(loggedImage).not.toBeNull();
expect(loggedImage.properties.src).toContain('alfresco-logo.svg');
}); });
expect(element.querySelector('#userinfo_container')).not.toBeNull();
expect(loggedImage).not.toBeNull();
expect(loggedImage.properties.src).toContain('alfresco-logo.svg');
}); });
}));
it('should get the ecm user information from the service', async(() => { it('should get the ecm user information from the service', async () => {
fixture.detectChanges();
fixture.whenStable().then(() => {
fixture.detectChanges(); fixture.detectChanges();
const imageButton: HTMLButtonElement = <HTMLButtonElement> element.querySelector('#logged-user-img'); await fixture.whenStable();
imageButton.click();
fixture.detectChanges(); fixture.detectChanges();
openUserInfo();
const ecmImage = fixture.debugElement.query(By.css('#ecm-user-detail-image')); const ecmImage = fixture.debugElement.query(By.css('#ecm-user-detail-image'));
const ecmFullName = fixture.debugElement.query(By.css('#ecm-full-name')); const ecmFullName = fixture.debugElement.query(By.css('#ecm-full-name'));
const ecmJobTitle = fixture.debugElement.query(By.css('#ecm-job-title-label')); const ecmJobTitle = fixture.debugElement.query(By.css('#ecm-job-title-label'));
@@ -262,221 +262,216 @@ describe('User info component', () => {
expect(ecmFullName.nativeElement.textContent).toContain('fake-ecm-first-name fake-ecm-last-name'); expect(ecmFullName.nativeElement.textContent).toContain('fake-ecm-first-name fake-ecm-last-name');
expect(ecmJobTitle.nativeElement.textContent).toContain('USER_PROFILE.LABELS.ECM.JOB_TITLE'); expect(ecmJobTitle.nativeElement.textContent).toContain('USER_PROFILE.LABELS.ECM.JOB_TITLE');
}); });
})); });
describe('and has no image', () => {
beforeEach( async () => {
isOauthStub.and.returnValue(false);
isEcmLoggedInStub.and.returnValue(true);
isLoggedInStub.and.returnValue(true);
isBpmLoggedInStub.and.returnValue(false);
getCurrenEcmtUserInfoStub.and.returnValue(of(fakeEcmUserNoImage));
fixture.detectChanges();
await fixture.whenStable();
});
it('should show N/A when the job title is null', () => {
const imageButton: HTMLButtonElement = <HTMLButtonElement> element.querySelector('#user-initials-image');
imageButton.click();
fixture.detectChanges();
expect(element.querySelector('#userinfo_container')).not.toBeNull();
const ecmJobTitle = fixture.debugElement.query(By.css('#ecm-job-title'));
expect(ecmJobTitle).not.toBeNull();
expect(ecmJobTitle).not.toBeNull();
expect(ecmJobTitle.nativeElement.textContent).toContain('N/A');
});
it('should not show the tabs', () => {
const imageButton: HTMLButtonElement = <HTMLButtonElement> element.querySelector('#user-initials-image');
imageButton.click();
fixture.detectChanges();
const tabHeader = fixture.debugElement.query(By.css('#tab-group-env'));
expect(tabHeader.classes['adf-hide-tab']).toBeTruthy();
});
it('should display the current user Initials if the user dose not have avatarId', (done) => {
fixture.whenStable().then(() => {
fixture.detectChanges();
const pipe = new InitialUsernamePipe(new FakeSanitizer());
component.ecmUser$.subscribe((response: EcmUserModel) => {
expect(response).toBeDefined();
expect(response.avatarId).toBeNull();
done();
});
expect(pipe.transform({
id: 13,
firstName: 'Wilbur',
lastName: 'Adams',
email: 'wilbur@app.com'
})).toBe('<div id="user-initials-image" class="">WA</div>');
});
});
});
}); });
describe('and has no image', () => { describe('when user is logged on bpm', () => {
let getCurrentUserInfoStub;
beforeEach(async(() => { beforeEach(async(() => {
spyOn(authService, 'isOauth').and.returnValue(false); isOauthStub.and.returnValue(false);
spyOn(authService, 'isEcmLoggedIn').and.returnValue(true); isBpmLoggedInStub.and.returnValue(true);
spyOn(authService, 'isLoggedIn').and.returnValue(true); isLoggedInStub.and.returnValue(true);
spyOn(ecmUserService, 'getCurrentUserInfo').and.returnValue(of(fakeEcmUserNoImage)); isEcmLoggedInStub.and.returnValue(false);
fixture.detectChanges(); getCurrentUserInfoStub = spyOn(bpmUserService, 'getCurrentUserInfo').and.returnValue(of(fakeBpmUser));
fixture.whenStable().then(() => fixture.detectChanges());
})); }));
it('should show N/A when the job title is null', async(() => { it('should fetch bpm userInfo', (done) => {
const imageButton: HTMLButtonElement = <HTMLButtonElement> element.querySelector('#user-initials-image'); getCurrentUserInfoStub.and.returnValue(of(fakeBpmUser));
imageButton.click();
fixture.detectChanges(); fixture.detectChanges();
expect(element.querySelector('#userinfo_container')).not.toBeNull();
const ecmJobTitle = fixture.debugElement.query(By.css('#ecm-job-title'));
expect(ecmJobTitle).not.toBeNull();
expect(ecmJobTitle).not.toBeNull();
expect(ecmJobTitle.nativeElement.textContent).toContain('N/A');
}));
it('should not show the tabs', () => {
const imageButton: HTMLButtonElement = <HTMLButtonElement> element.querySelector('#user-initials-image');
imageButton.click();
fixture.detectChanges();
const tabHeader = fixture.debugElement.query(By.css('#tab-group-env'));
expect(tabHeader.classes['adf-hide-tab']).toBeTruthy();
});
it('should display the current user Initials if the user dose not have avatarId', async(() => {
fixture.whenStable().then(() => { fixture.whenStable().then(() => {
fixture.detectChanges(); component.bpmUser$.subscribe((response: BpmUserModel) => {
const pipe = new InitialUsernamePipe(new FakeSanitizer());
component.ecmUser$.subscribe((response: EcmUserModel) => {
expect(response).toBeDefined(); expect(response).toBeDefined();
expect(response.avatarId).toBeNull(); expect(response.firstName).toBe('fake-bpm-first-name');
expect(response.lastName).toBe('fake-bpm-last-name');
expect(response.email).toBe('fakeBpm@fake.com');
done();
}); });
expect(pipe.transform({
id: 13,
firstName: 'Wilbur',
lastName: 'Adams',
email: 'wilbur@app.com'
})).toBe('<div id="user-initials-image" class="">WA</div>');
});
}));
});
});
describe('when user is logged on bpm', () => {
let getCurrentUserInfoStub;
beforeEach(async(() => {
spyOn(authService, 'isOauth').and.returnValue(false);
spyOn(authService, 'isBpmLoggedIn').and.returnValue(true);
spyOn(authService, 'isLoggedIn').and.returnValue(true);
getCurrentUserInfoStub = spyOn(bpmUserService, 'getCurrentUserInfo').and.returnValue(of(fakeBpmUser));
}));
it('should fetch bpm userInfo', async(() => {
getCurrentUserInfoStub.and.returnValue(of(fakeBpmUser));
fixture.detectChanges();
fixture.whenStable().then(() => {
component.bpmUser$.subscribe((response: BpmUserModel) => {
expect(response).toBeDefined();
expect(response.firstName).toBe('fake-bpm-first-name');
expect(response.lastName).toBe('fake-bpm-last-name');
expect(response.email).toBe('fakeBpm@fake.com');
}); });
}); });
}));
it('should show full name next the user image', async(() => { it('should show full name next the user image', async () => {
getCurrentUserInfoStub.and.returnValue(of(fakeBpmUser)); getCurrentUserInfoStub.and.returnValue(of(fakeBpmUser));
fixture.detectChanges(); component.getUserInfo();
fixture.whenStable().then(() => {
fixture.detectChanges(); fixture.detectChanges();
const imageButton: HTMLButtonElement = <HTMLButtonElement> element.querySelector('#logged-user-img'); await fixture.whenStable();
imageButton.click();
fixture.detectChanges(); fixture.detectChanges();
openUserInfo();
const bpmUserName = fixture.debugElement.query(By.css('#bpm-username')); const bpmUserName = fixture.debugElement.query(By.css('#bpm-username'));
expect(element.querySelector('#userinfo_container')).not.toBeNull(); expect(element.querySelector('#userinfo_container')).not.toBeNull();
expect(bpmUserName).toBeDefined(); expect(bpmUserName).toBeDefined();
expect(bpmUserName).not.toBeNull(); expect(bpmUserName).not.toBeNull();
expect(bpmUserName.nativeElement.innerHTML).toContain('fake-bpm-first-name fake-bpm-last-name'); expect(bpmUserName.nativeElement.innerHTML).toContain('fake-bpm-first-name fake-bpm-last-name');
}); });
}));
it('should get the bpm current user image from the service', async(() => { it('should get the bpm current user image from the service', async () => {
getCurrentUserInfoStub.and.returnValue(of(fakeBpmUser)); getCurrentUserInfoStub.and.returnValue(of(fakeBpmUser));
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { await fixture.whenStable();
fixture.detectChanges(); fixture.detectChanges();
expect(element.querySelector('#userinfo_container')).not.toBeNull(); expect(element.querySelector('#userinfo_container')).not.toBeNull();
expect(element.querySelector('#logged-user-img')).not.toBeNull(); expect(element.querySelector('#logged-user-img')).not.toBeNull();
expect(element.querySelector('#logged-user-img').getAttribute('src')) expect(element.querySelector('#logged-user-img').getAttribute('src'))
.toContain('activiti-app/app/rest/admin/profile-picture'); .toContain('app/rest/admin/profile-picture');
}); });
}));
it('should show last name if first name is null', async(() => { it('should show last name if first name is null', async () => {
fixture.detectChanges(); fixture.detectChanges();
const wrongBpmUser: BpmUserModel = new BpmUserModel({ const wrongBpmUser: BpmUserModel = new BpmUserModel({
firstName: null, firstName: null,
lastName: 'fake-last-name' lastName: 'fake-last-name'
}); });
getCurrentUserInfoStub.and.returnValue(of(wrongBpmUser)); getCurrentUserInfoStub.and.returnValue(of(wrongBpmUser));
fixture.detectChanges(); component.getUserInfo();
fixture.whenStable().then(() => { fixture.detectChanges();
await fixture.whenStable();
const fullNameElement = (element.querySelector('#adf-userinfo-bpm-name-display')); const fullNameElement = (element.querySelector('#adf-userinfo-bpm-name-display'));
fixture.detectChanges(); fixture.detectChanges();
expect(element.querySelector('#userinfo_container')).toBeDefined(); expect(element.querySelector('#userinfo_container')).toBeDefined();
expect(element.querySelector('#adf-userinfo-bpm-name-display')).not.toBeNull(); expect(element.querySelector('#adf-userinfo-bpm-name-display')).not.toBeNull();
expect(fullNameElement.textContent).toContain('fake-last-name'); expect(fullNameElement.textContent).toContain('fake-last-name');
expect(fullNameElement.textContent).not.toContain('fake-first-name'); expect(fullNameElement.textContent).not.toContain('fake-first-name');
}); });
}));
it('should not show first name if it is null string', async(() => { it('should not show first name if it is null string', async () => {
const wrongFirstNameBpmUser: BpmUserModel = new BpmUserModel({ const wrongFirstNameBpmUser: BpmUserModel = new BpmUserModel({
firstName: 'null', firstName: 'null',
lastName: 'fake-last-name' lastName: 'fake-last-name'
}); });
getCurrentUserInfoStub.and.returnValue(of(wrongFirstNameBpmUser)); getCurrentUserInfoStub.and.returnValue(of(wrongFirstNameBpmUser));
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { await fixture.whenStable();
fixture.detectChanges(); fixture.detectChanges();
expect(element.querySelector('#userinfo_container')).toBeDefined(); expect(element.querySelector('#userinfo_container')).toBeDefined();
expect(element.querySelector('#adf-userinfo-bpm-name-display')).toBeDefined(); expect(element.querySelector('#adf-userinfo-bpm-name-display')).toBeDefined();
expect(element.querySelector('#adf-userinfo-bpm-name-display').textContent).toContain('fake-last-name'); expect(element.querySelector('#adf-userinfo-bpm-name-display').textContent).toContain('fake-last-name');
expect(element.querySelector('#adf-userinfo-bpm-name-display').textContent).not.toContain('null'); expect(element.querySelector('#adf-userinfo-bpm-name-display').textContent).not.toContain('null');
}); });
}));
it('should not show last name if it is null string', async(() => { it('should not show last name if it is null string', async () => {
const wrongLastNameBpmUser: BpmUserModel = new BpmUserModel({ const wrongLastNameBpmUser: BpmUserModel = new BpmUserModel({
firstName: 'fake-first-name', firstName: 'fake-first-name',
lastName: 'null' lastName: 'null'
}); });
getCurrentUserInfoStub.and.returnValue(of(wrongLastNameBpmUser)); getCurrentUserInfoStub.and.returnValue(of(wrongLastNameBpmUser));
fixture.detectChanges(); component.getUserInfo();
fixture.detectChanges();
fixture.whenStable().then(() => { await fixture.whenStable();
fixture.detectChanges(); fixture.detectChanges();
expect(element.querySelector('#userinfo_container')).toBeDefined(); expect(element.querySelector('#userinfo_container')).toBeDefined();
expect(element.querySelector('#adf-userinfo-bpm-name-display')).toBeDefined(); expect(element.querySelector('#adf-userinfo-bpm-name-display')).toBeDefined();
expect(element.querySelector('#adf-userinfo-bpm-name-display').textContent).toContain('fake-first-name'); expect(element.querySelector('#adf-userinfo-bpm-name-display').textContent).toContain('fake-first-name');
expect(element.querySelector('#adf-userinfo-bpm-name-display').textContent).not.toContain('null'); expect(element.querySelector('#adf-userinfo-bpm-name-display').textContent).not.toContain('null');
}); });
}));
it('should not show the tabs', async(() => { it('should not show the tabs', async () => {
fixture.detectChanges(); fixture.detectChanges();
const imageButton: HTMLButtonElement = <HTMLButtonElement> element.querySelector('#logged-user-img'); openUserInfo();
imageButton.click(); await fixture.whenStable();
fixture.detectChanges();
fixture.whenStable().then(() => {
fixture.detectChanges(); fixture.detectChanges();
expect(fixture.debugElement.query(By.css('#tab-group-env')).classes['adf-hide-tab']).toBeTruthy(); expect(fixture.debugElement.query(By.css('#tab-group-env')).classes['adf-hide-tab']).toBeTruthy();
}); });
})); });
});
describe('when user is logged on bpm and ecm', () => { describe('when user is logged on bpm and ecm', () => {
let ecmUserInfoSpy; beforeEach(async(() => {
isOauthStub.and.returnValue(false);
isEcmLoggedInStub.and.returnValue(true);
isBpmLoggedInStub.and.returnValue(true);
isLoggedInStub.and.returnValue(true);
beforeEach(async(() => { getCurrenEcmtUserInfoStub.and.returnValue(of(fakeEcmUser));
spyOn(authService, 'isOauth').and.returnValue(false); spyOn(bpmUserService, 'getCurrentUserInfo').and.returnValue(of(fakeBpmUser));
spyOn(authService, 'isEcmLoggedIn').and.returnValue(true); }));
spyOn(authService, 'isBpmLoggedIn').and.returnValue(true);
spyOn(authService, 'isLoggedIn').and.returnValue(true);
ecmUserInfoSpy = spyOn(ecmUserService, 'getCurrentUserInfo').and.returnValue(of(fakeEcmUser)); it('should able to fetch ecm userInfo', (done) => {
spyOn(bpmUserService, 'getCurrentUserInfo').and.returnValue(of(fakeBpmUser)); fixture.detectChanges();
}));
it('should able to fetch ecm userInfo', async(() => { fixture.whenStable().then(() => {
fixture.detectChanges(); component.ecmUser$.subscribe((response: EcmUserModel) => {
expect(response).toBeDefined();
fixture.whenStable().then(() => { expect(response.firstName).toBe('fake-ecm-first-name');
component.ecmUser$.subscribe((response: EcmUserModel) => { expect(response.lastName).toBe('fake-ecm-last-name');
expect(response).toBeDefined(); expect(response.email).toBe('fakeEcm@ecmUser.com');
expect(response.firstName).toBe('fake-ecm-first-name'); done();
expect(response.lastName).toBe('fake-ecm-last-name'); });
expect(response.email).toBe('fakeEcm@ecmUser.com');
}); });
}); });
}));
it('should able to fetch bpm userInfo', async(() => { it('should able to fetch bpm userInfo', (done) => {
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { fixture.whenStable().then(() => {
component.bpmUser$.subscribe((response: BpmUserModel) => { component.bpmUser$.subscribe((response: BpmUserModel) => {
expect(response).toBeDefined(); expect(response).toBeDefined();
expect(response.firstName).toBe('fake-bpm-first-name'); expect(response.firstName).toBe('fake-bpm-first-name');
expect(response.lastName).toBe('fake-bpm-last-name'); expect(response.lastName).toBe('fake-bpm-last-name');
expect(response.email).toBe('fakeBpm@fake.com'); expect(response.email).toBe('fakeBpm@fake.com');
done();
});
}); });
}); });
}));
it('should get the bpm user information from the service', async(() => { it('should get the bpm user information from the service', async () => {
openUserInfo(); openUserInfo();
const bpmTab = fixture.debugElement.queryAll(By.css('#tab-group-env .mat-tab-labels .mat-tab-label'))[1]; const bpmTab = fixture.debugElement.queryAll(By.css('#tab-group-env .mat-tab-labels .mat-tab-label'))[1];
bpmTab.triggerEventHandler('click', null); bpmTab.triggerEventHandler('click', null);
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { await fixture.whenStable();
const bpmUsername = fixture.debugElement.query(By.css('#bpm-username')); const bpmUsername = fixture.debugElement.query(By.css('#bpm-username'));
const bpmImage = fixture.debugElement.query(By.css('#bpm-user-detail-image')); const bpmImage = fixture.debugElement.query(By.css('#bpm-user-detail-image'));
expect(element.querySelector('#userinfo_container')).not.toBeNull(); expect(element.querySelector('#userinfo_container')).not.toBeNull();
@@ -486,15 +481,14 @@ describe('User info component', () => {
expect(bpmUsername.nativeElement.textContent).toContain('fake-bpm-first-name fake-bpm-last-name'); expect(bpmUsername.nativeElement.textContent).toContain('fake-bpm-first-name fake-bpm-last-name');
expect(fixture.debugElement.query(By.css('#bpm-tenant')).nativeElement.textContent).toContain('fake-tenant-name'); expect(fixture.debugElement.query(By.css('#bpm-tenant')).nativeElement.textContent).toContain('fake-tenant-name');
}); });
}));
it('should get the ecm user information from the service', async(() => { it('should get the ecm user information from the service', async () => {
openUserInfo(); openUserInfo();
const ecmUsername = fixture.debugElement.query(By.css('#ecm-username')); const ecmUsername = fixture.debugElement.query(By.css('#ecm-username'));
const ecmImage = fixture.debugElement.query(By.css('#ecm-user-detail-image')); const ecmImage = fixture.debugElement.query(By.css('#ecm-user-detail-image'));
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { await fixture.whenStable();
expect(element.querySelector('#userinfo_container')).toBeDefined(); expect(element.querySelector('#userinfo_container')).toBeDefined();
expect(ecmUsername).not.toBeNull(); expect(ecmUsername).not.toBeNull();
expect(ecmImage).not.toBeNull(); expect(ecmImage).not.toBeNull();
@@ -502,101 +496,99 @@ describe('User info component', () => {
expect(fixture.debugElement.query(By.css('#ecm-full-name')).nativeElement.textContent).toContain('fake-ecm-first-name fake-ecm-last-name'); expect(fixture.debugElement.query(By.css('#ecm-full-name')).nativeElement.textContent).toContain('fake-ecm-first-name fake-ecm-last-name');
expect(fixture.debugElement.query(By.css('#ecm-job-title')).nativeElement.textContent).toContain('job-ecm-test'); expect(fixture.debugElement.query(By.css('#ecm-job-title')).nativeElement.textContent).toContain('job-ecm-test');
}); });
}));
it('should show the ecm image if exists', async(() => { it('should show the ecm image if exists', () => {
openUserInfo(); openUserInfo();
expect(element.querySelector('#userinfo_container')).toBeDefined(); expect(element.querySelector('#userinfo_container')).toBeDefined();
expect(element.querySelector('#logged-user-img')).toBeDefined(); expect(element.querySelector('#logged-user-img')).toBeDefined();
expect(element.querySelector('#logged-user-img').getAttribute('src')).toEqual('alfresco-logo.svg'); expect(element.querySelector('#logged-user-img').getAttribute('src')).toEqual('alfresco-logo.svg');
})); });
it('should show the ecm initials if the ecm user has no image', async(() => { it('should show the ecm initials if the ecm user has no image', async () => {
ecmUserInfoSpy.and.returnValue(of(fakeEcmUserNoImage)); getCurrenEcmtUserInfoStub.and.returnValue(of(fakeEcmUserNoImage));
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { await fixture.whenStable();
fixture.detectChanges(); fixture.detectChanges();
expect(element.querySelector('#userinfo_container')).toBeDefined(); expect(element.querySelector('#userinfo_container')).toBeDefined();
expect(element.querySelector('#user-initials-image').textContent).toContain('ff'); expect(element.querySelector('#user-initials-image').textContent).toContain('ff');
}); });
}));
it('should show the tabs for the env', () => { it('should show the tabs for the env', () => {
openUserInfo(); openUserInfo();
const tabGroup = fixture.debugElement.query(By.css('#tab-group-env')); const tabGroup = fixture.debugElement.query(By.css('#tab-group-env'));
const tabs = fixture.debugElement.queryAll(By.css('#tab-group-env .mat-tab-labels .mat-tab-label')); const tabs = fixture.debugElement.queryAll(By.css('#tab-group-env .mat-tab-labels .mat-tab-label'));
expect(tabGroup).not.toBeNull(); expect(tabGroup).not.toBeNull();
expect(tabGroup.classes['adf-hide-tab']).toBeFalsy(); expect(tabGroup.classes['adf-hide-tab']).toBeFalsy();
expect(tabs.length).toBe(2); expect(tabs.length).toBe(2);
});
it('should not close the menu when a tab is clicked', () => {
openUserInfo();
const tabGroup = fixture.debugElement.query(By.css('#tab-group-env'));
const tabs = fixture.debugElement.queryAll(By.css('#tab-group-env .mat-tab-labels .mat-tab-label'));
expect(tabGroup).not.toBeNull();
tabs[1].triggerEventHandler('click', null);
fixture.detectChanges();
expect(fixture.debugElement.query(By.css('#user-profile-lists'))).not.toBeNull();
});
}); });
it('should not close the menu when a tab is clicked', () => { describe('when identity user is logged in', () => {
openUserInfo();
const tabGroup = fixture.debugElement.query(By.css('#tab-group-env'));
const tabs = fixture.debugElement.queryAll(By.css('#tab-group-env .mat-tab-labels .mat-tab-label'));
expect(tabGroup).not.toBeNull(); let getCurrentUserInfoStub;
tabs[1].triggerEventHandler('click', null);
fixture.detectChanges();
expect(fixture.debugElement.query(By.css('#user-profile-lists'))).not.toBeNull();
});
});
describe('when identity user is logged in', () => { beforeEach(async(() => {
isOauthStub.and.returnValue(true);
isLoggedInStub.and.returnValue(true);
isEcmLoggedInStub.and.returnValue(false);
getCurrentUserInfoStub = spyOn(identityUserService, 'getCurrentUserInfo').and.returnValue(identityUserMock);
}));
let getCurrentUserInfoStub; it('should show the identity user initials if is not ecm user', async () => {
fixture.detectChanges();
await fixture.whenStable();
fixture.detectChanges();
expect(element.querySelector('#userinfo_container')).toBeDefined();
expect(element.querySelector('#user-initials-image').textContent).toContain('ff');
});
beforeEach(async(() => { it('should able to fetch identity userInfo', (done) => {
spyOn(authService, 'isOauth').and.returnValue(true); fixture.detectChanges();
spyOn(authService, 'isLoggedIn').and.returnValue(true);
getCurrentUserInfoStub = spyOn(identityUserService, 'getCurrentUserInfo').and.returnValue(identityUserMock);
}));
it('should show the identity user initials if is not ecm user', async () => { fixture.whenStable().then(() => {
fixture.detectChanges(); component.identityUser$.subscribe(response => {
await fixture.whenStable(); expect(response).toBeDefined();
fixture.detectChanges(); expect(response.firstName).toBe('fake-identity-first-name');
expect(element.querySelector('#userinfo_container')).toBeDefined(); expect(response.lastName).toBe('fake-identity-last-name');
expect(element.querySelector('#user-initials-image').textContent).toContain('ff'); expect(response.email).toBe('fakeIdentity@email.com');
}); done();
});
it('should able to fetch identity userInfo', async(() => {
fixture.detectChanges();
fixture.whenStable().then(() => {
component.identityUser$.subscribe(response => {
expect(response).toBeDefined();
expect(response.firstName).toBe('fake-identity-first-name');
expect(response.lastName).toBe('fake-identity-last-name');
expect(response.email).toBe('fakeIdentity@email.com');
}); });
}); });
}));
it('should show full name next the user image', async(() => { it('should show full name next the user image', async () => {
fixture.detectChanges();
fixture.whenStable().then(() => {
fixture.detectChanges(); fixture.detectChanges();
await fixture.whenStable();
const imageButton: HTMLButtonElement = <HTMLButtonElement> element.querySelector('#identity-user-image'); const imageButton: HTMLButtonElement = <HTMLButtonElement> element.querySelector('#identity-user-image');
imageButton.click(); imageButton.click();
fixture.detectChanges(); fixture.detectChanges();
const bpmUserName = element.querySelector('#identity-username');
fixture.detectChanges();
expect(element.querySelector('#userinfo_container')).not.toBeNull(); expect(element.querySelector('#userinfo_container')).not.toBeNull();
const bpmUserName = fixture.debugElement.query(By.css('#identity-username'));
expect(bpmUserName).toBeDefined(); expect(bpmUserName).toBeDefined();
expect(bpmUserName).not.toBeNull(); expect(bpmUserName).not.toBeNull();
expect(bpmUserName.textContent).toContain('fake-identity-first-name fake-identity-last-name'); expect(bpmUserName.nativeElement.textContent).toContain('fake-identity-first-name fake-identity-last-name');
}); });
}));
it('should show last name if first name is null', async(() => { it('should show last name if first name is null', async () => {
fixture.detectChanges(); fixture.detectChanges();
getCurrentUserInfoStub.and.returnValue(identityUserWithOutFirstNameMock); getCurrentUserInfoStub.and.returnValue(identityUserWithOutFirstNameMock);
component.getUserInfo();
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { await fixture.whenStable();
fixture.detectChanges(); fixture.detectChanges();
const fullNameElement = element.querySelector('#adf-userinfo-identity-name-display'); const fullNameElement = element.querySelector('#adf-userinfo-identity-name-display');
expect(element.querySelector('#userinfo_container')).toBeDefined(); expect(element.querySelector('#userinfo_container')).toBeDefined();
@@ -604,13 +596,12 @@ describe('User info component', () => {
expect(fullNameElement.textContent).toContain('fake-identity-last-name'); expect(fullNameElement.textContent).toContain('fake-identity-last-name');
expect(fullNameElement.textContent).not.toContain('fake-identity-first-name'); expect(fullNameElement.textContent).not.toContain('fake-identity-first-name');
}); });
}));
it('should not show first name if it is null string', async(() => { it('should not show first name if it is null string', async () => {
getCurrentUserInfoStub.and.returnValue(of(identityUserWithOutFirstNameMock)); getCurrentUserInfoStub.and.returnValue(identityUserWithOutFirstNameMock);
component.getUserInfo();
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { await fixture.whenStable();
const fullNameElement = element.querySelector('#adf-userinfo-identity-name-display'); const fullNameElement = element.querySelector('#adf-userinfo-identity-name-display');
fixture.detectChanges(); fixture.detectChanges();
expect(element.querySelector('#userinfo_container')).toBeDefined(); expect(element.querySelector('#userinfo_container')).toBeDefined();
@@ -618,13 +609,13 @@ describe('User info component', () => {
expect(fullNameElement.textContent).toContain('fake-identity-last-name'); expect(fullNameElement.textContent).toContain('fake-identity-last-name');
expect(fullNameElement.textContent).not.toContain('null'); expect(fullNameElement.textContent).not.toContain('null');
}); });
}));
it('should not show last name if it is null string', async(() => { it('should not show last name if it is null string', async () => {
getCurrentUserInfoStub.and.returnValue(of(identityUserWithOutLastNameMock)); getCurrentUserInfoStub.and.returnValue(identityUserWithOutLastNameMock);
fixture.detectChanges(); component.getUserInfo();
fixture.detectChanges();
fixture.whenStable().then(() => { await fixture.whenStable();
const fullNameElement = element.querySelector('#adf-userinfo-identity-name-display'); const fullNameElement = element.querySelector('#adf-userinfo-identity-name-display');
fixture.detectChanges(); fixture.detectChanges();
expect(element.querySelector('#userinfo_container')).toBeDefined(); expect(element.querySelector('#userinfo_container')).toBeDefined();
@@ -632,6 +623,19 @@ describe('User info component', () => {
expect(fullNameElement.textContent).toContain('fake-identity-first-name'); expect(fullNameElement.textContent).toContain('fake-identity-first-name');
expect(fullNameElement.textContent).not.toContain('null'); expect(fullNameElement.textContent).not.toContain('null');
}); });
}));
it('should not show initials if the user have avatar', async () => {
getCurrentUserInfoStub.and.returnValue(identityUserWithOutLastNameMock);
getCurrenEcmtUserInfoStub.and.returnValue(of(fakeEcmUser));
isEcmLoggedInStub.and.returnValue(true);
fixture.detectChanges();
await fixture.whenStable();
fixture.detectChanges();
expect(element.querySelector('.adf-userinfo-pic')).toBeNull();
expect(element.querySelector('.adf-userinfo-profile-image')).toBeDefined();
expect(element.querySelector('.adf-userinfo-profile-image')).not.toBeNull();
});
});
}); });
}); });