diff --git a/packages/wallets/src/features/cashier/modules/WithdrawalVerification/WithdrawalVerificationSent/WithdrawalVerificationSent.tsx b/packages/wallets/src/features/cashier/modules/WithdrawalVerification/WithdrawalVerificationSent/WithdrawalVerificationSent.tsx index 824fd74e8331..6b62a690fba7 100644 --- a/packages/wallets/src/features/cashier/modules/WithdrawalVerification/WithdrawalVerificationSent/WithdrawalVerificationSent.tsx +++ b/packages/wallets/src/features/cashier/modules/WithdrawalVerification/WithdrawalVerificationSent/WithdrawalVerificationSent.tsx @@ -16,7 +16,10 @@ const WithdrawalVerificationSent: React.FC = ({ counter, sendEmail }) => +
} @@ -36,18 +39,18 @@ const WithdrawalVerificationSent: React.FC = ({ counter, sendEmail }) => ) : undefined } - title='We’ve sent you an email.' + title="We've sent you an email." />
{showResend && ( ( {`Resend email${counter ? ` in ${counter}s` : ''}`} )} - title='Didn’t receive the email?' + title="Didn't receive the email?" /> )}
diff --git a/packages/wallets/src/features/cashier/modules/WithdrawalVerification/WithdrawalVerificationSent/__tests__/WithdrawalVerificationSent.spec.tsx b/packages/wallets/src/features/cashier/modules/WithdrawalVerification/WithdrawalVerificationSent/__tests__/WithdrawalVerificationSent.spec.tsx new file mode 100644 index 000000000000..a60f633be327 --- /dev/null +++ b/packages/wallets/src/features/cashier/modules/WithdrawalVerification/WithdrawalVerificationSent/__tests__/WithdrawalVerificationSent.spec.tsx @@ -0,0 +1,51 @@ +import React from 'react'; +import { fireEvent, render, screen, waitFor } from '@testing-library/react'; +import WithdrawalVerificationSent from '../WithdrawalVerificationSent'; + +describe('WithdrawalVerificationSent', () => { + test('should render component correctly', () => { + render(); + + expect(screen.getByText("We've sent you an email.")).toBeInTheDocument(); + + expect( + screen.getByText('Please check your email for the verification link to complete the process.') + ).toBeInTheDocument(); + + const emailSentIcon = screen.getByTestId('dt_withdrawal_verification_sent_icon'); + expect(emailSentIcon).toBeInTheDocument(); + + expect(screen.getByRole('button', { name: "Didn't receive the email?" })).toBeInTheDocument(); + }); + + test('should call sendEmail prop and show resend email button', async () => { + const sendEmailMock = jest.fn(); + render(); + + fireEvent.click(screen.getByRole('button', { name: "Didn't receive the email?" })); + + expect(sendEmailMock).toHaveBeenCalledTimes(1); + + await waitFor(() => { + expect( + screen.getByText("Check your spam or junk folder. If it's not there, try resending the email.") + ).toBeInTheDocument(); + expect(screen.getByRole('button', { name: /Resend email/ })).toBeInTheDocument(); + }); + }); + + test('should call sendEmail function again on Resend button click after counter ends', async () => { + const sendEmailMock = jest.fn(); + render(); + + fireEvent.click(screen.getByRole('button', { name: "Didn't receive the email?" })); + + expect(sendEmailMock).toHaveBeenCalledTimes(1); + + await waitFor(() => { + expect(screen.getByRole('button', { name: /Resend email/ })).toBeInTheDocument(); + fireEvent.click(screen.getByRole('button', { name: /Resend email/ })); + expect(sendEmailMock).toHaveBeenCalledTimes(1); + }); + }); +});