Skip to content

Commit

Permalink
fix: test cases after the component gets changed
Browse files Browse the repository at this point in the history
  • Loading branch information
@Achintya-Chatterjee
Achintya-Chatterjee committed Dec 5, 2024
1 parent a6e781b commit 7d7c27b
Show file tree
Hide file tree
Showing 6 changed files with 109 additions and 85 deletions.
22 changes: 9 additions & 13 deletions __tests__/Unit/Components/ProgressForm/inputWithQuestions.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,16 +9,14 @@ jest.mock('next/router', () => ({
const name = 'Test-Question';
const func = jest.fn();

describe('Input field with label', function () {
describe('Input field with label', () => {
beforeEach(() => {
(useRouter as jest.Mock).mockReturnValue({
query: {
dev: 'true',
},
});
(useRouter as jest.Mock).mockImplementation(() => ({
query: { dev: 'false' },
}));
});

it('Should render an input field with the appropriate label in dev mode', function () {
it('Should render a input field with appropriate label', () => {
render(
<InputWithQuestions
name={name}
Expand All @@ -31,12 +29,10 @@ describe('Input field with label', function () {
expect(input).toBeInTheDocument();
});

it('Should render an input field with the appropriate label in production mode', function () {
(useRouter as jest.Mock).mockReturnValue({
query: {
dev: 'false',
},
});
it('Should render with dev mode', () => {
(useRouter as jest.Mock).mockImplementation(() => ({
query: { dev: 'true' },
}));

render(
<InputWithQuestions
Expand Down
37 changes: 37 additions & 0 deletions __tests__/Unit/Components/Tasks/ProgressBar.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,11 @@ import ProgressSlider from '@/components/tasks/card/progressContainer/ProgressSl
import { renderWithRouter } from '@/test_utils/createMockRouter';
import { fireEvent, render, screen } from '@testing-library/react';
import { Provider } from 'react-redux';
import { useRouter } from 'next/router';

jest.mock('next/router', () => ({
useRouter: jest.fn(),
}));

jest.mock('next/router', () => ({
useRouter: jest.fn().mockReturnValue({
Expand All @@ -22,7 +27,15 @@ const DEFAULT_PROPS = {
};

describe('Progress Bar', () => {
beforeEach(() => {
jest.clearAllMocks();
});

test('Should render Progress slider component if progress is true', () => {
(useRouter as jest.Mock).mockImplementation(() => ({
query: { dev: 'true' },
}));

renderWithRouter(
<Provider store={store()}>
<Progressbar
Expand All @@ -40,6 +53,10 @@ describe('Progress Bar', () => {
});

test('Should render Progress Indicator component if progress is false', () => {
(useRouter as jest.Mock).mockImplementation(() => ({
query: { dev: 'false' },
}));

renderWithRouter(
<Provider store={store()}>
<Progressbar
Expand Down Expand Up @@ -70,4 +87,24 @@ describe('Progress Bar', () => {
fireEvent.change(sliderInput, { target: { value: 60 } });
expect(DEFAULT_PROPS.handleProgressChange).toHaveBeenCalled();
});

test('Should handle dev mode correctly', () => {
(useRouter as jest.Mock).mockImplementation(() => ({
query: { dev: 'true' },
}));

renderWithRouter(
<Provider store={store()}>
<Progressbar
{...DEFAULT_PROPS}
progress={true}
isLoading={false}
/>
</Provider>,
{ query: { dev: 'true' } }
);

const progressElement = screen.getByRole('slider');
expect(progressElement).toHaveClass('slider');
});
});
31 changes: 12 additions & 19 deletions __tests__/Unit/Components/Tasks/ProgressIndicator.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,35 +14,28 @@ const DEFAULT_PROPS = {

describe('Progress Indicator', () => {
beforeEach(() => {
(useRouter as jest.Mock).mockReturnValue({
query: {
dev: 'true',
},
});
(useRouter as jest.Mock).mockImplementation(() => ({
query: { dev: 'false' },
}));
});

test('should render the ProgressIndicator in dev mode', () => {
test('should render the ProgressIndicator', () => {
const { container } = render(<ProgressIndicator {...DEFAULT_PROPS} />);
const sliderDiv = container.getElementsByClassName('slider');
const parentDiv = container.getElementsByClassName('progressIndicator');
const childDiv = container.getElementsByClassName('progressStyle');

expect(sliderDiv.length).toBe(1);
expect(parentDiv.length).toBe(1);
expect(childDiv.length).toBe(1);
});

test('should render the ProgressIndicator in production mode', () => {
(useRouter as jest.Mock).mockReturnValue({
query: {
dev: 'false',
},
});
test('should render with dev mode', () => {
(useRouter as jest.Mock).mockImplementation(() => ({
query: { dev: 'true' },
}));

const { container } = render(<ProgressIndicator {...DEFAULT_PROPS} />);
const progressIndicatorDiv =
container.getElementsByClassName('progressIndicator');
const parentDiv = container.getElementsByClassName('slider');
const childDiv = container.getElementsByClassName('progressStyle');

expect(progressIndicatorDiv.length).toBe(1);
expect(parentDiv.length).toBe(1);
expect(childDiv.length).toBe(1);
});
});
32 changes: 8 additions & 24 deletions __tests__/Unit/Components/Tasks/ProgressSlider.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,14 +13,12 @@ describe('Progress Slider', () => {
};

beforeEach(() => {
(useRouter as jest.Mock).mockReturnValue({
query: {
dev: 'true',
},
});
(useRouter as jest.Mock).mockImplementation(() => ({
query: { dev: 'false' },
}));
});

test('should render range input field in dev mode', async () => {
test('should render range input field', async () => {
render(
<ProgressSlider {...DEFAULT_PROPS} value={40} isLoading={false} />
);
Expand All @@ -32,29 +30,15 @@ describe('Progress Slider', () => {
expect(sliderInput).toBeInTheDocument();
});

test('should render range input field in production mode', async () => {
(useRouter as jest.Mock).mockReturnValue({
query: {
dev: 'false',
},
});
test('should render with dev mode styles when dev query is true', async () => {
(useRouter as jest.Mock).mockImplementation(() => ({
query: { dev: 'true' },
}));

render(
<ProgressSlider {...DEFAULT_PROPS} value={40} isLoading={false} />
);
const sliderInput = screen.getByRole('slider');
await fireEvent.change(sliderInput, { target: { value: 50 } });
expect(DEFAULT_PROPS.handleProgressChange).toHaveBeenCalled();
fireEvent.mouseUp(sliderInput);
expect(DEFAULT_PROPS.debounceSlider).toHaveBeenCalled();
expect(sliderInput).toBeInTheDocument();
});

test('should disable slider when isLoading is true', () => {
render(
<ProgressSlider {...DEFAULT_PROPS} value={40} isLoading={true} />
);
const sliderInput = screen.getByRole('slider');
expect(sliderInput).toBeDisabled();
});
});
48 changes: 25 additions & 23 deletions __tests__/Unit/Components/Tasks/ProgressText.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,34 +13,36 @@ const DefaultProps = {

describe('ProgressText', () => {
beforeEach(() => {
(useRouter as jest.Mock).mockReturnValue({
query: {
dev: 'true',
},
});
(useRouter as jest.Mock).mockImplementation(() => ({
query: { dev: 'false' },
}));
});

test('should render Progress update Text in dev mode', () => {
render(<HandleProgressText isLoading={false} {...DefaultProps} />);
const button = screen.getByText('UPDATE');
fireEvent.click(button);
test('should render Progress update Text', () => {
const { getByText } = render(
<HandleProgressText isLoading={false} {...DefaultProps} />
);
fireEvent.click(screen.getByText('UPDATE'));
expect(getByText('UPDATE')).toBeInTheDocument();
});

expect(button).toBeInTheDocument();
test('should render Progress update Text in dev mode', () => {
(useRouter as jest.Mock).mockImplementation(() => ({
query: { dev: 'true' },
}));

const { getByText } = render(
<HandleProgressText isLoading={false} {...DefaultProps} />
);
const updateButton = getByText('UPDATE');
expect(updateButton).toBeInTheDocument();
expect(updateButton.className).toContain('changeProgressTextUpdated');
fireEvent.click(updateButton);
expect(DefaultProps.handleProgressUpdate).toHaveBeenCalled();
});

test('should render Progress update Text in production mode', () => {
(useRouter as jest.Mock).mockReturnValue({
query: {
dev: 'false',
},
});

render(<HandleProgressText isLoading={false} {...DefaultProps} />);
const button = screen.getByText('UPDATE');
fireEvent.click(button);

expect(button).toBeInTheDocument();
expect(DefaultProps.handleProgressUpdate).toHaveBeenCalled();
test('should render loader when loading', () => {
render(<HandleProgressText isLoading={true} {...DefaultProps} />);
expect(screen.queryByText('UPDATE')).not.toBeInTheDocument();
});
});
24 changes: 18 additions & 6 deletions __tests__/Unit/Components/Tasks/TaskUpdateModal.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,8 +57,13 @@ describe('TaskUpdateModal', () => {
isDev: false,
taskDetailsData: mockTaskDetails,
editedTaskDetails: mockEditedTaskDetails,
onUpdateSuccess: jest.fn(),
};

beforeEach(() => {
jest.clearAllMocks();
});

it('should renders the modal when open', () => {
render(
<Provider store={store()}>
Expand All @@ -75,7 +80,8 @@ describe('TaskUpdateModal', () => {
).toBeInTheDocument();
expect(screen.getByTestId('mock-progress-form')).toBeInTheDocument();
});
it('should calls setIsOpen when close button is clicked', () => {

it('should call setIsOpen when close button is clicked', () => {
render(
<Provider store={store()}>
<TaskUpdateModal {...defaultProps} />
Expand All @@ -88,7 +94,7 @@ describe('TaskUpdateModal', () => {
expect(mockSetIsOpen).toHaveBeenCalledWith(false);
});

it('should passes correct props to ProgressContainer', () => {
it('should pass correct props to ProgressContainer', () => {
render(
<Provider store={store()}>
<TaskUpdateModal {...defaultProps} />
Expand All @@ -97,24 +103,30 @@ describe('TaskUpdateModal', () => {

expect(ProgressContainer).toHaveBeenCalledWith(
expect.objectContaining({
isDev: defaultProps.isDev,
content: defaultProps.taskDetailsData,
readOnly: false,
}),
{}
);
});

it(' should passes correct props to ProgressForm', () => {
it('should pass correct props to ProgressForm', () => {
render(
<Provider store={store()}>
<TaskUpdateModal {...defaultProps} />
</Provider>
);

expect(ProgressForm).toHaveBeenCalledWith(expect.any(Object), {});
expect(ProgressForm).toHaveBeenCalledWith(
expect.objectContaining({
questions: expect.any(Array),
onUpdateSuccess: expect.any(Function),
}),
{}
);
});

it(' should displays the correct date from getCurrentDate', () => {
it('should display the correct date from getCurrentDate', () => {
render(
<Provider store={store()}>
<TaskUpdateModal {...defaultProps} />
Expand Down

0 comments on commit 7d7c27b

Please sign in to comment.