London|26-ITP-January|Alexandru Pocovnicu|Sprint 3|ToDo List

Sprint-3/todo-list/index.html

@@ -34,7 +34,7 @@ <h1>My ToDo List</h1>
         </div>
       </li>
     </template>
-
+    <button id="delete-completed-tasks">Delete completed tasks</button>
   </div>
 </body>
 </html>

Sprint-3/todo-list/script.mjs

@@ -13,6 +13,11 @@ window.addEventListener("load", () => {
   Todos.addTask(todos, "Do the shopping", true);
 
   render();
+  const deleteButton = document.getElementById("delete-completed-tasks");
+  deleteButton.addEventListener("click", () => {
+    Todos.deleteCompleted(todos);
+    render();
+  });
 });
 
 
@@ -73,4 +78,5 @@ function createListItem(todo, index) {
   });
 
   return li;
-}
+}
+

Sprint-3/todo-list/todos.mjs

@@ -26,4 +26,11 @@ export function toggleCompletedOnTask(todos, taskIndex) {
   if (todos[taskIndex]) {
     todos[taskIndex].completed = !todos[taskIndex].completed;
   }
-}
+}
+export function deleteCompleted(todoList) {
+  for (let i = todoList.length - 1; i >= 0; i--) {
+    if (todoList[i].completed) {
+      todoList.splice(i, 1);
+    }
+  }
+}

Sprint-3/todo-list/todos.test.mjs

@@ -130,3 +130,27 @@ describe("toggleCompletedOnTask()", () => {
   });
 });
 
+describe("deleteCompleted()",()=>{
+  test("remove all completed tasks",()=>{
+    const todoList=createMockTodos()
+    Todos.deleteCompleted(todoList)
+    expect(todoList).toHaveLength(2)
+    expect(todoList).toEqual([
+      { task: "Task 2 description", completed: false },
+      { task: "Task 4 description", completed: false },
+    ]);
+  })
+});
+  test("does nothing when there are no completed tasks", () => {
+    const todoList = [
+      { task: "Task 1 description", completed: false },
+      { task: "Task 2 description", completed: false },
+    ];
+
+    Todos.deleteCompleted(todoList);
+
+    expect(todoList).toEqual([
+      { task: "Task 1 description", completed: false },
+      { task: "Task 2 description", completed: false },
+    ]);
+  });