matty/ncd-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add registration & verification tests

Browse Source
This commit is contained in:
Justin
2022-04-04 11:54:00 -04:00
parent ed47cf5f09
commit dcc90bc99a
10 changed files with 389 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
app/soapbox/features/verification/steps/__tests__/age-verification.test.js Normal file
View File

@@ -0,0 +1,51 @@
import userEvent from '@testing-library/user-event';
import { Map as ImmutableMap } from 'immutable';
import React from 'react';
import '@testing-library/jest-dom';
import { __stub } from 'soapbox/api';
import { fireEvent, render, screen } from 'soapbox/jest/test-helpers';
import AgeVerification from '../age-verification';
describe('<AgeVerification />', () => {
let store;
beforeEach(() => {
store = {
verification: ImmutableMap({
ageMinimum: 13,
}),
};
__stub(mock => {
mock.onPost('/api/v1/pepe/verify_age/confirm')
.reply(200, {});
});
});
it('successfully renders the Birthday step', async() => {
render(
<AgeVerification />,
{},
store,
);
expect(screen.getByRole('heading')).toHaveTextContent('Enter your birth date');
});
it('selects a date', async() => {
render(
<AgeVerification />,
{},
store,
);
await userEvent.type(screen.getByLabelText('Birth Date'), '{enter}');
fireEvent.submit(
screen.getByRole('button'), {
preventDefault: () => {},
},
);
});
});

67
app/soapbox/features/verification/steps/__tests__/email-verification.test.js Normal file
View File

@@ -0,0 +1,67 @@
import userEvent from '@testing-library/user-event';
import React from 'react';
import '@testing-library/jest-dom';
import { __stub } from 'soapbox/api';
import { fireEvent, render, screen, waitFor } from 'soapbox/jest/test-helpers';
import EmailVerification from '../email-verification';
describe('<EmailVerification />', () => {
it('successfully renders the Email step', async() => {
render(<EmailVerification />);
expect(screen.getByRole('heading')).toHaveTextContent('Enter your email address');
});
describe('with valid data', () => {
beforeEach(() => {
__stub(mock => {
mock.onPost('/api/v1/pepe/verify_email/request')
.reply(200, {});
});
});
it('successfully submits', async() => {
render(<EmailVerification />);
await userEvent.type(screen.getByLabelText('Email Address'), 'foo@bar.com{enter}');
await waitFor(() => {
fireEvent.submit(
screen.getByRole('button'), {
preventDefault: () => {},
},
);
});
expect(screen.getByRole('button')).toHaveTextContent('Resend verification email');
});
});
describe('with invalid data', () => {
beforeEach(() => {
__stub(mock => {
mock.onPost('/api/v1/pepe/verify_email/request')
.reply(422, {
error: 'email_taken',
});
});
});
it('renders errors', async() => {
render(<EmailVerification />);
await userEvent.type(screen.getByLabelText('Email Address'), 'foo@bar.com{enter}');
await waitFor(() => {
fireEvent.submit(
screen.getByRole('button'), {
preventDefault: () => {},
},
);
});
expect(screen.getByTestId('form-group-error')).toHaveTextContent('is taken');
});
});
});

103
app/soapbox/features/verification/steps/__tests__/sms-verification.test.js Normal file
View File

