Add tests for password recovery

This commit is contained in:
Ivan Diaz 2018-08-15 23:42:28 -03:00
parent f052e7a568
commit 2838a76438
5 changed files with 19 additions and 120 deletions

View File

@ -1,7 +1,9 @@
const sessionStoreMock = require('lib-app/__mocks__/session-store-mock');
const APICallMock = require('lib-app/__mocks__/api-call-mock');
const storeMock = {
dispatch: stub()
dispatch: stub().returns({
then: stub()
})
};
const SessionActions = requireUnit('actions/session-actions', {
@ -158,4 +160,4 @@ describe('Session Actions,', function () {
expect(storeMock.dispatch).to.have.been.calledWith(SessionActions.autoLogin());
});
});
});
});

View File

@ -1,91 +0,0 @@
const APICallMock = require('lib-app/__mocks__/api-call-mock');
const SubmitButton = ReactMock();
const Button = ReactMock();
const Input = ReactMock();
const Form = ReactMock();
const Checkbox = ReactMock();
const Message = ReactMock();
const FormField = ReactMock();
const Widget = ReactMock();
const PasswordRecovery = requireUnit('app-components/password-recovery', {
'lib-app/api-call': APICallMock,
'core-components/submit-button': SubmitButton,
'core-components/button': Button,
'core-components/form-field': FormField,
'core-components/': FormField,
'core-components/form': Form,
'core-components/checkbox': Checkbox,
'core-components/message': Message,
'core-components/widget': Widget,
});
describe('PasswordRecovery component', function () {
let recoverWidget, recoverForm, widgetTransition, emailInput, component,
backToLoginButton, submitButton;
let dispatch = stub();
beforeEach(function () {
component = TestUtils.renderIntoDocument(
<PasswordRecovery />
);
recoverWidget = TestUtils.scryRenderedComponentsWithType(component, Widget)[0];
recoverForm = TestUtils.scryRenderedComponentsWithType(component, Form)[0];
emailInput = TestUtils.scryRenderedComponentsWithType(component, Input)[0];
submitButton = TestUtils.scryRenderedComponentsWithType(component, SubmitButton)[0];
backToLoginButton = TestUtils.scryRenderedComponentsWithType(component, Button)[0];
});
it('should control form errors by prop', function () {
expect(recoverForm.props.errors).to.deep.equal({});
recoverForm.props.onValidateErrors({email: 'MOCK_ERROR'});
expect(recoverForm.props.errors).to.deep.equal({email: 'MOCK_ERROR'});
});
it('should call sendRecoverPassword when submitted', function () {
let mockSubmitData = {email: 'MOCK_VALUE'};
APICallMock.call.reset();
recoverForm.props.onSubmit(mockSubmitData);
expect(APICallMock.call).to.have.been.calledWith({
path: '/user/send-recover-password',
data: mockSubmitData
});
});
it('should set loading true in the form when submitted', function () {
let mockSubmitData = {email: 'MOCK_VALUE'};
recoverForm.props.onSubmit(mockSubmitData);
expect(recoverForm.props.loading).to.equal(true);
});
it('should add error and stop loading when send recover fails', function () {
component.refs.recoverForm.refs.email.focus.reset();
component.onRecoverPasswordFail();
expect(recoverForm.props.errors).to.deep.equal({email: 'EMAIL_NOT_EXIST'});
expect(recoverForm.props.loading).to.equal(false);
expect(component.refs.recoverForm.refs.email.focus).to.have.been.called;
});
it('should show message when send recover success', function () {
let message = TestUtils.scryRenderedComponentsWithType(component, Message)[0];
expect(message).to.equal(undefined);
component.onRecoverPasswordSent();
message = TestUtils.scryRenderedComponentsWithType(component, Message)[0];
expect(recoverForm.props.loading).to.equal(false);
expect(message).to.not.equal(null);
expect(message.props.type).to.equal('info');
expect(message.props.children).to.equal('RECOVER_SENT');
});
it('should show front side if \'Back to login form\' link is clicked', function () {
backToLoginButton.props.onClick();
expect(widgetTransition.props.sideToShow).to.equal('front');
});
});

View File

