mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-31 17:38:48 +00:00
#272 Improve 'login' tests
This commit is contained in:
Denys Vuika
@@ -20,6 +20,7 @@ import {
|
|||||||
describe,
|
describe,
|
||||||
expect,
|
expect,
|
||||||
inject,
|
inject,
|
||||||
|
beforeEach,
|
||||||
beforeEachProviders
|
beforeEachProviders
|
||||||
} from '@angular/core/testing';
|
} from '@angular/core/testing';
|
||||||
import { AlfrescoAuthenticationService } from 'ng2-alfresco-core';
|
import { AlfrescoAuthenticationService } from 'ng2-alfresco-core';
|
||||||
@@ -31,6 +32,9 @@ import { TranslationMock } from './../assets/translation.service.mock';
|
|||||||
|
|
||||||
describe('AlfrescoLogin', () => {
|
describe('AlfrescoLogin', () => {
|
||||||
|
|
||||||
|
let componentFixture;
|
||||||
|
let component;
|
||||||
|
|
||||||
beforeEachProviders(() => {
|
beforeEachProviders(() => {
|
||||||
return [
|
return [
|
||||||
{ provide: AlfrescoAuthenticationService, useClass: AuthenticationMock },
|
{ provide: AlfrescoAuthenticationService, useClass: AuthenticationMock },
|
||||||
@@ -38,491 +42,364 @@ describe('AlfrescoLogin', () => {
|
|||||||
];
|
];
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should render Login form with all the keys to be translated',
|
beforeEach(
|
||||||
inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
inject(
|
||||||
return tcb
|
[TestComponentBuilder],
|
||||||
.createAsync(AlfrescoLoginComponent)
|
(tcb: TestComponentBuilder) => {
|
||||||
.then((fixture) => {
|
return tcb
|
||||||
let component = fixture.componentInstance;
|
.createAsync(AlfrescoLoginComponent)
|
||||||
component.isErrorStyle = function () {
|
.then(fixture => {
|
||||||
console.log('mock');
|
componentFixture = fixture;
|
||||||
};
|
component = fixture.componentInstance;
|
||||||
|
});
|
||||||
fixture.detectChanges();
|
}
|
||||||
|
)
|
||||||
let element = fixture.nativeElement;
|
);
|
||||||
|
|
||||||
expect(element.querySelector('[for="username"]')).toBeDefined();
|
|
||||||
expect(element.querySelector('[for="username"]').innerText).toEqual('LOGIN.LABEL.USERNAME');
|
|
||||||
|
|
||||||
expect(element.querySelector('[for="password"]')).toBeDefined();
|
|
||||||
expect(element.querySelector('[for="password"]').innerText).toEqual('LOGIN.LABEL.PASSWORD');
|
|
||||||
|
|
||||||
expect(element.querySelector('#login-button')).toBeDefined();
|
|
||||||
expect(element.querySelector('#login-button').innerText).toEqual('LOGIN.BUTTON.LOGIN');
|
|
||||||
|
|
||||||
expect(element.querySelector('#login-remember')).toBeDefined();
|
|
||||||
expect(element.querySelector('#login-remember').innerText).toEqual('LOGIN.LABEL.REMEMBER');
|
|
||||||
|
|
||||||
expect(element.querySelector('#login-action-help')).toBeDefined();
|
|
||||||
expect(element.querySelector('#login-action-help').innerText).toEqual('LOGIN.ACTION.HELP');
|
|
||||||
|
|
||||||
expect(element.querySelector('#login-action-register')).toBeDefined();
|
|
||||||
expect(element.querySelector('#login-action-register').innerText).toEqual('LOGIN.ACTION.REGISTER');
|
|
||||||
|
|
||||||
});
|
|
||||||
}));
|
|
||||||
|
|
||||||
it('should render user and password input fields with default values',
|
it('should render Login form with all the keys to be translated', () => {
|
||||||
inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
componentFixture.detectChanges();
|
||||||
return tcb
|
|
||||||
.createAsync(AlfrescoLoginComponent)
|
|
||||||
.then((fixture) => {
|
|
||||||
let element = fixture.nativeElement;
|
|
||||||
expect(element.querySelector('form')).toBeDefined();
|
|
||||||
expect(element.querySelector('input[type="password"]')).toBeDefined();
|
|
||||||
expect(element.querySelector('input[type="text"]')).toBeDefined();
|
|
||||||
expect(element.querySelector('input[type="password"]').value).toEqual('');
|
|
||||||
expect(element.querySelector('input[type="text"]').value).toEqual('');
|
|
||||||
});
|
|
||||||
}));
|
|
||||||
|
|
||||||
it('should render validation min-length error when the username is lower than 4 characters',
|
|
||||||
inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
|
||||||
return tcb
|
|
||||||
.createAsync(AlfrescoLoginComponent)
|
|
||||||
.then((fixture) => {
|
|
||||||
let component = fixture.componentInstance;
|
|
||||||
component.isErrorStyle = function () {
|
|
||||||
console.log('mock');
|
|
||||||
};
|
|
||||||
|
|
||||||
let compiled = fixture.debugElement.nativeElement;
|
|
||||||
let usernameInput = compiled.querySelector('#username');
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
usernameInput.value = '123';
|
|
||||||
usernameInput.dispatchEvent(new Event('input'));
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
component.onValueChanged(null);
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
expect(component.formError).toBeDefined();
|
|
||||||
expect(component.formError.username).toBeDefined();
|
|
||||||
expect(component.formError.username).toEqual('LOGIN.MESSAGES.USERNAME-MIN');
|
|
||||||
expect(compiled.querySelector('#username-error')).toBeDefined();
|
|
||||||
expect(compiled.querySelector('#username-error').innerText).toEqual('LOGIN.MESSAGES.USERNAME-MIN');
|
|
||||||
});
|
|
||||||
}));
|
|
||||||
|
|
||||||
it('should render validation required error when the username is empty',
|
|
||||||
inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
|
||||||
return tcb
|
|
||||||
.createAsync(AlfrescoLoginComponent)
|
|
||||||
.then((fixture) => {
|
|
||||||
let component = fixture.componentInstance;
|
|
||||||
component.isErrorStyle = function () {
|
|
||||||
console.log('mock');
|
|
||||||
};
|
|
||||||
|
|
||||||
let compiled = fixture.debugElement.nativeElement;
|
|
||||||
let usernameInput = compiled.querySelector('#username');
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
usernameInput.value = '';
|
|
||||||
usernameInput.dispatchEvent(new Event('input'));
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
component.onValueChanged(null);
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
expect(component.formError).toBeDefined();
|
|
||||||
expect(component.formError.username).toBeDefined();
|
|
||||||
expect(component.formError.username).toEqual('LOGIN.MESSAGES.USERNAME-REQUIRED');
|
|
||||||
expect(compiled.querySelector('#username-error')).toBeDefined();
|
|
||||||
expect(compiled.querySelector('#username-error').innerText).toEqual('LOGIN.MESSAGES.USERNAME-REQUIRED');
|
|
||||||
});
|
|
||||||
}));
|
|
||||||
|
|
||||||
it('should render validation required error when the password is empty',
|
|
||||||
inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
|
||||||
return tcb
|
|
||||||
.createAsync(AlfrescoLoginComponent)
|
|
||||||
.then((fixture) => {
|
|
||||||
let component = fixture.componentInstance;
|
|
||||||
component.isErrorStyle = function () {
|
|
||||||
console.log('mock');
|
|
||||||
};
|
|
||||||
|
|
||||||
let compiled = fixture.debugElement.nativeElement;
|
|
||||||
let passwordInput = compiled.querySelector('#password');
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
passwordInput.value = '';
|
|
||||||
passwordInput.dispatchEvent(new Event('input'));
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
component.onValueChanged(null);
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
expect(component.formError).toBeDefined();
|
|
||||||
expect(component.formError.password).toBeDefined();
|
|
||||||
expect(component.formError.password).toEqual('LOGIN.MESSAGES.PASSWORD-REQUIRED');
|
|
||||||
expect(compiled.querySelector('#password-required')).toBeDefined();
|
|
||||||
expect(compiled.querySelector('#password-required').innerText).toEqual('LOGIN.MESSAGES.PASSWORD-REQUIRED');
|
|
||||||
});
|
|
||||||
}));
|
|
||||||
|
|
||||||
it('should render no validation errors when the username and password are filled',
|
|
||||||
inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
|
||||||
return tcb
|
|
||||||
.createAsync(AlfrescoLoginComponent)
|
|
||||||
.then((fixture) => {
|
|
||||||
let component = fixture.componentInstance;
|
|
||||||
component.isErrorStyle = function () {
|
|
||||||
console.log('mock');
|
|
||||||
};
|
|
||||||
|
|
||||||
let compiled = fixture.debugElement.nativeElement;
|
|
||||||
let usernameInput = compiled.querySelector('#username');
|
|
||||||
let passwordInput = compiled.querySelector('#password');
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
let element = componentFixture.nativeElement;
|
||||||
|
|
||||||
usernameInput.value = 'fake-username';
|
expect(element.querySelector('[for="username"]')).toBeDefined();
|
||||||
passwordInput.value = 'fake-password';
|
expect(element.querySelector('[for="username"]').innerText).toEqual('LOGIN.LABEL.USERNAME');
|
||||||
usernameInput.dispatchEvent(new Event('input'));
|
|
||||||
passwordInput.dispatchEvent(new Event('input'));
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
component.onValueChanged(null);
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
expect(component.formError).toBeDefined();
|
|
||||||
expect(component.formError.username).toEqual('');
|
|
||||||
expect(component.formError.password).toEqual('');
|
|
||||||
expect(compiled.querySelector('#username-error')).toBeNull();
|
|
||||||
expect(compiled.querySelector('#password-required')).toBeNull();
|
|
||||||
});
|
|
||||||
}));
|
|
||||||
|
|
||||||
it('should render the new values after user and password values are changed',
|
expect(element.querySelector('[for="password"]')).toBeDefined();
|
||||||
inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
expect(element.querySelector('[for="password"]').innerText).toEqual('LOGIN.LABEL.PASSWORD');
|
||||||
return tcb
|
|
||||||
.createAsync(AlfrescoLoginComponent)
|
|
||||||
.then((fixture) => {
|
|
||||||
let component = fixture.componentInstance;
|
|
||||||
component.isErrorStyle = function () {
|
|
||||||
console.log('mock');
|
|
||||||
};
|
|
||||||
|
|
||||||
let compiled = fixture.debugElement.nativeElement;
|
expect(element.querySelector('#login-button')).toBeDefined();
|
||||||
let usernameInput = compiled.querySelector('#username');
|
expect(element.querySelector('#login-button').innerText).toEqual('LOGIN.BUTTON.LOGIN');
|
||||||
let passwordInput = compiled.querySelector('#password');
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
usernameInput.value = 'fake-change-username';
|
|
||||||
passwordInput.value = 'fake-change-password';
|
|
||||||
usernameInput.dispatchEvent(new Event('input'));
|
|
||||||
passwordInput.dispatchEvent(new Event('input'));
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
component.onValueChanged(null);
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
expect(compiled.querySelector('input[type="text"]').value).toEqual('fake-change-username');
|
|
||||||
expect(compiled.querySelector('input[type="password"]').value).toEqual('fake-change-password');
|
|
||||||
});
|
|
||||||
}));
|
|
||||||
|
|
||||||
it('should return success true after the login have succeeded ',
|
|
||||||
inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
|
||||||
return tcb
|
|
||||||
.createAsync(AlfrescoLoginComponent)
|
|
||||||
.then((fixture) => {
|
|
||||||
let component = fixture.componentInstance;
|
|
||||||
component.isErrorStyle = function () {
|
|
||||||
console.log('mock');
|
|
||||||
};
|
|
||||||
|
|
||||||
expect(component.error).toBe(false);
|
expect(element.querySelector('#login-remember')).toBeDefined();
|
||||||
expect(component.success).toBe(false);
|
expect(element.querySelector('#login-remember').innerText).toEqual('LOGIN.LABEL.REMEMBER');
|
||||||
|
|
||||||
let compiled = fixture.debugElement.nativeElement;
|
expect(element.querySelector('#login-action-help')).toBeDefined();
|
||||||
let usernameInput = compiled.querySelector('#username');
|
expect(element.querySelector('#login-action-help').innerText).toEqual('LOGIN.ACTION.HELP');
|
||||||
let passwordInput = compiled.querySelector('#password');
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
usernameInput.value = 'fake-username';
|
|
||||||
passwordInput.value = 'fake-password';
|
|
||||||
usernameInput.dispatchEvent(new Event('input'));
|
|
||||||
passwordInput.dispatchEvent(new Event('input'));
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
component.onValueChanged(null);
|
|
||||||
compiled.querySelector('button').click();
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
expect(component.error).toBe(false);
|
|
||||||
expect(component.success).toBe(true);
|
|
||||||
});
|
|
||||||
}));
|
|
||||||
|
|
||||||
it('should return error with a wrong username ',
|
|
||||||
inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
|
||||||
return tcb
|
|
||||||
.createAsync(AlfrescoLoginComponent)
|
|
||||||
.then((fixture) => {
|
|
||||||
let component = fixture.componentInstance;
|
|
||||||
component.isErrorStyle = function () {
|
|
||||||
console.log('mock');
|
|
||||||
};
|
|
||||||
|
|
||||||
expect(component.error).toBe(false);
|
expect(element.querySelector('#login-action-register')).toBeDefined();
|
||||||
expect(component.success).toBe(false);
|
expect(element.querySelector('#login-action-register').innerText).toEqual('LOGIN.ACTION.REGISTER');
|
||||||
|
});
|
||||||
let compiled = fixture.debugElement.nativeElement;
|
|
||||||
let usernameInput = compiled.querySelector('#username');
|
|
||||||
let passwordInput = compiled.querySelector('#password');
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
it('should render user and password input fields with default values', () => {
|
||||||
|
let element = componentFixture.nativeElement;
|
||||||
usernameInput.value = 'fake-wrong-username';
|
expect(element.querySelector('form')).toBeDefined();
|
||||||
passwordInput.value = 'fake-password';
|
expect(element.querySelector('input[type="password"]')).toBeDefined();
|
||||||
usernameInput.dispatchEvent(new Event('input'));
|
expect(element.querySelector('input[type="text"]')).toBeDefined();
|
||||||
passwordInput.dispatchEvent(new Event('input'));
|
expect(element.querySelector('input[type="password"]').value).toEqual('');
|
||||||
|
expect(element.querySelector('input[type="text"]').value).toEqual('');
|
||||||
fixture.detectChanges();
|
});
|
||||||
|
|
||||||
component.onValueChanged(null);
|
|
||||||
compiled.querySelector('button').click();
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
expect(component.error).toBe(true);
|
|
||||||
expect(component.success).toBe(false);
|
|
||||||
expect(compiled.querySelector('#login-error')).toBeDefined();
|
|
||||||
expect(compiled.querySelector('#login-error').innerText).toEqual('LOGIN.MESSAGES.LOGIN-ERROR');
|
|
||||||
});
|
|
||||||
}));
|
|
||||||
|
|
||||||
it('should return error with a wrong password ',
|
it('should render validation min-length error when the username is lower than 4 characters', () => {
|
||||||
inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
let compiled = componentFixture.debugElement.nativeElement;
|
||||||
return tcb
|
let usernameInput = compiled.querySelector('#username');
|
||||||
.createAsync(AlfrescoLoginComponent)
|
|
||||||
.then((fixture) => {
|
|
||||||
let component = fixture.componentInstance;
|
|
||||||
component.isErrorStyle = function () {
|
|
||||||
console.log('mock');
|
|
||||||
};
|
|
||||||
|
|
||||||
expect(component.success).toBe(false);
|
componentFixture.detectChanges();
|
||||||
expect(component.error).toBe(false);
|
|
||||||
|
|
||||||
let compiled = fixture.debugElement.nativeElement;
|
usernameInput.value = '123';
|
||||||
let usernameInput = compiled.querySelector('#username');
|
usernameInput.dispatchEvent(new Event('input'));
|
||||||
let passwordInput = compiled.querySelector('#password');
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
usernameInput.value = 'fake-username';
|
component.onValueChanged(null);
|
||||||
passwordInput.value = 'fake-wrong-password';
|
|
||||||
usernameInput.dispatchEvent(new Event('input'));
|
|
||||||
passwordInput.dispatchEvent(new Event('input'));
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
component.onValueChanged(null);
|
|
||||||
compiled.querySelector('button').click();
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
expect(component.error).toBe(true);
|
|
||||||
expect(component.success).toBe(false);
|
|
||||||
expect(compiled.querySelector('#login-error')).toBeDefined();
|
|
||||||
expect(compiled.querySelector('#login-error').innerText).toEqual('LOGIN.MESSAGES.LOGIN-ERROR');
|
|
||||||
});
|
|
||||||
}));
|
|
||||||
|
|
||||||
it('should return error with a wrong username and password ',
|
componentFixture.detectChanges();
|
||||||
inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
|
||||||
return tcb
|
|
||||||
.createAsync(AlfrescoLoginComponent)
|
|
||||||
.then((fixture) => {
|
|
||||||
let component = fixture.componentInstance;
|
|
||||||
component.isErrorStyle = function () {
|
|
||||||
console.log('mock');
|
|
||||||
};
|
|
||||||
|
|
||||||
expect(component.success).toBe(false);
|
expect(component.formError).toBeDefined();
|
||||||
expect(component.error).toBe(false);
|
expect(component.formError.username).toBeDefined();
|
||||||
|
expect(component.formError.username).toEqual('LOGIN.MESSAGES.USERNAME-MIN');
|
||||||
|
expect(compiled.querySelector('#username-error')).toBeDefined();
|
||||||
|
expect(compiled.querySelector('#username-error').innerText).toEqual('LOGIN.MESSAGES.USERNAME-MIN');
|
||||||
|
});
|
||||||
|
|
||||||
let compiled = fixture.debugElement.nativeElement;
|
it('should render validation required error when the username is empty', () => {
|
||||||
let usernameInput = compiled.querySelector('#username');
|
let compiled = componentFixture.debugElement.nativeElement;
|
||||||
let passwordInput = compiled.querySelector('#password');
|
let usernameInput = compiled.querySelector('#username');
|
||||||
|
|
||||||
fixture.detectChanges();
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
usernameInput.value = 'fake-wrong-username';
|
|
||||||
passwordInput.value = 'fake-wrong-password';
|
|
||||||
usernameInput.dispatchEvent(new Event('input'));
|
|
||||||
passwordInput.dispatchEvent(new Event('input'));
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
component.onValueChanged(null);
|
|
||||||
compiled.querySelector('button').click();
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
expect(component.error).toBe(true);
|
usernameInput.value = '';
|
||||||
expect(component.success).toBe(false);
|
usernameInput.dispatchEvent(new Event('input'));
|
||||||
expect(compiled.querySelector('#login-error')).toBeDefined();
|
|
||||||
expect(compiled.querySelector('#login-error').innerText).toEqual('LOGIN.MESSAGES.LOGIN-ERROR');
|
|
||||||
});
|
|
||||||
}));
|
|
||||||
|
|
||||||
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
it('should emit onSuccess event after the login has succeeded',
|
component.onValueChanged(null);
|
||||||
inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
|
||||||
return tcb
|
|
||||||
.createAsync(AlfrescoLoginComponent)
|
|
||||||
.then((fixture) => {
|
|
||||||
let component = fixture.componentInstance;
|
|
||||||
component.isErrorStyle = function () {
|
|
||||||
console.log('mock');
|
|
||||||
};
|
|
||||||
|
|
||||||
spyOn(component.onSuccess, 'emit');
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
expect(component.error).toBe(false);
|
expect(component.formError).toBeDefined();
|
||||||
expect(component.success).toBe(false);
|
expect(component.formError.username).toBeDefined();
|
||||||
|
expect(component.formError.username).toEqual('LOGIN.MESSAGES.USERNAME-REQUIRED');
|
||||||
|
expect(compiled.querySelector('#username-error')).toBeDefined();
|
||||||
|
expect(compiled.querySelector('#username-error').innerText).toEqual('LOGIN.MESSAGES.USERNAME-REQUIRED');
|
||||||
|
});
|
||||||
|
|
||||||
let compiled = fixture.debugElement.nativeElement;
|
it('should render validation required error when the password is empty', () => {
|
||||||
let usernameInput = compiled.querySelector('#username');
|
let compiled = componentFixture.debugElement.nativeElement;
|
||||||
let passwordInput = compiled.querySelector('#password');
|
let passwordInput = compiled.querySelector('#password');
|
||||||
|
|
||||||
fixture.detectChanges();
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
usernameInput.value = 'fake-username';
|
passwordInput.value = '';
|
||||||
passwordInput.value = 'fake-password';
|
passwordInput.dispatchEvent(new Event('input'));
|
||||||
usernameInput.dispatchEvent(new Event('input'));
|
|
||||||
passwordInput.dispatchEvent(new Event('input'));
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
component.onValueChanged(null);
|
component.onValueChanged(null);
|
||||||
compiled.querySelector('button').click();
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
expect(component.error).toBe(false);
|
expect(component.formError).toBeDefined();
|
||||||
expect(component.success).toBe(true);
|
expect(component.formError.password).toBeDefined();
|
||||||
expect(compiled.querySelector('#login-success')).toBeDefined();
|
expect(component.formError.password).toEqual('LOGIN.MESSAGES.PASSWORD-REQUIRED');
|
||||||
expect(compiled.querySelector('#login-success').innerHTML).toEqual('LOGIN.MESSAGES.LOGIN-SUCCESS');
|
expect(compiled.querySelector('#password-required')).toBeDefined();
|
||||||
expect(component.onSuccess.emit).toHaveBeenCalledWith({value: 'Login OK'});
|
expect(compiled.querySelector('#password-required').innerText).toEqual('LOGIN.MESSAGES.PASSWORD-REQUIRED');
|
||||||
});
|
});
|
||||||
}));
|
|
||||||
|
|
||||||
it('should emit onError event after the login has failed',
|
it('should render no validation errors when the username and password are filled', () => {
|
||||||
inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
let compiled = componentFixture.debugElement.nativeElement;
|
||||||
return tcb
|
let usernameInput = compiled.querySelector('#username');
|
||||||
.createAsync(AlfrescoLoginComponent)
|
let passwordInput = compiled.querySelector('#password');
|
||||||
.then((fixture) => {
|
|
||||||
let component = fixture.componentInstance;
|
|
||||||
component.isErrorStyle = function () {
|
|
||||||
console.log('mock');
|
|
||||||
};
|
|
||||||
|
|
||||||
spyOn(component.onError, 'emit');
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
expect(component.success).toBe(false);
|
usernameInput.value = 'fake-username';
|
||||||
expect(component.error).toBe(false);
|
passwordInput.value = 'fake-password';
|
||||||
|
usernameInput.dispatchEvent(new Event('input'));
|
||||||
|
passwordInput.dispatchEvent(new Event('input'));
|
||||||
|
|
||||||
let compiled = fixture.debugElement.nativeElement;
|
componentFixture.detectChanges();
|
||||||
let usernameInput = compiled.querySelector('#username');
|
|
||||||
let passwordInput = compiled.querySelector('#password');
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
component.onValueChanged(null);
|
||||||
|
|
||||||
usernameInput.value = 'fake-username';
|
componentFixture.detectChanges();
|
||||||
passwordInput.value = 'fake-wrong-password';
|
|
||||||
usernameInput.dispatchEvent(new Event('input'));
|
|
||||||
passwordInput.dispatchEvent(new Event('input'));
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
expect(component.formError).toBeDefined();
|
||||||
|
expect(component.formError.username).toEqual('');
|
||||||
|
expect(component.formError.password).toEqual('');
|
||||||
|
expect(compiled.querySelector('#username-error')).toBeNull();
|
||||||
|
expect(compiled.querySelector('#password-required')).toBeNull();
|
||||||
|
});
|
||||||
|
|
||||||
component.onValueChanged(null);
|
it('should render the new values after user and password values are changed', () => {
|
||||||
compiled.querySelector('button').click();
|
let compiled = componentFixture.debugElement.nativeElement;
|
||||||
|
let usernameInput = compiled.querySelector('#username');
|
||||||
|
let passwordInput = compiled.querySelector('#password');
|
||||||
|
|
||||||
fixture.detectChanges();
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
expect(component.error).toBe(true);
|
usernameInput.value = 'fake-change-username';
|
||||||
expect(component.success).toBe(false);
|
passwordInput.value = 'fake-change-password';
|
||||||
expect(compiled.querySelector('#login-error')).toBeDefined();
|
usernameInput.dispatchEvent(new Event('input'));
|
||||||
expect(compiled.querySelector('#login-error').innerText).toEqual('LOGIN.MESSAGES.LOGIN-ERROR');
|
passwordInput.dispatchEvent(new Event('input'));
|
||||||
expect(component.onError.emit).toHaveBeenCalledWith({value: 'Login KO'});
|
|
||||||
});
|
|
||||||
}));
|
|
||||||
|
|
||||||
it('should render the password in clear when the toggleShowPassword is call',
|
componentFixture.detectChanges();
|
||||||
inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
|
||||||
return tcb
|
|
||||||
.createAsync(AlfrescoLoginComponent)
|
|
||||||
.then((fixture) => {
|
|
||||||
let component = fixture.componentInstance;
|
|
||||||
|
|
||||||
let compiled = fixture.debugElement.nativeElement;
|
component.onValueChanged(null);
|
||||||
|
|
||||||
fixture.detectChanges();
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
component.isPasswordShow = false;
|
expect(compiled.querySelector('input[type="text"]').value).toEqual('fake-change-username');
|
||||||
component.toggleShowPassword();
|
expect(compiled.querySelector('input[type="password"]').value).toEqual('fake-change-password');
|
||||||
|
});
|
||||||
|
|
||||||
fixture.detectChanges();
|
it('should return success true after the login have succeeded', () => {
|
||||||
|
expect(component.error).toBe(false);
|
||||||
|
expect(component.success).toBe(false);
|
||||||
|
|
||||||
expect(component.isPasswordShow).toBe(true);
|
let compiled = componentFixture.debugElement.nativeElement;
|
||||||
expect(compiled.querySelector('#password').type).toEqual('text');
|
let usernameInput = compiled.querySelector('#username');
|
||||||
});
|
let passwordInput = compiled.querySelector('#password');
|
||||||
}));
|
|
||||||
|
|
||||||
it('should render the hide password when the password is in clear and the toggleShowPassword is call',
|
componentFixture.detectChanges();
|
||||||
inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
|
||||||
return tcb
|
|
||||||
.createAsync(AlfrescoLoginComponent)
|
|
||||||
.then((fixture) => {
|
|
||||||
let component = fixture.componentInstance;
|
|
||||||
|
|
||||||
let compiled = fixture.debugElement.nativeElement;
|
usernameInput.value = 'fake-username';
|
||||||
|
passwordInput.value = 'fake-password';
|
||||||
|
usernameInput.dispatchEvent(new Event('input'));
|
||||||
|
passwordInput.dispatchEvent(new Event('input'));
|
||||||
|
|
||||||
fixture.detectChanges();
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
component.isPasswordShow = true;
|
component.onValueChanged(null);
|
||||||
component.toggleShowPassword();
|
compiled.querySelector('button').click();
|
||||||
|
|
||||||
fixture.detectChanges();
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
expect(component.isPasswordShow).toBe(false);
|
expect(component.error).toBe(false);
|
||||||
expect(compiled.querySelector('#password').type).toEqual('password');
|
expect(component.success).toBe(true);
|
||||||
});
|
});
|
||||||
}));
|
|
||||||
|
it('should return error with a wrong username', () => {
|
||||||
|
expect(component.error).toBe(false);
|
||||||
|
expect(component.success).toBe(false);
|
||||||
|
|
||||||
|
let compiled = componentFixture.debugElement.nativeElement;
|
||||||
|
let usernameInput = compiled.querySelector('#username');
|
||||||
|
let passwordInput = compiled.querySelector('#password');
|
||||||
|
|
||||||
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
|
usernameInput.value = 'fake-wrong-username';
|
||||||
|
passwordInput.value = 'fake-password';
|
||||||
|
usernameInput.dispatchEvent(new Event('input'));
|
||||||
|
passwordInput.dispatchEvent(new Event('input'));
|
||||||
|
|
||||||
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
|
component.onValueChanged(null);
|
||||||
|
compiled.querySelector('button').click();
|
||||||
|
|
||||||
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
|
expect(component.error).toBe(true);
|
||||||
|
expect(component.success).toBe(false);
|
||||||
|
expect(compiled.querySelector('#login-error')).toBeDefined();
|
||||||
|
expect(compiled.querySelector('#login-error').innerText).toEqual('LOGIN.MESSAGES.LOGIN-ERROR');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should return error with a wrong password', () => {
|
||||||
|
expect(component.success).toBe(false);
|
||||||
|
expect(component.error).toBe(false);
|
||||||
|
|
||||||
|
let compiled = componentFixture.debugElement.nativeElement;
|
||||||
|
let usernameInput = compiled.querySelector('#username');
|
||||||
|
let passwordInput = compiled.querySelector('#password');
|
||||||
|
|
||||||
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
|
usernameInput.value = 'fake-username';
|
||||||
|
passwordInput.value = 'fake-wrong-password';
|
||||||
|
usernameInput.dispatchEvent(new Event('input'));
|
||||||
|
passwordInput.dispatchEvent(new Event('input'));
|
||||||
|
|
||||||
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
|
component.onValueChanged(null);
|
||||||
|
compiled.querySelector('button').click();
|
||||||
|
|
||||||
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
|
expect(component.error).toBe(true);
|
||||||
|
expect(component.success).toBe(false);
|
||||||
|
expect(compiled.querySelector('#login-error')).toBeDefined();
|
||||||
|
expect(compiled.querySelector('#login-error').innerText).toEqual('LOGIN.MESSAGES.LOGIN-ERROR');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should return error with a wrong username and password', () => {
|
||||||
|
expect(component.success).toBe(false);
|
||||||
|
expect(component.error).toBe(false);
|
||||||
|
|
||||||
|
let compiled = componentFixture.debugElement.nativeElement;
|
||||||
|
let usernameInput = compiled.querySelector('#username');
|
||||||
|
let passwordInput = compiled.querySelector('#password');
|
||||||
|
|
||||||
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
|
usernameInput.value = 'fake-wrong-username';
|
||||||
|
passwordInput.value = 'fake-wrong-password';
|
||||||
|
usernameInput.dispatchEvent(new Event('input'));
|
||||||
|
passwordInput.dispatchEvent(new Event('input'));
|
||||||
|
|
||||||
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
|
component.onValueChanged(null);
|
||||||
|
compiled.querySelector('button').click();
|
||||||
|
|
||||||
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
|
expect(component.error).toBe(true);
|
||||||
|
expect(component.success).toBe(false);
|
||||||
|
expect(compiled.querySelector('#login-error')).toBeDefined();
|
||||||
|
expect(compiled.querySelector('#login-error').innerText).toEqual('LOGIN.MESSAGES.LOGIN-ERROR');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should emit onSuccess event after the login has succeeded', () => {
|
||||||
|
spyOn(component.onSuccess, 'emit');
|
||||||
|
|
||||||
|
expect(component.error).toBe(false);
|
||||||
|
expect(component.success).toBe(false);
|
||||||
|
|
||||||
|
let compiled = componentFixture.debugElement.nativeElement;
|
||||||
|
let usernameInput = compiled.querySelector('#username');
|
||||||
|
let passwordInput = compiled.querySelector('#password');
|
||||||
|
|
||||||
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
|
usernameInput.value = 'fake-username';
|
||||||
|
passwordInput.value = 'fake-password';
|
||||||
|
usernameInput.dispatchEvent(new Event('input'));
|
||||||
|
passwordInput.dispatchEvent(new Event('input'));
|
||||||
|
|
||||||
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
|
component.onValueChanged(null);
|
||||||
|
compiled.querySelector('button').click();
|
||||||
|
|
||||||
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
|
expect(component.error).toBe(false);
|
||||||
|
expect(component.success).toBe(true);
|
||||||
|
expect(compiled.querySelector('#login-success')).toBeDefined();
|
||||||
|
expect(compiled.querySelector('#login-success').innerHTML).toEqual('LOGIN.MESSAGES.LOGIN-SUCCESS');
|
||||||
|
expect(component.onSuccess.emit).toHaveBeenCalledWith({value: 'Login OK'});
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should emit onError event after the login has failed', () => {
|
||||||
|
spyOn(component.onError, 'emit');
|
||||||
|
|
||||||
|
expect(component.success).toBe(false);
|
||||||
|
expect(component.error).toBe(false);
|
||||||
|
|
||||||
|
let compiled = componentFixture.debugElement.nativeElement;
|
||||||
|
let usernameInput = compiled.querySelector('#username');
|
||||||
|
let passwordInput = compiled.querySelector('#password');
|
||||||
|
|
||||||
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
|
usernameInput.value = 'fake-username';
|
||||||
|
passwordInput.value = 'fake-wrong-password';
|
||||||
|
usernameInput.dispatchEvent(new Event('input'));
|
||||||
|
passwordInput.dispatchEvent(new Event('input'));
|
||||||
|
|
||||||
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
|
component.onValueChanged(null);
|
||||||
|
compiled.querySelector('button').click();
|
||||||
|
|
||||||
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
|
expect(component.error).toBe(true);
|
||||||
|
expect(component.success).toBe(false);
|
||||||
|
expect(compiled.querySelector('#login-error')).toBeDefined();
|
||||||
|
expect(compiled.querySelector('#login-error').innerText).toEqual('LOGIN.MESSAGES.LOGIN-ERROR');
|
||||||
|
expect(component.onError.emit).toHaveBeenCalledWith({value: 'Login KO'});
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should render the password in clear when the toggleShowPassword is call', () => {
|
||||||
|
let compiled = componentFixture.debugElement.nativeElement;
|
||||||
|
|
||||||
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
|
component.isPasswordShow = false;
|
||||||
|
component.toggleShowPassword();
|
||||||
|
|
||||||
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
|
expect(component.isPasswordShow).toBe(true);
|
||||||
|
expect(compiled.querySelector('#password').type).toEqual('text');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should render the hide password when the password is in clear and the toggleShowPassword is call', () => {
|
||||||
|
let compiled = componentFixture.debugElement.nativeElement;
|
||||||
|
|
||||||
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
|
component.isPasswordShow = true;
|
||||||
|
component.toggleShowPassword();
|
||||||
|
|
||||||
|
componentFixture.detectChanges();
|
||||||
|
|
||||||
|
expect(component.isPasswordShow).toBe(false);
|
||||||
|
expect(compiled.querySelector('#password').type).toEqual('password');
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user