diff --git a/frontend/src/components/HomeComponents/Tasks/AddTaskDialog.tsx b/frontend/src/components/HomeComponents/Tasks/AddTaskDialog.tsx index ff2d47ef..596b5d4b 100644 --- a/frontend/src/components/HomeComponents/Tasks/AddTaskDialog.tsx +++ b/frontend/src/components/HomeComponents/Tasks/AddTaskDialog.tsx @@ -80,26 +80,27 @@ export const AddTaskdialog = ({ - - setNewTask({ - ...newTask, - description: e.target.value, - }) - } - required - className="col-span-3" - /> +
+ + setNewTask({ + ...newTask, + description: e.target.value, + }) + } + required + /> +
-
+
@@ -195,16 +197,17 @@ export const AddTaskdialog = ({ - setTagInput(e.target.value)} - onKeyDown={(e) => e.key === 'Enter' && handleAddTag()} - required - className="col-span-3" - /> +
+ setTagInput(e.target.value)} + onKeyDown={(e) => e.key === 'Enter' && handleAddTag()} + required + /> +
diff --git a/frontend/src/components/HomeComponents/Tasks/Tasks.tsx b/frontend/src/components/HomeComponents/Tasks/Tasks.tsx index 5043fba0..5f37044e 100644 --- a/frontend/src/components/HomeComponents/Tasks/Tasks.tsx +++ b/frontend/src/components/HomeComponents/Tasks/Tasks.tsx @@ -243,6 +243,14 @@ export const Tasks = ( useEffect(() => { if (!isAddTaskOpen) { setIsCreatingNewProject(false); + setTagInput(''); + setNewTask({ + description: '', + priority: '', + project: '', + due: '', + tags: [], + }); } }, [isAddTaskOpen]); diff --git a/frontend/src/components/HomeComponents/Tasks/__tests__/AddTaskDialog.test.tsx b/frontend/src/components/HomeComponents/Tasks/__tests__/AddTaskDialog.test.tsx index 9e114f07..7b1c125f 100644 --- a/frontend/src/components/HomeComponents/Tasks/__tests__/AddTaskDialog.test.tsx +++ b/frontend/src/components/HomeComponents/Tasks/__tests__/AddTaskDialog.test.tsx @@ -258,9 +258,12 @@ describe('AddTaskDialog Component', () => { const prioritySelect = screen.getByLabelText(/priority/i); - expect(prioritySelect).toContainHTML(''); - expect(prioritySelect).toContainHTML(''); - expect(prioritySelect).toContainHTML(''); + expect(prioritySelect).toContainHTML(''); + expect(prioritySelect).toContainHTML(''); + expect(prioritySelect).toContainHTML( + '' + ); + expect(prioritySelect).toContainHTML(''); }); test('shows new project input when creating new project', () => { diff --git a/frontend/src/components/HomeComponents/Tasks/__tests__/Tasks.test.tsx b/frontend/src/components/HomeComponents/Tasks/__tests__/Tasks.test.tsx index a5f510dc..55233b9c 100644 --- a/frontend/src/components/HomeComponents/Tasks/__tests__/Tasks.test.tsx +++ b/frontend/src/components/HomeComponents/Tasks/__tests__/Tasks.test.tsx @@ -180,6 +180,56 @@ describe('Tasks Component', () => { expect(dropdown).toHaveValue('10'); }); + test('reset form fields when Add Task dialog is closed via cancel button', async () => { + render(); + + expect(await screen.findByText('Task 1')).toBeInTheDocument(); + + const addTaskButton = screen.getByRole('button', { name: /add task/i }); + fireEvent.click(addTaskButton); + + const descriptionInput = screen.getByLabelText(/description/i); + fireEvent.change(descriptionInput, { + target: { value: 'New Task Description' }, + }); + + expect(descriptionInput).toHaveValue('New Task Description'); + + const priorityInput = screen.getByLabelText(/priority/i); + fireEvent.change(priorityInput, { target: { value: 'L' } }); + + expect(priorityInput).toHaveValue('L'); + + const projectSelect = await screen.findByTestId('project-select'); + fireEvent.change(projectSelect, { target: { value: 'ProjectA' } }); + + expect(projectSelect).toHaveValue('ProjectA'); + + const tagsInput = screen.getByPlaceholderText('Add a tag'); + fireEvent.change(tagsInput, { target: { value: 'urgent' } }); + fireEvent.keyDown(tagsInput, { key: 'Enter', code: 'Enter' }); + + expect(screen.getByText('urgent')).toBeInTheDocument(); + + const cancelButton = screen.getByRole('button', { name: /cancel/i }); + fireEvent.click(cancelButton); + + await waitFor(() => { + expect(screen.queryByText('Add a new task')).not.toBeInTheDocument(); + }); + + fireEvent.click(addTaskButton); + + const descriptionInputAfter = screen.getByLabelText(/description/i); + const priorityInputAfter = screen.getByLabelText(/priority/i); + const projectSelectAfter = await screen.findByTestId('project-select'); + + expect(descriptionInputAfter).toHaveValue(''); + expect(priorityInputAfter).toHaveValue(''); + expect(projectSelectAfter).toHaveValue(''); + expect(screen.queryByText('urgent')).not.toBeInTheDocument(); + }); + test('loads "tasksPerPage" from localStorage on initial render', async () => { localStorageMock.setItem('mockHashedKey', '20');