diff --git a/Sprint-3/todo-list/index.html b/Sprint-3/todo-list/index.html
index 4d12c4654..3d11115ae 100644
--- a/Sprint-3/todo-list/index.html
+++ b/Sprint-3/todo-list/index.html
@@ -16,6 +16,10 @@
My ToDo List
+
+
diff --git a/Sprint-3/todo-list/script.mjs b/Sprint-3/todo-list/script.mjs
index ba0b2ceae..44c00f49f 100644
--- a/Sprint-3/todo-list/script.mjs
+++ b/Sprint-3/todo-list/script.mjs
@@ -8,6 +8,13 @@ const todos = [];
window.addEventListener("load", () => {
document.getElementById("add-task-btn").addEventListener("click", addNewTodo);
+ document
+ .getElementById("delete-completed-btn")
+ .addEventListener("click", () => {
+ Todos.deleteCompleted(todos);
+ render();
+ });
+
// Populate sample data
Todos.addTask(todos, "Wash the dishes", false);
Todos.addTask(todos, "Do the shopping", true);
diff --git a/Sprint-3/todo-list/todos.mjs b/Sprint-3/todo-list/todos.mjs
index f17ab6a25..acc03678d 100644
--- a/Sprint-3/todo-list/todos.mjs
+++ b/Sprint-3/todo-list/todos.mjs
@@ -26,4 +26,13 @@ export function toggleCompletedOnTask(todos, taskIndex) {
if (todos[taskIndex]) {
todos[taskIndex].completed = !todos[taskIndex].completed;
}
+}
+
+// Delete all completed tasks
+export function deleteCompleted(todos) {
+ for (let i = todos.length - 1; i >= 0; i--) {
+ if (todos[i].completed) {
+ todos.splice(i, 1);
+ }
+ }
}
\ No newline at end of file
diff --git a/Sprint-3/todo-list/todos.test.mjs b/Sprint-3/todo-list/todos.test.mjs
index bae7ae491..fe6e9bc64 100644
--- a/Sprint-3/todo-list/todos.test.mjs
+++ b/Sprint-3/todo-list/todos.test.mjs
@@ -130,3 +130,26 @@ describe("toggleCompletedOnTask()", () => {
});
});
+describe("deleteCompleted()", () => {
+
+ test("Should delete every completed task", () => {
+
+ const todos = createMockTodos();
+
+ Todos.deleteCompleted(todos);
+
+ expect(todos).toHaveLength(2);
+
+ expect(todos[0]).toEqual({
+ task: "Task 2 description",
+ completed: false
+ });
+
+ expect(todos[1]).toEqual({
+ task: "Task 4 description",
+ completed: false
+ });
+
+ });
+
+});