diff --git a/webui/src/app/login-screen/login-screen.component.spec.ts b/webui/src/app/login-screen/login-screen.component.spec.ts index 68b6d1562..03b9243df 100644 --- a/webui/src/app/login-screen/login-screen.component.spec.ts +++ b/webui/src/app/login-screen/login-screen.component.spec.ts @@ -2,7 +2,7 @@ import { ComponentFixture, fakeAsync, TestBed, tick, waitForAsync } from '@angul import { LoginScreenComponent } from './login-screen.component' import { FormsModule, ReactiveFormsModule } from '@angular/forms' -import { GeneralService, UsersService } from '../backend' +import { AuthenticationMethod, GeneralService, UsersService } from '../backend' import { HttpClientTestingModule } from '@angular/common/http/testing' import { MessageService } from 'primeng/api' import { ProgressSpinnerModule } from 'primeng/progressspinner' @@ -12,12 +12,40 @@ import { of } from 'rxjs' import { By } from '@angular/platform-browser' import { RouterModule } from '@angular/router' import { MessagesModule } from 'primeng/messages' +import { AuthService } from '../auth.service' +import { DropdownModule } from 'primeng/dropdown' +import { PasswordModule } from 'primeng/password' +import { BrowserAnimationsModule } from '@angular/platform-browser/animations' describe('LoginScreenComponent', () => { let component: LoginScreenComponent let fixture: ComponentFixture + let authServiceStub: Partial beforeEach(waitForAsync(() => { + authServiceStub = { + getAuthenticationMethods: () => + of([ + { + id: 'localId', + name: 'local', + description: 'local description', + formLabelIdentifier: 'localLabelId', + formLabelSecret: 'localLabelSecret', + }, + { + id: 'ldapId', + name: 'ldap', + description: 'ldap description', + formLabelIdentifier: 'ldapLabelId', + formLabelSecret: 'ldapLabelSecret', + }, + ] as AuthenticationMethod[]), + login: () => ({ + id: 1, + authenticationMethodId: 'ldap', + }), + } TestBed.configureTestingModule({ imports: [ ReactiveFormsModule, @@ -28,9 +56,17 @@ describe('LoginScreenComponent', () => { SelectButtonModule, ButtonModule, MessagesModule, + DropdownModule, + PasswordModule, + BrowserAnimationsModule, ], declarations: [LoginScreenComponent], - providers: [GeneralService, UsersService, MessageService], + providers: [ + GeneralService, + UsersService, + MessageService, + { provide: AuthService, useValue: authServiceStub }, + ], }).compileComponents() })) @@ -64,4 +100,78 @@ describe('LoginScreenComponent', () => { const welcomeMessage = fixture.debugElement.query(By.css('.login-screen__welcome')) expect(welcomeMessage).toBeFalsy() })) + + it('should display authentication methods', fakeAsync(() => { + // Inject AuthService stub. + fixture.debugElement.injector.get(AuthService) + component.ngOnInit() + tick() + fixture.detectChanges() + + // Check if data was received from AuthService getAuthenticationMethods(). + expect(component.authenticationMethods).toBeTruthy() + expect(component.authenticationMethods.length).toEqual(2) + + // There should be a dropdown visible. + const dropdown = fixture.debugElement.query(By.css('.login-screen__authentication-selector .p-dropdown')) + expect(dropdown).toBeTruthy() + + dropdown.nativeElement.click() + fixture.detectChanges() + + // Dropdown should display two methods. + const listItems = dropdown.queryAll(By.css('.p-dropdown-panel li')) + expect(listItems).toBeTruthy() + expect(listItems.length).toEqual(2) + expect(listItems[0].nativeElement.innerText).toContain('local') + expect(listItems[1].nativeElement.innerText).toContain('ldap') + })) + + it('should try to sign-in user with selected authentication method', fakeAsync(() => { + // Inject AuthService stub and set spy. + const authService = fixture.debugElement.injector.get(AuthService) + const loginSpy = spyOn(authService, 'login').and.callThrough() + component.ngOnInit() + tick() + fixture.detectChanges() + + // There should be a dropdown visible. + const dropdown = fixture.debugElement.query(By.css('.login-screen__authentication-selector .p-dropdown')) + expect(dropdown).toBeTruthy() + + dropdown.nativeElement.click() + fixture.detectChanges() + + // Let's pick ldap method. + const listItems = dropdown.queryAll(By.css('li')) + expect(listItems).toBeTruthy() + expect(listItems.length).toEqual(2) + expect(listItems[0].nativeElement.innerText).toContain('local') + expect(listItems[1].nativeElement.innerText).toContain('ldap') + + listItems[1].nativeElement.click() + fixture.detectChanges() + + // Provide login and password. + const inputs = fixture.debugElement.queryAll(By.css('.login-screen__authentication-inputs input')) + expect(inputs).toBeTruthy() + expect(inputs.length).toEqual(2) + + inputs[0].nativeElement.value = 'login' + inputs[0].nativeElement.dispatchEvent(new Event('input')) + fixture.detectChanges() + + inputs[1].nativeElement.value = 'passwd' + inputs[1].nativeElement.dispatchEvent(new Event('input')) + fixture.detectChanges() + + // Click Sign In. + const btn = fixture.debugElement.query(By.css('.login-screen__authentication-inputs button')) + expect(btn).toBeTruthy() + btn.nativeElement.click() + fixture.detectChanges() + + // Check if AuthService login() was called with expected values. + expect(loginSpy).toHaveBeenCalledOnceWith('ldapId', 'login', 'passwd', '/') + })) })