Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Ameerul / Fix test cases 3 #46

Merged
merged 3 commits into from
May 3, 2024
Merged

Ameerul / Fix test cases 3 #46

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
8bc78c2
fix: test cases
ameerul-deriv May 3, 2024
a7d8adc
fix: fake timer test cases
ameerul-deriv May 3, 2024
7164cc1
fix: removed eslint for no wait for multiple assertions
ameerul-deriv May 3, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 11 additions & 6 deletions src/components/BuySellForm/__tests__/BuySellForm.spec.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,14 @@ import userEvent from '@testing-library/user-event';
import BuySellForm from '../BuySellForm';

const mockMutateFn = jest.fn();
jest.mock('@deriv-com/api-hooks', () => ({
useP2POrderCreate: jest.fn(() => ({
mutate: mockMutateFn,
})),
jest.mock('@/hooks', () => ({
api: {
order: {
useCreate: jest.fn(() => ({
mutate: mockMutateFn,
})),
},
},
}));

jest.mock('@deriv-com/ui', () => ({
Expand Down Expand Up @@ -160,7 +164,8 @@ describe('BuySellForm', () => {
advertiserBuyLimit={5}
/>
);
expect(screen.getByText('Limit: 1-5.00USD')).toBeInTheDocument();

expect(screen.getByText('Limit: 1.00-5.00USD')).toBeInTheDocument();
});
it('should return the advertiserBuyLimit as max limit if sell limit < max order amount limit and sell order', () => {
render(
Expand All @@ -170,7 +175,7 @@ describe('BuySellForm', () => {
advertiserSellLimit={5}
/>
);
expect(screen.getByText('Limit: 1-5.00USD')).toBeInTheDocument();
expect(screen.getByText('Limit: 1.00-5.00USD')).toBeInTheDocument();
});
it('should call onchange when input field value is changed', async () => {
mockFloatingPointValidator.mockReturnValue(true);
Expand Down
4 changes: 2 additions & 2 deletions src/components/Modals/AdCancelCreateEditModal/__tests__/AdCancelCreateEditModal.spec.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,8 @@ jest.mock('@deriv-com/ui', () => ({
useDevice: () => ({ isMobile: false }),
}));

jest.mock('@/hooks', () => ({
...jest.requireActual('@/hooks'),
jest.mock('@/hooks/custom-hooks', () => ({
...jest.requireActual('@/hooks/custom-hooks'),
useQueryString: jest.fn().mockReturnValue({ queryString: { advertId: '' } }),
}));

Expand Down
70 changes: 38 additions & 32 deletions src/components/Modals/FilterModal/__tests__/FilterModal.spec.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,16 @@ jest.mock('@deriv-com/ui', () => ({

const mockUseDevice = useDevice as jest.Mock;

const user = userEvent.setup({ delay: null });

describe('<FilterModal />', () => {
beforeEach(() => {
jest.useFakeTimers();
});

afterEach(() => {
jest.useRealTimers();
});
it('should render the initial page of the FilterModal', async () => {
render(<FilterModal {...mockProps} />);

Expand All @@ -68,7 +77,7 @@ describe('<FilterModal />', () => {
const toggleSwitch = screen.getByRole('checkbox');
const applyButton = screen.getByRole('button', { name: 'Apply' });

await userEvent.click(toggleSwitch);
await user.click(toggleSwitch);

expect(toggleSwitch).not.toBeChecked();
expect(applyButton).toBeEnabled();
Expand All @@ -80,8 +89,8 @@ describe('<FilterModal />', () => {
const toggleSwitch = screen.getByRole('checkbox');
const applyButton = screen.getByRole('button', { name: 'Apply' });

await userEvent.click(toggleSwitch);
await userEvent.click(applyButton);
await user.click(toggleSwitch);
await user.click(applyButton);

expect(mockProps.setSelectedPaymentMethods).toHaveBeenCalled();
expect(mockProps.onToggle).toHaveBeenCalled();
Expand All @@ -94,10 +103,10 @@ describe('<FilterModal />', () => {
const toggleSwitch = screen.getByRole('checkbox');
const resetButton = screen.getByRole('button', { name: 'Reset' });

await userEvent.click(toggleSwitch);
await user.click(toggleSwitch);
expect(toggleSwitch).not.toBeChecked();

await userEvent.click(resetButton);
await user.click(resetButton);

expect(mockProps.setSelectedPaymentMethods).toHaveBeenCalled();
expect(toggleSwitch).toBeChecked();
Expand All @@ -107,7 +116,7 @@ describe('<FilterModal />', () => {
render(<FilterModal {...mockProps} />);

const paymentMethodsText = screen.getByText('Payment methods');
await userEvent.click(paymentMethodsText);
await user.click(paymentMethodsText);

const clearButton = screen.getByRole('button', { name: 'Clear' });
const confirmButton = screen.getByRole('button', { name: 'Confirm' });
Expand All @@ -128,16 +137,14 @@ describe('<FilterModal />', () => {
});

it('should show the search results when user types in the search input', async () => {
jest.useRealTimers();

render(<FilterModal {...mockProps} />);

const paymentMethodsText = screen.getByText('Payment methods');
await userEvent.click(paymentMethodsText);
await user.click(paymentMethodsText);

const searchInput = screen.getByRole('searchbox');

await userEvent.type(searchInput, 'alipay');
await user.type(searchInput, 'alipay');

act(() => {
jest.runAllTimers();
Expand All @@ -148,15 +155,14 @@ describe('<FilterModal />', () => {
});

it('should show No results for message if payment method is not in the list', async () => {
jest.useRealTimers();
render(<FilterModal {...mockProps} />);

const paymentMethodsText = screen.getByText('Payment methods');
await userEvent.click(paymentMethodsText);
await user.click(paymentMethodsText);

const searchInput = screen.getByRole('searchbox');

await userEvent.type(searchInput, 'paypal');
await user.type(searchInput, 'paypal');

act(() => {
jest.runAllTimers();
Expand All @@ -165,7 +171,7 @@ describe('<FilterModal />', () => {
expect(screen.getByText(/No results for "paypal"./s)).toBeInTheDocument();
expect(screen.getByText('Check your spelling or use a different term.')).toBeInTheDocument();

await userEvent.clear(searchInput);
await user.clear(searchInput);

act(() => {
jest.runAllTimers();
Expand All @@ -176,13 +182,13 @@ describe('<FilterModal />', () => {
render(<FilterModal {...mockProps} />);

const paymentMethodsText = screen.getByText('Payment methods');
await userEvent.click(paymentMethodsText);
await user.click(paymentMethodsText);

const alipayCheckbox = screen.getByRole('checkbox', { name: 'Alipay' });
const confirmButton = screen.getByRole('button', { name: 'Confirm' });
const clearButton = screen.getByRole('button', { name: 'Clear' });

await userEvent.click(alipayCheckbox);
await user.click(alipayCheckbox);

expect(alipayCheckbox).toBeChecked();
expect(confirmButton).toBeEnabled();
Expand All @@ -193,13 +199,13 @@ describe('<FilterModal />', () => {
render(<FilterModal {...mockProps} />);

const paymentMethodsText = screen.getByText('Payment methods');
await userEvent.click(paymentMethodsText);
await user.click(paymentMethodsText);

const alipayCheckbox = screen.getByRole('checkbox', { name: 'Alipay' });
const clearButton = screen.getByRole('button', { name: 'Clear' });

await userEvent.click(alipayCheckbox);
await userEvent.click(clearButton);
await user.click(alipayCheckbox);
await user.click(clearButton);

expect(alipayCheckbox).not.toBeChecked();
});
Expand All @@ -208,11 +214,11 @@ describe('<FilterModal />', () => {
render(<FilterModal {...mockProps} />);

const paymentMethodsText = screen.getByText('Payment methods');
await userEvent.click(paymentMethodsText);
await user.click(paymentMethodsText);

const backButton = screen.getByTestId('dt_page_return_btn');

await userEvent.click(backButton);
await user.click(backButton);

expect(screen.getByText('Filter')).toBeInTheDocument();
});
Expand All @@ -221,15 +227,15 @@ describe('<FilterModal />', () => {
render(<FilterModal {...mockProps} />);

const paymentMethodsText = screen.getByText('Payment methods');
await userEvent.click(paymentMethodsText);
await user.click(paymentMethodsText);

const alipayCheckbox = screen.getByRole('checkbox', { name: 'Alipay' });
const bankTransferCheckbox = screen.getByRole('checkbox', { name: 'Bank Transfer' });
const confirmButton = screen.getByRole('button', { name: 'Confirm' });

await userEvent.click(alipayCheckbox);
await userEvent.click(bankTransferCheckbox);
await userEvent.click(confirmButton);
await user.click(alipayCheckbox);
await user.click(bankTransferCheckbox);
await user.click(confirmButton);

expect(screen.getByText('Filter')).toBeInTheDocument();
expect(screen.getByText('Alipay, Bank Transfer')).toBeInTheDocument();
Expand All @@ -239,12 +245,12 @@ describe('<FilterModal />', () => {
render(<FilterModal {...mockProps} />);

const paymentMethodsText = screen.getByText('Payment methods');
await userEvent.click(paymentMethodsText);
await user.click(paymentMethodsText);

const alipayCheckbox = screen.getByRole('checkbox', { name: 'Alipay' });

await userEvent.click(alipayCheckbox);
await userEvent.click(alipayCheckbox);
await user.click(alipayCheckbox);
await user.click(alipayCheckbox);

expect(mockProps.setSelectedPaymentMethods).toHaveBeenCalled();
});
Expand All @@ -254,7 +260,7 @@ describe('<FilterModal />', () => {
const { rerender } = render(<FilterModal {...mockProps} />);

const paymentMethodsText = screen.getByText('Payment methods');
await userEvent.click(paymentMethodsText);
await user.click(paymentMethodsText);

const alipayCheckbox = screen.queryByRole('checkbox', { name: 'Alipay' });
const bankTransferCheckbox = screen.queryByRole('checkbox', { name: 'Bank Transfer' });
Expand Down Expand Up @@ -290,7 +296,7 @@ describe('<FilterModal />', () => {
render(<FilterModal {...mockProps} />);

const backButton = screen.getByTestId('dt_mobile_wrapper_button');
await userEvent.click(backButton);
await user.click(backButton);

expect(mockProps.onRequestClose).toHaveBeenCalled();
});
Expand All @@ -299,10 +305,10 @@ describe('<FilterModal />', () => {
render(<FilterModal {...mockProps} />);

const paymentMethodsText = screen.getByText('Payment methods');
await userEvent.click(paymentMethodsText);
await user.click(paymentMethodsText);

const backButton = screen.getByTestId('dt_mobile_wrapper_button');
await userEvent.click(backButton);
await user.click(backButton);

expect(screen.getByText('Filter')).toBeInTheDocument();
});
Expand Down
33 changes: 17 additions & 16 deletions ...edCountriesModal/PreferredCountriesDropdown/__tests__/PreferredCountriesDropdown.spec.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,8 @@ const mockProps = {
setShouldDisplayFooter: jest.fn(),
};

const user = userEvent.setup({ delay: null });

describe('PreferredCountriesDropdown', () => {
beforeEach(() => {
jest.useFakeTimers();
Expand All @@ -42,50 +44,49 @@ describe('PreferredCountriesDropdown', () => {
it('should handle selecting all countries checkbox for selecting all countries', async () => {
render(<PreferredCountriesDropdown {...mockProps} />);
const allCountriesCheckbox = screen.getByRole('checkbox', { name: 'All countries' });
await userEvent.click(allCountriesCheckbox);
await user.click(allCountriesCheckbox);
expect(mockProps.setSelectedCountries).toHaveBeenCalledWith(['uk', 'us']);
});
it('should handle unselecting all countries checkbox for unselecting all countries', async () => {
render(<PreferredCountriesDropdown {...mockProps} selectedCountries={['uk', 'us']} />);
const allCountriesCheckbox = screen.getByRole('checkbox', { name: 'All countries' });
await userEvent.click(allCountriesCheckbox);
await user.click(allCountriesCheckbox);
expect(mockProps.setSelectedCountries).toHaveBeenCalledWith([]);
});
it('should handle selecting of individual country', async () => {
render(<PreferredCountriesDropdown {...mockProps} />);
const usCheckbox = screen.getByRole('checkbox', { name: 'United States' });
await userEvent.click(usCheckbox);
await user.click(usCheckbox);
expect(mockProps.setSelectedCountries).toHaveBeenCalledWith(['uk', 'us']);
});
it('should handle unselecting of individual country', async () => {
render(<PreferredCountriesDropdown {...mockProps} selectedCountries={['uk', 'us']} />);
const ukCheckbox = screen.getByRole('checkbox', { name: 'United Kingdom' });
await userEvent.click(ukCheckbox);
await user.click(ukCheckbox);
expect(mockProps.setSelectedCountries).toHaveBeenCalledWith(['us']);
});
it('should display no search results message when there are no search results', () => {
it('should display no search results message when there are no search results', async () => {
render(<PreferredCountriesDropdown {...mockProps} />);
const searchInput = screen.getByPlaceholderText('Search countries');
async () => {
await userEvent.type(searchInput, 'India');
};
const searchInput = screen.getByRole('searchbox');

await user.type(searchInput, 'India');
act(() => {
jest.runAllTimers();
});
expect(screen.getByText('No results for “India”.')).toBeInTheDocument();
});
it('should display full list on search clear', () => {
it('should display full list on search clear', async () => {
render(<PreferredCountriesDropdown {...mockProps} />);
const searchInput = screen.getByPlaceholderText('Search countries');
async () => {
await userEvent.type(searchInput, 'India');
};

await user.type(searchInput, 'India');

act(() => {
jest.runAllTimers();
});
async () => {
await userEvent.clear(searchInput);
};

await user.clear(searchInput);

act(() => {
jest.runAllTimers();
});
Expand Down
Loading
Loading