Skip to content

Commit

Permalink
fix: TPA data not auto-populated (#1156)
Browse files Browse the repository at this point in the history
  • Loading branch information
@attiyaIshaque @zainab-amir
attiyaIshaque authored and zainab-amir committed Feb 14, 2024
1 parent 94e8236 commit 2590956
Show file tree
Hide file tree
Showing 8 changed files with 92 additions and 92 deletions.
54 changes: 27 additions & 27 deletions src/register/RegistrationFields/NameField/NameField.test.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -67,43 +67,43 @@ describe('NameField', () => {

describe('Test Name Field', () => {
it('should run first name field validation when onBlur is fired', () => {
props.name = 'firstname';
props.name = 'firstName';
const { container } = render(routerWrapper(reduxWrapper(<IntlNameField {...props} />)));

const firstNameInput = container.querySelector('input#firstname');
fireEvent.blur(firstNameInput, { target: { value: '', name: 'firstname' } });
const firstNameInput = container.querySelector('input#firstName');
fireEvent.blur(firstNameInput, { target: { value: '', name: 'firstName' } });

expect(props.handleErrorChange).toHaveBeenCalledTimes(1);
expect(props.handleErrorChange).toHaveBeenCalledWith(
'firstname',
'firstName',
'Enter your first name',
);
});

it('should update first name field error for frontend validations', () => {
props.name = 'firstname';
props.name = 'firstName';
const { container } = render(routerWrapper(reduxWrapper(<IntlNameField {...props} />)));

const firstNameInput = container.querySelector('input#firstname');
fireEvent.blur(firstNameInput, { target: { value: 'https://invalid-name.com', name: 'firstname' } });
const firstNameInput = container.querySelector('input#firstName');
fireEvent.blur(firstNameInput, { target: { value: 'https://invalid-name.com', name: 'firstName' } });

expect(props.handleErrorChange).toHaveBeenCalledTimes(1);
expect(props.handleErrorChange).toHaveBeenCalledWith(
'firstname',
'firstName',
'Enter a valid first name',
);
});

it('should clear first name error on focus', () => {
props.name = 'firstname';
props.name = 'firstName';
const { container } = render(routerWrapper(reduxWrapper(<IntlNameField {...props} />)));

const firstNameInput = container.querySelector('input#firstname');
fireEvent.focus(firstNameInput, { target: { value: '', name: 'firstname' } });
const firstNameInput = container.querySelector('input#firstName');
fireEvent.focus(firstNameInput, { target: { value: '', name: 'firstName' } });

expect(props.handleErrorChange).toHaveBeenCalledTimes(1);
expect(props.handleErrorChange).toHaveBeenCalledWith(
'firstname',
'firstName',
'',
);
});
Expand All @@ -115,12 +115,12 @@ describe('NameField', () => {
shouldFetchUsernameSuggestions: true,
fullName: 'test test',
};
props.name = 'lastname';
props.name = 'lastName';
const { container } = render(routerWrapper(reduxWrapper(<IntlNameField {...props} />)));

const lastNameInput = container.querySelector('input#lastname');
const lastNameInput = container.querySelector('input#lastName');
// Enter a valid name so that frontend validations are passed
fireEvent.blur(lastNameInput, { target: { value: 'test', name: 'lastname' } });
fireEvent.blur(lastNameInput, { target: { value: 'test', name: 'lastName' } });

expect(store.dispatch).toHaveBeenCalledWith(fetchRealtimeValidations({ name: props.fullName }));
});
Expand All @@ -137,41 +137,41 @@ describe('NameField', () => {
},
});

props.name = 'lastname';
props.name = 'lastName';
store.dispatch = jest.fn(store.dispatch);
const { container } = render(routerWrapper(reduxWrapper(<IntlNameField {...props} />)));

const lastNameInput = container.querySelector('input#lastname');
const lastNameInput = container.querySelector('input#lastName');

fireEvent.focus(lastNameInput, { target: { value: 'test', name: 'lastname' } });
fireEvent.focus(lastNameInput, { target: { value: 'test', name: 'lastName' } });

expect(store.dispatch).toHaveBeenCalledWith(clearRegistrationBackendError('lastname'));
expect(store.dispatch).toHaveBeenCalledWith(clearRegistrationBackendError('lastName'));
});

it('should run last name field validation when onBlur is fired', () => {
props.name = 'lastname';
props.name = 'lastName';
const { container } = render(routerWrapper(reduxWrapper(<IntlNameField {...props} />)));

const lastNameInput = container.querySelector('input#lastname');
fireEvent.blur(lastNameInput, { target: { value: '', name: 'lastname' } });
const lastNameInput = container.querySelector('input#lastName');
fireEvent.blur(lastNameInput, { target: { value: '', name: 'lastName' } });

expect(props.handleErrorChange).toHaveBeenCalledTimes(1);
expect(props.handleErrorChange).toHaveBeenCalledWith(
'lastname',
'lastName',
'Enter your last name',
);
});

it('should update last name field error for frontend validation', () => {
props.name = 'lastname';
props.name = 'lastName';
const { container } = render(routerWrapper(reduxWrapper(<IntlNameField {...props} />)));

const lastNameInput = container.querySelector('input#lastname');
fireEvent.blur(lastNameInput, { target: { value: 'https://invalid-name.com', name: 'lastname' } });
const lastNameInput = container.querySelector('input#lastName');
fireEvent.blur(lastNameInput, { target: { value: 'https://invalid-name.com', name: 'lastName' } });

expect(props.handleErrorChange).toHaveBeenCalledTimes(1);
expect(props.handleErrorChange).toHaveBeenCalledWith(
'lastname',
'lastName',
'Enter a valid last name',
);
});
Expand Down
12 changes: 6 additions & 6 deletions src/register/RegistrationFields/NameField/validator.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,13 +12,13 @@ export const INVALID_NAME_REGEX = /https?:\/\/(?:[-\w.]|(?:%[\da-fA-F]{2}))*/g;
const validateName = (value, fieldName, formatMessage) => {
let fieldError;
if (!value.trim()) {
fieldError = fieldName === 'lastname'
? formatMessage(messages['empty.lastname.field.error'])
: formatMessage(messages['empty.firstname.field.error']);
fieldError = fieldName === 'lastName'
? formatMessage(messages['empty.lastName.field.error'])
: formatMessage(messages['empty.firstName.field.error']);
} else if (URL_REGEX.test(value) || HTML_REGEX.test(value) || INVALID_NAME_REGEX.test(value)) {
fieldError = fieldName === 'lastname'
? formatMessage(messages['lastname.validation.message'])
: formatMessage(messages['firstname.validation.message']);
fieldError = fieldName === 'lastName'
? formatMessage(messages['lastName.validation.message'])
: formatMessage(messages['firstName.validation.message']);
}
return fieldError;
};
Expand Down
22 changes: 11 additions & 11 deletions src/register/RegistrationPage.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -120,10 +120,10 @@ const RegistrationPage = (props) => {
}
if (pipelineUserDetails && Object.keys(pipelineUserDetails).length !== 0) {
const {
firstname = '', lastname = '', username = '', email = '',
firstName = '', lastName = '', username = '', email = '',
} = pipelineUserDetails;
setFormFields(prevState => ({
...prevState, firstname, lastname, username, email,
...prevState, firstName, lastName, username, email,
}));
dispatch(setUserPipelineDataLoaded(true));
}
Expand Down Expand Up @@ -312,22 +312,22 @@ const RegistrationPage = (props) => {
/>
<Form id="registration-form" name="registration-form">
<NameField
name="firstname"
value={formFields.firstname}
name="firstName"
value={formFields.firstName}
handleChange={handleOnChange}
handleErrorChange={handleErrorChange}
errorMessage={errors.firstname}
floatingLabel={formatMessage(messages['registration.firstname.label'])}
errorMessage={errors.firstName}
floatingLabel={formatMessage(messages['registration.firstName.label'])}
/>
<NameField
name="lastname"
value={formFields.lastname}
name="lastName"
value={formFields.lastName}
shouldFetchUsernameSuggestions={!formFields.username.trim()}
fullName={`${formFields.firstname} ${formFields.lastname}`}
fullName={`${formFields.firstName} ${formFields.lastName}`}
handleChange={handleOnChange}
handleErrorChange={handleErrorChange}
errorMessage={errors.lastname}
floatingLabel={formatMessage(messages['registration.lastname.label'])}
errorMessage={errors.lastName}
floatingLabel={formatMessage(messages['registration.lastName.label'])}
/>
<EmailField
name="email"
Expand Down
48 changes: 24 additions & 24 deletions src/register/RegistrationPage.test.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -64,13 +64,13 @@ describe('RegistrationPage', () => {
marketingEmailsOptIn: true,
},
formFields: {
firstname: '', lastname: '', email: '', username: '', password: '',
firstName: '', lastName: '', email: '', username: '', password: '',
},
emailSuggestion: {
suggestion: '', type: '',
},
errors: {
firstname: '', lastname: '', email: '', username: '', password: '',
firstName: '', lastName: '', email: '', username: '', password: '',
},
};

Expand Down Expand Up @@ -134,8 +134,8 @@ describe('RegistrationPage', () => {
});

const populateRequiredFields = (getByLabelText, payload, isThirdPartyAuth = false) => {
fireEvent.change(getByLabelText('First name'), { target: { value: payload.firstname, name: 'firstname' } });
fireEvent.change(getByLabelText('Last name'), { target: { value: payload.lastname, name: 'lastname' } });
fireEvent.change(getByLabelText('First name'), { target: { value: payload.first_name, name: 'firstName' } });
fireEvent.change(getByLabelText('Last name'), { target: { value: payload.last_name, name: 'lastName' } });
fireEvent.change(getByLabelText('Public username'), { target: { value: payload.username, name: 'username' } });
fireEvent.change(getByLabelText('Email'), { target: { value: payload.email, name: 'email' } });

Expand All @@ -153,8 +153,8 @@ describe('RegistrationPage', () => {
});

const emptyFieldValidation = {
firstname: 'Enter your first name',
lastname: 'Enter your last name',
firstName: 'Enter your first name',
lastName: 'Enter your last name',
username: 'Username must be between 2 and 30 characters',
email: 'Enter your email',
password: 'Password criteria has not been met',
Expand All @@ -171,8 +171,8 @@ describe('RegistrationPage', () => {
window.location = { href: getConfig().BASE_URL, search: '?next=/course/demo-course-url' };

const payload = {
firstname: 'John',
lastname: 'Doe',
first_name: 'John',
last_name: 'Doe',
username: 'john_doe',
email: '[email protected]',
password: 'password1',
Expand All @@ -195,8 +195,8 @@ describe('RegistrationPage', () => {
jest.spyOn(global.Date, 'now').mockImplementation(() => 0);

const formPayload = {
firstname: 'John',
lastname: 'Doe',
first_name: 'John',
last_name: 'Doe',
username: 'john_doe',
email: '[email protected]',
country: 'Pakistan',
Expand Down Expand Up @@ -232,8 +232,8 @@ describe('RegistrationPage', () => {
jest.spyOn(global.Date, 'now').mockImplementation(() => 0);

const payload = {
firstname: 'John',
lastname: 'Doe',
first_name: 'John',
last_name: 'Doe',
username: 'john_doe',
email: '[email protected]',
password: 'password1',
Expand Down Expand Up @@ -584,8 +584,8 @@ describe('RegistrationPage', () => {
registrationFormData: {
...registrationFormData,
formFields: {
firstname: 'John',
lastname: 'Doe',
firstName: 'John',
lastName: 'Doe',
username: 'john_doe',
email: '[email protected]',
password: 'password1',
Expand All @@ -599,8 +599,8 @@ describe('RegistrationPage', () => {

const { container } = render(routerWrapper(reduxWrapper(<IntlRegistrationPage {...props} />)));

const firstNameInput = container.querySelector('input#firstname');
const lastNameInput = container.querySelector('input#lastname');
const firstNameInput = container.querySelector('input#firstName');
const lastNameInput = container.querySelector('input#lastName');
const usernameInput = container.querySelector('input#username');
const emailInput = container.querySelector('input#email');
const passwordInput = container.querySelector('input#password');
Expand Down Expand Up @@ -728,8 +728,8 @@ describe('RegistrationPage', () => {
thirdPartyAuthContext: {
...initialState.commonComponents.thirdPartyAuthContext,
pipelineUserDetails: {
firstname: 'John',
lastname: 'Doe',
firstName: 'John',
lastName: 'Doe',
username: 'john_doe',
email: '[email protected]',
},
Expand Down Expand Up @@ -760,8 +760,8 @@ describe('RegistrationPage', () => {
registrationFormData: {
...registrationFormData,
formFields: {
firstname: 'John',
lastname: 'Doe',
firstName: 'John',
lastName: 'Doe',
username: 'john_doe',
email: '[email protected]',
},
Expand All @@ -781,8 +781,8 @@ describe('RegistrationPage', () => {
...initialState.commonComponents.thirdPartyAuthContext,
currentProvider: 'Apple',
pipelineUserDetails: {
firstname: 'John',
lastname: 'Doe',
firstName: 'John',
lastName: 'Doe',
username: 'john_doe',
email: '[email protected]',
},
Expand All @@ -794,8 +794,8 @@ describe('RegistrationPage', () => {

render(routerWrapper(reduxWrapper(<IntlRegistrationPage {...props} />)));
expect(store.dispatch).toHaveBeenCalledWith(registerNewUser({
firstname: 'John',
lastname: 'Doe',
first_name: 'John',
last_name: 'Doe',
username: 'john_doe',
email: '[email protected]',
country: 'PK',
Expand Down
12 changes: 6 additions & 6 deletions src/register/components/tests/ConfigurableRegistrationForm.test.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -56,13 +56,13 @@ describe('ConfigurableRegistrationForm', () => {
marketingEmailsOptIn: true,
},
formFields: {
firstname: '', lastname: '', email: '', username: '', password: '',
firstName: '', lastName: '', email: '', username: '', password: '',
},
emailSuggestion: {
suggestion: '', type: '',
},
errors: {
firstname: '', lastname: '', email: '', username: '', password: '',
firstName: '', lastName: '', email: '', username: '', password: '',
},
};

Expand Down Expand Up @@ -128,8 +128,8 @@ describe('ConfigurableRegistrationForm', () => {
});

const populateRequiredFields = (getByLabelText, payload, isThirdPartyAuth = false) => {
fireEvent.change(getByLabelText('First name'), { target: { value: payload.firstname, name: 'firstname' } });
fireEvent.change(getByLabelText('Last name'), { target: { value: payload.lastname, name: 'lastname' } });
fireEvent.change(getByLabelText('First name'), { target: { value: payload.first_name, name: 'firstName' } });
fireEvent.change(getByLabelText('Last name'), { target: { value: payload.last_name, name: 'lastName' } });
fireEvent.change(getByLabelText('Public username'), { target: { value: payload.username, name: 'username' } });
fireEvent.change(getByLabelText('Email'), { target: { value: payload.email, name: 'email' } });

Expand Down Expand Up @@ -239,8 +239,8 @@ describe('ConfigurableRegistrationForm', () => {
});

const payload = {
firstname: 'John',
lastname: 'Doe',
first_name: 'John',
last_name: 'Doe',
username: 'john_doe',
email: '[email protected]',
password: 'password1',
Expand Down
4 changes: 2 additions & 2 deletions src/register/data/reducers.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,13 +22,13 @@ export const defaultState = {
marketingEmailsOptIn: true,
},
formFields: {
firstname: '', lastname: '', email: '', username: '', password: '',
firstName: '', lastName: '', email: '', username: '', password: '',
},
emailSuggestion: {
suggestion: '', type: '',
},
errors: {
firstname: '', lastname: '', email: '', username: '', password: '',
firstName: '', lastName: '', email: '', username: '', password: '',
},
},
validations: null,
Expand Down
4 changes: 2 additions & 2 deletions src/register/data/tests/reducers.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,13 +22,13 @@ describe('Registration Reducer Tests', () => {
marketingEmailsOptIn: true,
},
formFields: {
firstname: '', lastname: '', email: '', username: '', password: '',
firstName: '', lastName: '', email: '', username: '', password: '',
},
emailSuggestion: {
suggestion: '', type: '',
},
errors: {
firstname: '', lastname: '', email: '', username: '', password: '',
firstName: '', lastName: '', email: '', username: '', password: '',
},
},
validations: null,
Expand Down
Loading

0 comments on commit 2590956

Please sign in to comment.