removed stray onCaptchaError from bind list

This commit is contained in:
Ben Wheeler 2019-10-23 15:33:31 -04:00
parent f713298d37
commit 510906e538
2 changed files with 51 additions and 66 deletions

View file

@ -25,8 +25,7 @@ class EmailStep extends React.Component {
'validateForm', 'validateForm',
'setCaptchaRef', 'setCaptchaRef',
'captchaSolved', 'captchaSolved',
'onCaptchaLoad', 'onCaptchaLoad'
'onCaptchaError'
]); ]);
this.state = { this.state = {
captchaIsLoading: true captchaIsLoading: true

View file

@ -26,23 +26,23 @@ describe('EmailStep test', () => {
}); });
test('send correct props to formik', () => { test('send correct props to formik', () => {
const wrapper = shallowWithIntl(<EmailStep />); const intlWrapper = shallowWithIntl(<EmailStep />);
const formikWrapper = wrapper.dive(); const emailStepWrapper = intlWrapper.dive();
expect(formikWrapper.props().initialValues.subscribe).toBe(false); expect(emailStepWrapper.props().initialValues.subscribe).toBe(false);
expect(formikWrapper.props().initialValues.email).toBe(''); expect(emailStepWrapper.props().initialValues.email).toBe('');
expect(formikWrapper.props().validateOnBlur).toBe(false); expect(emailStepWrapper.props().validateOnBlur).toBe(false);
expect(formikWrapper.props().validateOnChange).toBe(false); expect(emailStepWrapper.props().validateOnChange).toBe(false);
expect(formikWrapper.props().validate).toBe(formikWrapper.instance().validateForm); expect(emailStepWrapper.props().validate).toBe(emailStepWrapper.instance().validateForm);
expect(formikWrapper.props().onSubmit).toBe(formikWrapper.instance().handleValidSubmit); expect(emailStepWrapper.props().onSubmit).toBe(emailStepWrapper.instance().handleValidSubmit);
}); });
test('props sent to JoinFlowStep', () => { test('props sent to JoinFlowStep', () => {
const wrapper = shallowWithIntl(<EmailStep />); const intlWrapper = shallowWithIntl(<EmailStep />);
// Dive to get past the intl wrapper // Dive to get past the intl wrapper
const formikWrapper = wrapper.dive(); const emailStepWrapper = intlWrapper.dive();
// Dive to get past the anonymous component. // Dive to get past the anonymous component.
const joinFlowWrapper = formikWrapper.dive().find(JoinFlowStep); const joinFlowWrapper = emailStepWrapper.dive().find(JoinFlowStep);
expect(joinFlowWrapper).toHaveLength(1); expect(joinFlowWrapper).toHaveLength(1);
expect(joinFlowWrapper.props().footerContent.props.id).toBe('registration.acceptTermsOfUse'); expect(joinFlowWrapper.props().footerContent.props.id).toBe('registration.acceptTermsOfUse');
expect(joinFlowWrapper.props().headerImgSrc).toBe('/images/join-flow/email-header.png'); expect(joinFlowWrapper.props().headerImgSrc).toBe('/images/join-flow/email-header.png');
@ -54,11 +54,11 @@ describe('EmailStep test', () => {
}); });
test('props sent to FormikInput for email', () => { test('props sent to FormikInput for email', () => {
const wrapper = shallowWithIntl(<EmailStep />); const intlWrapper = shallowWithIntl(<EmailStep />);
// Dive to get past the intl wrapper // Dive to get past the intl wrapper
const formikWrapper = wrapper.dive(); const emailStepWrapper = intlWrapper.dive();
// Dive to get past the anonymous component. // Dive to get past the anonymous component.
const joinFlowWrapper = formikWrapper.dive().find(JoinFlowStep); const joinFlowWrapper = emailStepWrapper.dive().find(JoinFlowStep);
expect(joinFlowWrapper).toHaveLength(1); expect(joinFlowWrapper).toHaveLength(1);
const emailInputWrapper = joinFlowWrapper.find(FormikInput).first(); const emailInputWrapper = joinFlowWrapper.find(FormikInput).first();
expect(emailInputWrapper.props().id).toEqual('email'); expect(emailInputWrapper.props().id).toEqual('email');
@ -66,16 +66,16 @@ describe('EmailStep test', () => {
expect(emailInputWrapper.props().name).toEqual('email'); expect(emailInputWrapper.props().name).toEqual('email');
expect(emailInputWrapper.props().placeholder).toEqual('general.emailAddress'); expect(emailInputWrapper.props().placeholder).toEqual('general.emailAddress');
expect(emailInputWrapper.props().validationClassName).toEqual('validation-full-width-input'); expect(emailInputWrapper.props().validationClassName).toEqual('validation-full-width-input');
expect(emailInputWrapper.props().onSetRef).toEqual(formikWrapper.instance().handleSetEmailRef); expect(emailInputWrapper.props().onSetRef).toEqual(emailStepWrapper.instance().handleSetEmailRef);
expect(emailInputWrapper.props().validate).toEqual(formikWrapper.instance().validateEmail); expect(emailInputWrapper.props().validate).toEqual(emailStepWrapper.instance().validateEmail);
}); });
test('props sent to FormikCheckbox for subscribe', () => { test('props sent to FormikCheckbox for subscribe', () => {
const wrapper = shallowWithIntl(<EmailStep />); const intlWrapper = shallowWithIntl(<EmailStep />);
// Dive to get past the intl wrapper // Dive to get past the intl wrapper
const formikWrapper = wrapper.dive(); const emailStepWrapper = intlWrapper.dive();
// Dive to get past the anonymous component. // Dive to get past the anonymous component.
const joinFlowWrapper = formikWrapper.dive().find(JoinFlowStep); const joinFlowWrapper = emailStepWrapper.dive().find(JoinFlowStep);
expect(joinFlowWrapper).toHaveLength(1); expect(joinFlowWrapper).toHaveLength(1);
const checkboxWrapper = joinFlowWrapper.find(FormikCheckbox).first(); const checkboxWrapper = joinFlowWrapper.find(FormikCheckbox).first();
expect(checkboxWrapper).toHaveLength(1); expect(checkboxWrapper).toHaveLength(1);
@ -93,12 +93,12 @@ describe('EmailStep test', () => {
render: jest.fn() render: jest.fn()
}; };
const formData = {item1: 'thing', item2: 'otherthing'}; const formData = {item1: 'thing', item2: 'otherthing'};
const wrapper = shallowWithIntl( const intlWrapper = shallowWithIntl(
<EmailStep />); <EmailStep />);
const formikWrapper = wrapper.dive(); const emailStepWrapper = intlWrapper.dive();
formikWrapper.instance().onCaptchaLoad(); // to setup catpcha state emailStepWrapper.instance().onCaptchaLoad(); // to setup catpcha state
formikWrapper.instance().handleValidSubmit(formData, formikBag); emailStepWrapper.instance().handleValidSubmit(formData, formikBag);
expect(formikBag.setSubmitting).toHaveBeenCalledWith(false); expect(formikBag.setSubmitting).toHaveBeenCalledWith(false);
expect(global.grecaptcha.execute).toHaveBeenCalled(); expect(global.grecaptcha.execute).toHaveBeenCalled();
@ -116,18 +116,18 @@ describe('EmailStep test', () => {
render: jest.fn() render: jest.fn()
}; };
const formData = {item1: 'thing', item2: 'otherthing'}; const formData = {item1: 'thing', item2: 'otherthing'};
const wrapper = shallowWithIntl( const intlWrapper = shallowWithIntl(
<EmailStep <EmailStep
{...props} {...props}
/>); />);
const formikWrapper = wrapper.dive(); const emailStepWrapper = intlWrapper.dive();
// Call these to setup captcha. // Call these to setup captcha.
formikWrapper.instance().onCaptchaLoad(); // to setup catpcha state emailStepWrapper.instance().onCaptchaLoad(); // to setup catpcha state
formikWrapper.instance().handleValidSubmit(formData, formikBag); emailStepWrapper.instance().handleValidSubmit(formData, formikBag);
const captchaToken = 'abcd'; const captchaToken = 'abcd';
formikWrapper.instance().captchaSolved(captchaToken); emailStepWrapper.instance().captchaSolved(captchaToken);
// Make sure captchaSolved calls onNextStep with formData that has // Make sure captchaSolved calls onNextStep with formData that has
// a captcha token and left everything else in the object in place. // a captcha token and left everything else in the object in place.
expect(props.onNextStep).toHaveBeenCalledWith( expect(props.onNextStep).toHaveBeenCalledWith(
@ -139,65 +139,51 @@ describe('EmailStep test', () => {
expect(formikBag.setSubmitting).toHaveBeenCalledWith(true); expect(formikBag.setSubmitting).toHaveBeenCalledWith(true);
}); });
test('onCaptchaError calls error function with correct message', () => {
const props = {
onRegistrationError: jest.fn()
};
const wrapper = shallowWithIntl(
<EmailStep
{...props}
/>);
const formikWrapper = wrapper.dive();
formikWrapper.instance().onCaptchaError();
expect(props.onRegistrationError).toHaveBeenCalledWith('registration.troubleReload');
});
test('Captcha load error calls error function', () => { test('Captcha load error calls error function', () => {
const props = { const props = {
onRegistrationError: jest.fn() onCaptchaError: jest.fn()
}; };
// Set this to null to force an error. // Set this to null to force an error.
global.grecaptcha = null; global.grecaptcha = null;
const wrapper = shallowWithIntl( const intlWrapper = shallowWithIntl(
<EmailStep <EmailStep
{...props} {...props}
/>); />
);
const formikWrapper = wrapper.dive(); const emailStepWrapper = intlWrapper.dive();
formikWrapper.instance().onCaptchaLoad(); emailStepWrapper.instance().onCaptchaLoad();
expect(props.onRegistrationError).toHaveBeenCalledWith('registration.troubleReload'); expect(props.onCaptchaError).toHaveBeenCalled();
}); });
test('validateEmail test email empty', () => { test('validateEmail test email empty', () => {
const wrapper = shallowWithIntl( const intlWrapper = shallowWithIntl(
<EmailStep />); <EmailStep />);
const formikWrapper = wrapper.dive(); const emailStepWrapper = intlWrapper.dive();
const val = formikWrapper.instance().validateEmail(''); const val = emailStepWrapper.instance().validateEmail('');
expect(val).toBe('general.required'); expect(val).toBe('general.required');
}); });
test('validateEmail test email null', () => { test('validateEmail test email null', () => {
const wrapper = shallowWithIntl( const intlWrapper = shallowWithIntl(
<EmailStep />); <EmailStep />);
const formikWrapper = wrapper.dive(); const emailStepWrapper = intlWrapper.dive();
const val = formikWrapper.instance().validateEmail(null); const val = emailStepWrapper.instance().validateEmail(null);
expect(val).toBe('general.required'); expect(val).toBe('general.required');
}); });
test('validateEmail test email undefined', () => { test('validateEmail test email undefined', () => {
const wrapper = shallowWithIntl( const intlWrapper = shallowWithIntl(
<EmailStep />); <EmailStep />);
const formikWrapper = wrapper.dive(); const emailStepWrapper = intlWrapper.dive();
const val = formikWrapper.instance().validateEmail(); const val = emailStepWrapper.instance().validateEmail();
expect(val).toBe('general.required'); expect(val).toBe('general.required');
}); });
test('validateEmailRemotelyWithCache calls validate.validateEmailRemotely', done => { test('validateEmailRemotelyWithCache calls validate.validateEmailRemotely', done => {
const wrapper = shallowWithIntl( const intlWrapper = shallowWithIntl(
<EmailStep />); <EmailStep />);
const instance = wrapper.dive().instance(); const instance = intlWrapper.dive().instance();
instance.validateEmailRemotelyWithCache('some-email@some-domain.com') instance.validateEmailRemotelyWithCache('some-email@some-domain.com')
.then(response => { .then(response => {
@ -209,10 +195,10 @@ describe('EmailStep test', () => {
}); });
test('validateEmailRemotelyWithCache, called twice with different data, makes two remote requests', done => { test('validateEmailRemotelyWithCache, called twice with different data, makes two remote requests', done => {
const wrapper = shallowWithIntl( const intlWrapper = shallowWithIntl(
<EmailStep /> <EmailStep />
); );
const instance = wrapper.dive().instance(); const instance = intlWrapper.dive().instance();
instance.validateEmailRemotelyWithCache('some-email@some-domain.com') instance.validateEmailRemotelyWithCache('some-email@some-domain.com')
.then(response => { .then(response => {
@ -233,10 +219,10 @@ describe('EmailStep test', () => {
}); });
test('validateEmailRemotelyWithCache, called twice with same data, only makes one remote request', done => { test('validateEmailRemotelyWithCache, called twice with same data, only makes one remote request', done => {
const wrapper = shallowWithIntl( const intlWrapper = shallowWithIntl(
<EmailStep /> <EmailStep />
); );
const instance = wrapper.dive().instance(); const instance = intlWrapper.dive().instance();
instance.validateEmailRemotelyWithCache('some-email@some-domain.com') instance.validateEmailRemotelyWithCache('some-email@some-domain.com')
.then(response => { .then(response => {