@ -31,7 +31,7 @@ class PasswordRecovery extends React.Component {
{this.renderLogo()}
<Form {...formProps}>
<div className="password-recovery__inputs">
<FormField placeholder={i18n('EMAIL_LOWERCASE')} name="email" className="password-recovery__input" validation="EMAIL" required/>
<FormField ref="email" placeholder={i18n('EMAIL_LOWERCASE')} name="email" className="password-recovery__input" validation="EMAIL" required/>
</div>
<div className="password-recovery__submit-button">
<SubmitButton type="primary">{i18n('RECOVER_PASSWORD')}</SubmitButton>
@ -75,6 +75,10 @@ class PasswordRecovery extends React.Component {
return status;
}
focusEmail() {
this.refs.email.focus();
}
}
export default PasswordRecovery;

View File

@ -9,7 +9,7 @@ const Checkbox = ReactMock();
const Message = ReactMock();
const Widget = ReactMock();
const WidgetTransition = ReactMock();
const PasswordRecovery = ReactMock();
const PasswordRecovery = ReactMock({ focusEmail: stub() });
const MainHomePageLoginWidget = requireUnit('app/main/main-home/main-home-page-login-widget', {
'react-redux': ReduxMock,
@ -35,7 +35,6 @@ describe('Login/Recover Widget', function () {
let dispatch = stub();
function renderComponent(props = {session: {pending: false, failed: false}}) {
component = reRenderIntoDocument(
<MainHomePageLoginWidget dispatch={dispatch} {...props}/>
);
@ -54,6 +53,9 @@ describe('Login/Recover Widget', function () {
}
}
};
component.refs.passwordRecovery = {
focusEmail: stub()
};
}
beforeEach(renderComponent);
@ -142,33 +144,17 @@ describe('Login/Recover Widget', function () {
let mockSubmitData = {email: 'MOCK_VALUE'};
recoverPassword.props.formProps.onSubmit(mockSubmitData);
expect(recoverForm.props.formProps.loading).to.equal(true);
expect(recoverPassword.props.formProps.loading).to.equal(true);
});
it('should add error and stop loading when send recover fails', function () {
component.refs.recoverPassword.refs.email.focus.reset();
component.onRecoverPasswordFail();
expect(recoverForm.props.errors).to.deep.equal({email: 'EMAIL_NOT_EXIST'});
expect(recoverForm.props.loading).to.equal(false);
expect(component.refs.recoverForm.refs.email.focus).to.have.been.called;
});
it('should show message when send recover success', function () {
let message = TestUtils.scryRenderedComponentsWithType(component, Message)[0];
expect(message).to.equal(undefined);
component.onRecoverPasswordSent();
message = TestUtils.scryRenderedComponentsWithType(component, Message)[0];
expect(recoverForm.props.loading).to.equal(false);
expect(message).to.not.equal(null);
expect(message.props.type).to.equal('info');
expect(message.props.children).to.equal('RECOVER_SENT');
expect(recoverPassword.props.formProps.errors).to.deep.equal({email: 'EMAIL_NOT_EXIST'});
expect(recoverPassword.props.formProps.loading).to.equal(false);
});
it('should show front side if \'Back to login form\' link is clicked', function () {
backToLoginButton.props.onClick();
component.onBackToLoginClick();
expect(widgetTransition.props.sideToShow).to.equal('front');
});
});

View File

@ -66,7 +66,7 @@ class MainHomePageLoginWidget extends React.Component {
renderPasswordRecovery() {
return (
<PasswordRecovery recoverSent={this.state.recoverSent} formProps={this.getRecoverFormProps()} onBackToLoginClick={this.onBackToLoginClick.bind(this)}/>
<PasswordRecovery ref="passwordRecovery" recoverSent={this.state.recoverSent} formProps={this.getRecoverFormProps()} onBackToLoginClick={this.onBackToLoginClick.bind(this)}/>
);
}
@ -174,9 +174,7 @@ class MainHomePageLoginWidget extends React.Component {
recoverFormErrors: {
email: i18n('EMAIL_NOT_EXIST')
}
}, function () {
this.refs.recoverForm.refs.email.focus();
}.bind(this));
}, () => this.refs.passwordRecovery.focusEmail());
}
}