diff --git a/packages/wallets/src/features/cashier/modules/WithdrawalCrypto/WithdrawalCrypto.tsx b/packages/wallets/src/features/cashier/modules/WithdrawalCrypto/WithdrawalCrypto.tsx
index c2bd4ea78f26..184ff0dbb1d0 100644
--- a/packages/wallets/src/features/cashier/modules/WithdrawalCrypto/WithdrawalCrypto.tsx
+++ b/packages/wallets/src/features/cashier/modules/WithdrawalCrypto/WithdrawalCrypto.tsx
@@ -1,7 +1,7 @@
import React from 'react';
import { WalletText } from '../../../../components';
import { TransactionStatus } from '../TransactionStatus';
-import WithdrawalCryptoProvider, { useWithdrawalCryptoContext } from './provider/WithdrawalCryptoProvider';
+import { WithdrawalCryptoProvider, useWithdrawalCryptoContext } from './provider';
import { WithdrawalCryptoDisclaimer, WithdrawalCryptoForm, WithdrawalCryptoReceipt } from './components';
import './WithdrawalCrypto.scss';
diff --git a/packages/wallets/src/features/cashier/modules/WithdrawalCrypto/__tests__/WithdrawalCrypto.spec.tsx b/packages/wallets/src/features/cashier/modules/WithdrawalCrypto/__tests__/WithdrawalCrypto.spec.tsx
new file mode 100644
index 000000000000..cb751f97fd7f
--- /dev/null
+++ b/packages/wallets/src/features/cashier/modules/WithdrawalCrypto/__tests__/WithdrawalCrypto.spec.tsx
@@ -0,0 +1,98 @@
+import React from 'react';
+import { APIProvider, AuthProvider } from '@deriv/api-v2';
+import { render, screen } from '@testing-library/react';
+import { useWithdrawalCryptoContext } from '../provider';
+import WithdrawalCryptoModule from '../WithdrawalCrypto';
+
+jest.mock('../components', () => ({
+ ...jest.requireActual('../components'),
+ WithdrawalCryptoDisclaimer: jest.fn(() =>
WithdrawalCryptoDisclaimer
),
+ WithdrawalCryptoForm: jest.fn(() => WithdrawalCryptoForm
),
+ WithdrawalCryptoReceipt: jest.fn(() => WithdrawalCryptoReceipt
),
+}));
+
+jest.mock('../../TransactionStatus', () => ({
+ ...jest.requireActual('../../TransactionStatus'),
+ TransactionStatus: jest.fn(() => TransactionStatus
),
+}));
+
+jest.mock('../provider', () => ({
+ ...jest.requireActual('../provider'),
+ useWithdrawalCryptoContext: jest.fn(),
+ WithdrawalCryptoProvider: jest.fn(({ children }) => {children}
),
+}));
+
+const mockUseWithdrawalCryptoContext = useWithdrawalCryptoContext as jest.MockedFunction<
+ typeof useWithdrawalCryptoContext
+>;
+
+describe('WithdrawalCrypto', () => {
+ beforeEach(() => {
+ jest.clearAllMocks();
+ });
+
+ it('should render the WithdrawalCryptoDisclaimer on successful withdrawal', () => {
+ mockUseWithdrawalCryptoContext.mockReturnValue({
+ // @ts-expect-error - since this is a mock, we only need partial properties of the hook
+ activeWallet: {},
+ isWithdrawalSuccess: false,
+ });
+
+ render(
+
+
+
+
+
+ );
+ expect(screen.getByText('WithdrawalCryptoDisclaimer')).toBeInTheDocument();
+ });
+
+ it('should render the WithdrawalCryptoForm on successful withdrawal', () => {
+ mockUseWithdrawalCryptoContext.mockReturnValue({
+ // @ts-expect-error - since this is a mock, we only need partial properties of the hook
+ activeWallet: {
+ currency: 'BTC',
+ },
+ // @ts-expect-error - since this is a mock, we only need partial properties of the hook
+ getCurrencyConfig: jest.fn(() => {
+ 'Bitcoin';
+ }),
+ isWithdrawalSuccess: false,
+ });
+
+ render(
+
+
+
+
+
+ );
+ expect(screen.getByText('WithdrawalCryptoForm')).toBeInTheDocument();
+ expect(screen.getByText(/BTC/)).toBeInTheDocument();
+ expect(screen.getByText('TransactionStatus')).toBeInTheDocument();
+ });
+
+ it('should render the WithdrawalCryptoReceipt on successful withdrawal', () => {
+ mockUseWithdrawalCryptoContext.mockReturnValue({
+ // @ts-expect-error - since this is a mock, we only need partial properties of the hook
+ activeWallet: {
+ currency: 'BTC',
+ },
+ // @ts-expect-error - since this is a mock, we only need partial properties of the hook
+ getCurrencyConfig: jest.fn(() => {
+ 'Bitcoin';
+ }),
+ isWithdrawalSuccess: true,
+ });
+
+ render(
+
+
+
+
+
+ );
+ expect(screen.getByText('WithdrawalCryptoReceipt')).toBeInTheDocument();
+ });
+});
diff --git a/packages/wallets/src/features/cashier/modules/WithdrawalCrypto/components/WithdrawalCryptoForm/WithdrawalCryptoForm.tsx b/packages/wallets/src/features/cashier/modules/WithdrawalCrypto/components/WithdrawalCryptoForm/WithdrawalCryptoForm.tsx
index a0c7cf3b9b06..9962644d4cee 100644
--- a/packages/wallets/src/features/cashier/modules/WithdrawalCrypto/components/WithdrawalCryptoForm/WithdrawalCryptoForm.tsx
+++ b/packages/wallets/src/features/cashier/modules/WithdrawalCrypto/components/WithdrawalCryptoForm/WithdrawalCryptoForm.tsx
@@ -1,7 +1,7 @@
import React from 'react';
import { Field, FieldProps, Formik } from 'formik';
import { WalletButton, WalletTextField } from '../../../../../../components';
-import { useWithdrawalCryptoContext } from '../../provider/WithdrawalCryptoProvider';
+import { useWithdrawalCryptoContext } from '../../provider';
import { validateCryptoAddress } from '../../utils';
import { WithdrawalCryptoAmountConverter } from './components/WithdrawalCryptoAmountConverter';
import { WithdrawalCryptoPercentageSelector } from './components/WithdrawalCryptoPercentageSelector';
@@ -32,6 +32,7 @@ const WithdrawalCryptoForm: React.FC = () => {
{({ field }: FieldProps) => (
({
+ ...jest.requireActual('../../../provider'),
+ useWithdrawalCryptoContext: jest.fn(),
+}));
+
+jest.mock('../../../utils', () => ({
+ ...jest.requireActual('../../../utils'),
+ validateCryptoAddress: jest.fn(),
+ validateCryptoInput: jest.fn(),
+ validateFiatInput: jest.fn(),
+}));
+
+jest.mock('../components/WithdrawalCryptoPercentageSelector', () => ({
+ ...jest.requireActual('../components'),
+ WithdrawalCryptoPercentageSelector: jest.fn(() => WithdrawalCryptoPercentageSelector
),
+}));
+
+const mockUseWithdrawalCryptoContext = useWithdrawalCryptoContext as jest.MockedFunction<
+ typeof useWithdrawalCryptoContext
+>;
+
+const wrapper = ({ children }: PropsWithChildren) => (
+
+
+ jest.fn()} verificationCode='Abcd1234'>
+ {children}
+
+
+
+);
+
+const mockValues = {
+ accountLimits: {
+ remainder: undefined,
+ },
+ activeAccount: {
+ currency: 'BTC',
+ },
+ fractionalDigits: {
+ crypto: 8,
+ fiat: 2,
+ },
+ getConvertedCryptoAmount: jest.fn(val => val),
+ getConvertedFiatAmount: jest.fn(val => val),
+ isClientVerified: false,
+
+ requestCryptoWithdrawal: jest.fn(),
+};
+
+describe('WithdrawalCryptoForm', () => {
+ it('should check if requestCryptoWithdrawal was called with correct parameters', async () => {
+ mockUseWithdrawalCryptoContext.mockReturnValue(
+ // @ts-expect-error - since this is a mock, we only need partial properties of the hook
+ mockValues
+ );
+
+ render(, { wrapper });
+
+ const cryptoAddressInput = screen.getByTestId('dt_withdrawal_crypto_address_input');
+ const cryptoAmountInput = screen.getByTestId('dt_withdrawal_crypto_amount_input');
+ const submitButton = screen.getByText('Withdraw');
+
+ await act(async () => {
+ await userEvent.type(cryptoAddressInput, 'SampleAddress', { delay: 1 });
+ userEvent.type(cryptoAmountInput, '123');
+ userEvent.click(submitButton);
+ });
+
+ expect(mockValues.requestCryptoWithdrawal).toBeCalledWith({ address: 'SampleAddress', amount: 123 });
+ });
+});