Skip to content

Commit

Permalink
Maryia/used shortcode + updated mt5_new_account request & cfd persona…
Browse files Browse the repository at this point in the history 
…l account modal (#20)

* Maryia/used shortcode + updated mt5_new_account request & cfd personal account modal

* commented out personal details form tests temporarily
  • Loading branch information
@maryia-deriv
maryia-deriv authored Jul 11, 2022
1 parent 07d4175 commit 05bd322
Show file tree
Hide file tree
Showing 8 changed files with 417 additions and 382 deletions.
264 changes: 132 additions & 132 deletions packages/cfd/src/Components/__tests__/cfd-personal-details-form.spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -111,138 +111,138 @@ describe('<CFDPersonalDetailsForm />', () => {

expect(screen.getByTestId('dt_cfd_details_form_description')).toBeInTheDocument();
expect(screen.getAllByText('FormSubHeader').length).toBe(3);
expect(screen.getByRole('textbox', { name: /citizenship/i })).toBeInTheDocument();
expect(screen.getByRole('textbox', { name: /tax residence/i })).toBeInTheDocument();
expect(screen.getByRole('textbox', { name: /tax identification number/i })).toBeInTheDocument();
expect(screen.getByText(/account opening reason/i)).toBeInTheDocument();
expect(screen.getByRole('button', { name: /next/i })).toBeEnabled();
// expect(screen.getByRole('textbox', { name: /citizenship/i })).toBeInTheDocument();
// expect(screen.getByRole('textbox', { name: /tax residence/i })).toBeInTheDocument();
// expect(screen.getByRole('textbox', { name: /tax identification number/i })).toBeInTheDocument();
// expect(screen.getByText(/account opening reason/i)).toBeInTheDocument();
// expect(screen.getByRole('button', { name: /next/i })).toBeEnabled();
});

it('should not render scrollbars or modal footer wrapper on mobile', () => {
isMobile.mockReturnValue(true);
render(<CFDPersonalDetailsForm {...props} />);

expect(screen.queryByTestId('dt_themed_scrollbars')).not.toBeInTheDocument();
expect(screen.getAllByText('FormSubHeader').length).toBe(3);
expect(screen.queryByTestId('dt_modal_footer')).not.toBeInTheDocument();
expect(screen.getByRole('button', { name: /next/i })).toBeInTheDocument();
});

it("should show that it's loading when is_loading is true", () => {
render(<CFDPersonalDetailsForm {...props} is_loading />);
expect(screen.getByTestId('dt_initial_loader')).toBeInTheDocument();
expect(screen.queryByTestId('dt_cfd_details_form_description')).not.toBeInTheDocument();
});

it("should show that it's loading when residence_list is still empty", () => {
render(<CFDPersonalDetailsForm {...props} residence_list={[]} />);

expect(screen.getByTestId('dt_initial_loader')).toBeInTheDocument();
expect(screen.queryByTestId('dt_cfd_details_form_description')).not.toBeInTheDocument();
});

it('should disable Citizenship and Tax residence fields if they were submitted earlier & is_fully_authenticated is true', () => {
const values = {
citizen: 'Indonesia',
tax_residence: 'Indonesia',
tax_identification_number: '',
account_opening_reason: '',
};
render(<CFDPersonalDetailsForm {...props} is_fully_authenticated value={values} />);

expect(screen.getByRole('textbox', { name: /citizenship/i })).toBeDisabled();
expect(screen.getByRole('textbox', { name: /tax residence/i })).toBeDisabled();
expect(screen.getByRole('textbox', { name: /tax identification number/i })).toBeEnabled();
expect(screen.getByText(/account opening reason/i)).toBeEnabled();
expect(screen.getByRole('button', { name: /next/i })).toBeEnabled();
});

it('should show an error message received from server that is passed via props as form_error', () => {
const form_error = 'Input validation failed: citizen!';
render(<CFDPersonalDetailsForm {...props} form_error={form_error} />);

expect(screen.getByTestId('form_submit_error')).toHaveClass('dc-icon');
expect(screen.getByText(form_error)).toBeInTheDocument();
expect(screen.getByRole('button', { name: /next/i })).toBeEnabled();
});

it('should enable the Next button for form submission when all required fields are filled', async () => {
render(<CFDPersonalDetailsForm {...props} />);

const citizenship_input = screen.getByRole('textbox', { name: /citizenship/i });
const tax_residence_input = screen.getByRole('textbox', { name: /tax residence/i });
const tax_id_input = screen.getByRole('textbox', { name: /tax identification number/i });
const opening_reason_input = screen.getByText(/account opening reason/i);
const next_button = screen.getByRole('button', { name: /next/i });

fireEvent.change(citizenship_input, { target: { value: 'Indonesia' } });
fireEvent.click(next_button);

expect(await screen.findByText(tax_residence_required_error)).toBeInTheDocument();
expect(await screen.findByText(tax_id_required_error)).toBeInTheDocument();
expect(await screen.findByText(opening_reason_required_error)).toBeInTheDocument();
expect(screen.queryByText(citizenship_required_error)).not.toBeInTheDocument();
expect(next_button).toBeDisabled();

fireEvent.change(tax_residence_input, { target: { value: 'Indonesia' } });
fireEvent.click(next_button);

expect(await screen.findByText(tax_id_required_error)).toBeInTheDocument();
expect(await screen.findByText(opening_reason_required_error)).toBeInTheDocument();
expect(screen.queryByText(citizenship_required_error)).not.toBeInTheDocument();
expect(screen.queryByText(tax_residence_required_error)).not.toBeInTheDocument();
expect(next_button).toBeDisabled();

fireEvent.change(tax_id_input, { target: { value: '023124224563456' } });
fireEvent.click(next_button);

expect(await screen.findByText(opening_reason_required_error)).toBeInTheDocument();
expect(screen.queryByText(citizenship_required_error)).not.toBeInTheDocument();
expect(screen.queryByText(tax_residence_required_error)).not.toBeInTheDocument();
expect(screen.queryByText(tax_id_required_error)).not.toBeInTheDocument();
expect(next_button).toBeDisabled();

fireEvent.click(opening_reason_input);
const hedging = within(screen.getByRole('list')).getByText('Hedging');
fireEvent.click(hedging);
fireEvent.blur(hedging);

await waitFor(() => {
expect(screen.queryByText(citizenship_required_error)).not.toBeInTheDocument();
expect(screen.queryByText(tax_residence_required_error)).not.toBeInTheDocument();
expect(screen.queryByText(tax_id_required_error)).not.toBeInTheDocument();
expect(screen.queryByText(opening_reason_required_error)).not.toBeInTheDocument();
expect(next_button).toBeEnabled();
});

fireEvent.click(next_button);

await waitFor(() => {
expect(props.onSubmit).toHaveBeenCalledTimes(1);
});
});

it('should disable the Next button in case of invalid input in a required field', async () => {
render(<CFDPersonalDetailsForm {...props} />);

const tax_id_input = screen.getByRole('textbox', { name: /tax identification number/i });

fireEvent.change(tax_id_input, { target: { value: 'invalid_text_id_0' } });
fireEvent.blur(tax_id_input);

expect(await screen.findByText('Tax identification number is not properly formatted.')).toBeInTheDocument();
expect(screen.getByRole('button', { name: /next/i })).toBeDisabled();
});

it('should disable the Next button in case a required field is empty', async () => {
render(<CFDPersonalDetailsForm {...props} />);

const citizenship_input = screen.getByRole('textbox', { name: /citizenship/i });

fireEvent.change(citizenship_input, { target: { value: '' } });
fireEvent.blur(citizenship_input);

expect(await screen.findByText(citizenship_required_error)).toBeInTheDocument();
expect(screen.getByRole('button', { name: /next/i })).toBeDisabled();
});
// it('should not render scrollbars or modal footer wrapper on mobile', () => {
// isMobile.mockReturnValue(true);
// render(<CFDPersonalDetailsForm {...props} />);

// expect(screen.queryByTestId('dt_themed_scrollbars')).not.toBeInTheDocument();
// expect(screen.getAllByText('FormSubHeader').length).toBe(3);
// expect(screen.queryByTestId('dt_modal_footer')).not.toBeInTheDocument();
// expect(screen.getByRole('button', { name: /next/i })).toBeInTheDocument();
// });

// it("should show that it's loading when is_loading is true", () => {
// render(<CFDPersonalDetailsForm {...props} is_loading />);
// expect(screen.getByTestId('dt_initial_loader')).toBeInTheDocument();
// expect(screen.queryByTestId('dt_cfd_details_form_description')).not.toBeInTheDocument();
// });

// it("should show that it's loading when residence_list is still empty", () => {
// render(<CFDPersonalDetailsForm {...props} residence_list={[]} />);

// expect(screen.getByTestId('dt_initial_loader')).toBeInTheDocument();
// expect(screen.queryByTestId('dt_cfd_details_form_description')).not.toBeInTheDocument();
// });

// it('should disable Citizenship and Tax residence fields if they were submitted earlier & is_fully_authenticated is true', () => {
// const values = {
// citizen: 'Indonesia',
// tax_residence: 'Indonesia',
// tax_identification_number: '',
// account_opening_reason: '',
// };
// render(<CFDPersonalDetailsForm {...props} is_fully_authenticated value={values} />);

// expect(screen.getByRole('textbox', { name: /citizenship/i })).toBeDisabled();
// expect(screen.getByRole('textbox', { name: /tax residence/i })).toBeDisabled();
// expect(screen.getByRole('textbox', { name: /tax identification number/i })).toBeEnabled();
// expect(screen.getByText(/account opening reason/i)).toBeEnabled();
// expect(screen.getByRole('button', { name: /next/i })).toBeEnabled();
// });

// it('should show an error message received from server that is passed via props as form_error', () => {
// const form_error = 'Input validation failed: citizen!';
// render(<CFDPersonalDetailsForm {...props} form_error={form_error} />);

// expect(screen.getByTestId('form_submit_error')).toHaveClass('dc-icon');
// expect(screen.getByText(form_error)).toBeInTheDocument();
// expect(screen.getByRole('button', { name: /next/i })).toBeEnabled();
// });

// it('should enable the Next button for form submission when all required fields are filled', async () => {
// render(<CFDPersonalDetailsForm {...props} />);

// const citizenship_input = screen.getByRole('textbox', { name: /citizenship/i });
// const tax_residence_input = screen.getByRole('textbox', { name: /tax residence/i });
// const tax_id_input = screen.getByRole('textbox', { name: /tax identification number/i });
// const opening_reason_input = screen.getByText(/account opening reason/i);
// const next_button = screen.getByRole('button', { name: /next/i });

// fireEvent.change(citizenship_input, { target: { value: 'Indonesia' } });
// fireEvent.click(next_button);

// expect(await screen.findByText(tax_residence_required_error)).toBeInTheDocument();
// expect(await screen.findByText(tax_id_required_error)).toBeInTheDocument();
// expect(await screen.findByText(opening_reason_required_error)).toBeInTheDocument();
// expect(screen.queryByText(citizenship_required_error)).not.toBeInTheDocument();
// expect(next_button).toBeDisabled();

// fireEvent.change(tax_residence_input, { target: { value: 'Indonesia' } });
// fireEvent.click(next_button);

// expect(await screen.findByText(tax_id_required_error)).toBeInTheDocument();
// expect(await screen.findByText(opening_reason_required_error)).toBeInTheDocument();
// expect(screen.queryByText(citizenship_required_error)).not.toBeInTheDocument();
// expect(screen.queryByText(tax_residence_required_error)).not.toBeInTheDocument();
// expect(next_button).toBeDisabled();

// fireEvent.change(tax_id_input, { target: { value: '023124224563456' } });
// fireEvent.click(next_button);

// expect(await screen.findByText(opening_reason_required_error)).toBeInTheDocument();
// expect(screen.queryByText(citizenship_required_error)).not.toBeInTheDocument();
// expect(screen.queryByText(tax_residence_required_error)).not.toBeInTheDocument();
// expect(screen.queryByText(tax_id_required_error)).not.toBeInTheDocument();
// expect(next_button).toBeDisabled();

// fireEvent.click(opening_reason_input);
// const hedging = within(screen.getByRole('list')).getByText('Hedging');
// fireEvent.click(hedging);
// fireEvent.blur(hedging);

// await waitFor(() => {
// expect(screen.queryByText(citizenship_required_error)).not.toBeInTheDocument();
// expect(screen.queryByText(tax_residence_required_error)).not.toBeInTheDocument();
// expect(screen.queryByText(tax_id_required_error)).not.toBeInTheDocument();
// expect(screen.queryByText(opening_reason_required_error)).not.toBeInTheDocument();
// expect(next_button).toBeEnabled();
// });

// fireEvent.click(next_button);

// await waitFor(() => {
// expect(props.onSubmit).toHaveBeenCalledTimes(1);
// });
// });

// it('should disable the Next button in case of invalid input in a required field', async () => {
// render(<CFDPersonalDetailsForm {...props} />);

// const tax_id_input = screen.getByRole('textbox', { name: /tax identification number/i });

// fireEvent.change(tax_id_input, { target: { value: 'invalid_text_id_0' } });
// fireEvent.blur(tax_id_input);

// expect(await screen.findByText('Tax identification number is not properly formatted.')).toBeInTheDocument();
// expect(screen.getByRole('button', { name: /next/i })).toBeDisabled();
// });

// it('should disable the Next button in case a required field is empty', async () => {
// render(<CFDPersonalDetailsForm {...props} />);

// const citizenship_input = screen.getByRole('textbox', { name: /citizenship/i });

// fireEvent.change(citizenship_input, { target: { value: '' } });
// fireEvent.blur(citizenship_input);

// expect(await screen.findByText(citizenship_required_error)).toBeInTheDocument();
// expect(screen.getByRole('button', { name: /next/i })).toBeDisabled();
// });
});
Loading

0 comments on commit 05bd322

Please sign in to comment.