cerchez07/introduction-to-testing
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Remove answers from the accident counter

Browse Source
This commit is contained in:
Steve Kinney
2024-09-30 10:57:35 -06:00
parent 523c05d3f5
commit dc318c10ee
1 changed files with 17 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

78
examples/accident-counter/src/counter.test.jsx
View File

@@ -1,10 +1,11 @@
import { render, screen } from '@testing-library/react'; import { render, screen } from '@testing-library/react';
import userEvent from '@testing-library/user-event'; import userEvent from '@testing-library/user-event';
import { Counter } from './counter'; import { Counter } from './counter';
import '@testing-library/jest-dom'; import '@testing-library/jest-dom';
describe('Counter Component', () => { describe('Counter ', () => {
beforeEach(() => { beforeEach(() => {
render(<Counter />); render(<Counter />);
}); });
@@ -14,72 +15,27 @@ describe('Counter Component', () => {
expect(countElement).toHaveTextContent('0'); expect(countElement).toHaveTextContent('0');
}); });
it('displays "days" when the count is 0', () => {
const unitElement = screen.getByTestId('counter-unit');
expect(unitElement).toHaveTextContent('days');
});
it('increments the count when the "Increment" button is clicked', async () => {
const incrementButton = screen.getByText('Increment');
await userEvent.click(incrementButton); // Using userEvent for a real click event
const countElement = screen.getByTestId('counter-count');
expect(countElement).toHaveTextContent('1');
});
it('displays "day" when the count is 1', async () => {
const incrementButton = screen.getByText('Increment');
await userEvent.click(incrementButton); // Increment the count
const unitElement = screen.getByTestId('counter-unit');
expect(unitElement).toHaveTextContent('day');
});
it('decrements the count when the "Decrement" button is clicked', async () => {
const incrementButton = screen.getByText('Increment');
const decrementButton = screen.getByText('Decrement');
await userEvent.click(incrementButton); // Increment first
await userEvent.click(decrementButton); // Then decrement
const countElement = screen.getByTestId('counter-count');
expect(countElement).toHaveTextContent('0');
});
it('does not allow decrementing below 0', async () => {
const decrementButton = screen.getByText('Decrement');
await userEvent.click(decrementButton); // Should not decrement below 0
const countElement = screen.getByTestId('counter-count');
expect(countElement).toHaveTextContent('0');
});
it('resets the count when the "Reset" button is clicked', async () => {
const incrementButton = screen.getByText('Increment');
const resetButton = screen.getByText('Reset');
await userEvent.click(incrementButton); // Increment first
await userEvent.click(resetButton); // Then reset
const countElement = screen.getByTestId('counter-count');
expect(countElement).toHaveTextContent('0');
});
it('disables the "Decrement" and "Reset" buttons when the count is 0', () => { it('disables the "Decrement" and "Reset" buttons when the count is 0', () => {
const decrementButton = screen.getByText('Decrement'); const decrementButton = screen.getByRole('button', { name: 'Decrement' });
const resetButton = screen.getByText('Reset'); const resetButton = screen.getByRole('button', { name: 'Reset' });
expect(decrementButton).toBeDisabled(); expect(decrementButton).toBeDisabled();
expect(resetButton).toBeDisabled(); expect(resetButton).toBeDisabled();
}); });
it('updates the document title based on the count', async () => { it.todo('displays "days" when the count is 0', () => {});
const incrementButton = screen.getByText('Increment');
await userEvent.click(incrementButton);
expect(document.title).toBe('1 day'); it.todo('increments the count when the "Increment" button is clicked', async () => {});
await userEvent.click(incrementButton); it.todo('displays "day" when the count is 1', async () => {});
expect(document.title).toBe('2 days');
}); it.todo('decrements the count when the "Decrement" button is clicked', async () => {});
it.todo('does not allow decrementing below 0', async () => {});
it.todo('resets the count when the "Reset" button is clicked', async () => {});
it.todo('disables the "Decrement" and "Reset" buttons when the count is 0', () => {});
it.todo('updates the document title based on the count', async () => {});
}); });