diff --git a/examples/accident-counter/src/counter.test.jsx b/examples/accident-counter/src/counter.test.jsx
index 097c366..4fe79f8 100644
--- a/examples/accident-counter/src/counter.test.jsx
+++ b/examples/accident-counter/src/counter.test.jsx
@@ -1,82 +1,34 @@
-import { render, screen, act } from '@testing-library/react';
+import { render, screen } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { Counter } from './counter';
import '@testing-library/jest-dom/vitest';
-describe('Counter ', () => {
- it('renders with an initial count of 0', () => {
+describe.todo('Counter ', () => {
+ beforeEach(() => {
render();
- const counter = screen.getByTestId('counter-count');
- expect(counter).toHaveTextContent('0');
});
- it('disables the "Decrement" and "Reset" buttons when the count is 0', () => {
- render();
- const decrementButton = screen.getByRole('button', { name: /decrement/i });
- const resetButton = screen.getByRole('button', { name: /reset/i });
+ it('renders with an initial count of 0');
- expect(decrementButton).toBeDisabled();
- expect(resetButton).toBeDisabled();
- });
+ it('disables the "Decrement" and "Reset" buttons when the count is 0');
- it('displays "days" when the count is 0', () => {
- render();
- const unit = screen.getByTestId('counter-unit');
- expect(unit).toHaveTextContent('days');
- });
+ it.todo('displays "days" when the count is 0', () => {});
- it('increments the count when the "Increment" button is clicked', async () => {
- render();
- const incrementButton = screen.getByRole('button', { name: /increment/i });
- const counter = screen.getByTestId('counter-count');
+ it.todo(
+ 'increments the count when the "Increment" button is clicked',
+ async () => {},
+ );
- await act(async () => {
- await userEvent.click(incrementButton);
- });
+ it.todo('displays "day" when the count is 1', async () => {});
- expect(counter).toHaveTextContent('1');
- });
+ it.todo(
+ 'decrements the count when the "Decrement" button is clicked',
+ async () => {},
+ );
- it('displays "day" when the count is 1', async () => {
- render();
- const incrementButton = screen.getByRole('button', { name: /increment/i });
- const unit = screen.getByTestId('counter-unit');
-
- await act(async () => {
- await userEvent.click(incrementButton);
- });
-
- expect(unit).toHaveTextContent('day');
- });
-
- it('decrements the count when the "Decrement" button is clicked', async () => {
- render();
- const decrementButton = screen.getByRole('button', { name: /decrement/i });
- const count = screen.getByTestId('counter-count');
-
- expect(decrementButton).not.toBeDisabled();
-
- await act(async () => {
- await userEvent.click(decrementButton);
- });
-
- expect(count).toHaveTextContent('0');
- expect(decrementButton).toBeDisabled();
- });
-
- it('does not allow decrementing below 0', async () => {
- render();
- const decrementButton = screen.getByRole('button', { name: /decrement/i });
- const count = screen.getByTestId('counter-count');
-
- await act(async () => {
- await userEvent.click(decrementButton);
- });
-
- expect(count).toHaveTextContent('0');
- });
+ it.todo('does not allow decrementing below 0', async () => {});
it.todo(
'resets the count when the "Reset" button is clicked',
@@ -88,14 +40,5 @@ describe('Counter ', () => {
() => {},
);
- it('updates the document title based on the count', async () => {
- const { getByRole } = render();
- const incrementButton = getByRole('button', { name: /increment/i });
-
- await act(async () => {
- await userEvent.click(incrementButton);
- });
-
- expect(document.title).toEqual(expect.stringContaining('1 day'));
- });
+ it.todo('updates the document title based on the count', async () => {});
});
diff --git a/examples/accident-counter/src/counter.tsx b/examples/accident-counter/src/counter.tsx
index 7aa6179..7998413 100644
--- a/examples/accident-counter/src/counter.tsx
+++ b/examples/accident-counter/src/counter.tsx
@@ -2,8 +2,8 @@ import React from 'react';
import { useReducer, useEffect } from 'react';
import { reducer } from './reducer';
-export const Counter = ({ initialCount = 0 }) => {
- const [state, dispatch] = useReducer(reducer, { count: initialCount });
+export const Counter = () => {
+ const [state, dispatch] = useReducer(reducer, { count: 0 });
const unit = state.count === 1 ? 'day' : 'days';
useEffect(() => {
diff --git a/examples/accident-counter/tests/counter.spec.js b/examples/accident-counter/tests/counter.spec.js
new file mode 100644
index 0000000..e924d05
--- /dev/null
+++ b/examples/accident-counter/tests/counter.spec.js
@@ -0,0 +1,2 @@
+import { test, expect } from '@playwright/test';
+import { createServer } from 'vite';