@@ -0,0 +1,103 @@
import userEvent from '@testing-library/user-event';
import React from 'react';
import '@testing-library/jest-dom';
import { __stub } from 'soapbox/api';
import { fireEvent, render, screen, waitFor } from 'soapbox/jest/test-helpers';
import SmsVerification from '../sms-verification';
describe('<SmsVerification />', () => {
it('successfully renders the SMS step', async() => {
render(<SmsVerification />);
expect(screen.getByRole('heading')).toHaveTextContent('Enter your phone number');
});
describe('with valid data', () => {
beforeEach(() => {
__stub(mock => {
mock.onPost('/api/v1/pepe/verify_sms/request').reply(200, {});
});
});
it('successfully submits', async() => {
__stub(mock => {
mock.onPost('/api/v1/pepe/verify_sms/confirm').reply(200, {});
});
render(<SmsVerification />);
await userEvent.type(screen.getByLabelText('Phone Number'), '+1 (555) 555-5555');
await waitFor(() => {
fireEvent.submit(
screen.getByRole('button'), {
preventDefault: () => {},
},
);
});
expect(screen.getByRole('heading')).toHaveTextContent('Verification code');
expect(screen.getByTestId('toast')).toHaveTextContent('A verification code has been sent to your phone number.');
await userEvent.type(screen.getByLabelText('Please enter verification code. Digit 1'), '1');
await userEvent.type(screen.getByLabelText('Digit 2'), '2');
await userEvent.type(screen.getByLabelText('Digit 3'), '3');
await userEvent.type(screen.getByLabelText('Digit 4'), '4');
await userEvent.type(screen.getByLabelText('Digit 5'), '5');
await userEvent.type(screen.getByLabelText('Digit 6'), '6');
});
it('handle expired tokens', async() => {
__stub(mock => {
mock.onPost('/api/v1/pepe/verify_sms/confirm').reply(422, {});
});
render(<SmsVerification />);
await userEvent.type(screen.getByLabelText('Phone Number'), '+1 (555) 555-5555');
await waitFor(() => {
fireEvent.submit(
screen.getByRole('button'), {
preventDefault: () => {},
},
);
});
expect(screen.getByRole('heading')).toHaveTextContent('Verification code');
expect(screen.getByTestId('toast')).toHaveTextContent('A verification code has been sent to your phone number.');
await userEvent.type(screen.getByLabelText('Please enter verification code. Digit 1'), '1');
await userEvent.type(screen.getByLabelText('Digit 2'), '2');
await userEvent.type(screen.getByLabelText('Digit 3'), '3');
await userEvent.type(screen.getByLabelText('Digit 4'), '4');
await userEvent.type(screen.getByLabelText('Digit 5'), '5');
await userEvent.type(screen.getByLabelText('Digit 6'), '6');
expect(screen.getByTestId('toast')).toHaveTextContent('Your SMS token has expired.');
});
});
describe('with invalid data', () => {
beforeEach(() => {
__stub(mock => {
mock.onPost('/api/v1/pepe/verify_sms/request')
.reply(422, {});
});
});
it('renders errors', async() => {
render(<SmsVerification />);
await userEvent.type(screen.getByLabelText('Phone Number'), '+1 (555) 555-5555');
await waitFor(() => {
fireEvent.submit(
screen.getByRole('button'), {
preventDefault: () => {},
},
);
});
expect(screen.getByTestId('toast')).toHaveTextContent('Failed to send SMS message to your phone number.');
});
});
});

8
app/soapbox/features/verification/steps/age_verification.js → app/soapbox/features/verification/steps/age-verification.js
View File

@@ -28,9 +28,9 @@ const AgeVerification = () => {
const intl = useIntl();
const dispatch = useDispatch();
const isLoading = useSelector((state) => state.getIn(['verification', 'isLoading']));
const ageMinimum = useSelector((state) => state.getIn(['verification', 'ageMinimum']));
const siteTitle = useSelector((state) => state.instance.title);
const isLoading = useSelector((state) => state.verification.get('isLoading'));
const ageMinimum = useSelector((state) => state.verification.get('ageMinimum'));
const siteTitle = useSelector((state) => state.instance.get('title'));
const [date, setDate] = React.useState('');
const isValid = typeof date === 'object';
@@ -65,7 +65,7 @@ const AgeVerification = () => {
</div>
<div className='sm:pt-10 sm:w-2/3 md:w-1/2 mx-auto'>
<Form onSubmit={handleSubmit} disabled={isLoading}>
<Form onSubmit={handleSubmit}>
<FormGroup labelText='Birth Date'>
<DatePicker
selected={date}

4
app/soapbox/features/verification/steps/email_verification.js → app/soapbox/features/verification/steps/email-verification.js
View File

@@ -50,7 +50,7 @@ const EmailVerification = () => {
const intl = useIntl();
const dispatch = useDispatch();
const isLoading = useSelector((state) => state.getIn(['verification', 'isLoading']));
const isLoading = useSelector((state) => state.verification.get('isLoading'));
const [email, setEmail] = React.useState('');
const [status, setStatus] = React.useState(Statuses.IDLE);
@@ -110,7 +110,7 @@ const EmailVerification = () => {
</div>
<div className='sm:pt-10 sm:w-2/3 md:w-1/2 mx-auto'>
<Form onSubmit={handleSubmit} disabled={isLoading}>
<Form onSubmit={handleSubmit}>
<FormGroup labelText='Email Address' errors={errors}>
<Input
type='email'

4
app/soapbox/features/verification/steps/sms_verification.js → app/soapbox/features/verification/steps/sms-verification.js
View File

@@ -21,7 +21,7 @@ const SmsVerification = () => {
const intl = useIntl();
const dispatch = useDispatch();
const isLoading = useSelector((state) => state.getIn(['verification', 'isLoading']));
const isLoading = useSelector((state) => state.verification.get('isLoading'));
const [phone, setPhone] = React.useState('');
const [status, setStatus] = React.useState(Statuses.IDLE);
@@ -147,7 +147,7 @@ const SmsVerification = () => {
</div>
<div className='sm:pt-10 sm:w-2/3 md:w-1/2 mx-auto'>
<Form onSubmit={handleSubmit} disabled={isLoading}>
<Form onSubmit={handleSubmit}>
<FormGroup labelText='Phone Number'>
<Input
type='text'