diff --git a/apps/todo-app/app/components/__tests__/add-todo.test.tsx b/apps/todo-app/app/components/__tests__/add-todo.test.tsx index 48be7b5..4ebca54 100644 --- a/apps/todo-app/app/components/__tests__/add-todo.test.tsx +++ b/apps/todo-app/app/components/__tests__/add-todo.test.tsx @@ -9,7 +9,7 @@ let testInputValue = ''; // Mock lucide-react icons vi.mock('lucide-react', () => ({ - Plus: () => null, + Plus: () => null })); // Mock the @lambdacurry/forms components @@ -27,10 +27,12 @@ vi.mock('@lambdacurry/forms', () => ({ className={className} type="text" value={testInputValue} - onChange={(e) => { testInputValue = e.target.value; }} + onChange={e => { + testInputValue = e.target.value; + }} /> ), - FormError: () => null, + FormError: () => null })); interface ButtonProps { @@ -44,7 +46,7 @@ vi.mock('@lambdacurry/forms/ui', () => ({ - ), + ) })); // Mock the remix-hook-form module @@ -86,15 +88,13 @@ vi.mock('remix-hook-form', () => ({ } }), formState: { errors: {} }, - watch: vi.fn((_name: string) => testInputValue), + watch: vi.fn((_name: string) => testInputValue) }; } })); function renderWithRouter(ui: ReactElement) { - const router = createMemoryRouter([ - { path: '/', element: ui } - ], { initialEntries: ['/'] }); + const router = createMemoryRouter([{ path: '/', element: ui }], { initialEntries: ['/'] }); return render(); } @@ -121,7 +121,7 @@ describe('AddTodo', () => { const input = screen.getByPlaceholderText('Add a new todo...'); const button = screen.getByRole('button', { name: ADD_REGEX }); - + fireEvent.change(input, { target: { value: 'New todo' } }); fireEvent.click(button); @@ -134,7 +134,7 @@ describe('AddTodo', () => { const input = screen.getByPlaceholderText('Add a new todo...') as HTMLInputElement; const button = screen.getByRole('button', { name: ADD_REGEX }); - + fireEvent.change(input, { target: { value: 'New todo' } }); fireEvent.click(button); @@ -144,7 +144,7 @@ describe('AddTodo', () => { it('does not call onAdd with empty text', () => { const mockOnAdd = vi.fn(); renderWithRouter(); - + const button = screen.getByRole('button', { name: ADD_REGEX }); fireEvent.click(button); @@ -157,7 +157,7 @@ describe('AddTodo', () => { const input = screen.getByPlaceholderText('Add a new todo...'); const button = screen.getByRole('button', { name: ADD_REGEX }); - + fireEvent.change(input, { target: { value: ' New todo ' } }); fireEvent.click(button); diff --git a/apps/todo-app/app/lib/__tests__/todo-context.test.tsx b/apps/todo-app/app/lib/__tests__/todo-context.test.tsx index 555692f..06403f0 100644 --- a/apps/todo-app/app/lib/__tests__/todo-context.test.tsx +++ b/apps/todo-app/app/lib/__tests__/todo-context.test.tsx @@ -1,7 +1,8 @@ -import { describe, it, expect } from 'vitest'; +import { describe, it, expect, vi } from 'vitest'; import { render, screen, act } from '@testing-library/react'; import { TodoProvider, useTodoStore, getFilteredTodos } from '../todo-context'; -import type { Todo } from '@todo-starter/utils'; +import type { Todo, TodoFilter } from '@todo-starter/utils'; +import { removeFromStorage, saveToStorage } from '@todo-starter/utils'; // Mock crypto.randomUUID for consistent testing Object.defineProperty(global, 'crypto', { @@ -10,6 +11,9 @@ Object.defineProperty(global, 'crypto', { } }); +// Define regex constants at module top level to satisfy lint rule +const COMPLETED_REGEX = / - completed$/; + // Test component to access the context function TestComponent() { const { todos, filter, addTodo, toggleTodo, deleteTodo, updateTodo, setFilter, clearCompleted } = useTodoStore(); @@ -21,23 +25,15 @@ function TestComponent() { - - -