Update

javascript/homeworkPage.js

@@ -61,6 +61,7 @@ class HomeworkPage extends HomeworkElement {
         this.sourceLanguage.setAttribute("id", sourceLanguageTextId)
         this.targetLanguage.setAttribute("id", targetLanguageTextId)
         this.content = this.querySelector('#content')
+        this.content.addEventListener("delete", this.deleteTask.bind(this))
         this.newButton = this.querySelector('#new')
         this.newButton.addEventListener("click", this.newVocabulary.bind(this))
         this.saveButton = this.querySelector('#save')
@@ -72,14 +73,14 @@ class HomeworkPage extends HomeworkElement {
     connectedCallback() {
       console.log("Page of type " + this.type + " added to session")
       if(this.type == HomeworkTypes.VOCABULARY_ENGLISH) {
-        const row = new HomeworkVocabularyTask()
+        const row = new HomeworkVocabularyTask(crypto.randomUUID())
         this.content.append(row)
       }
     }
 
     newVocabulary() {
       if(this.type == HomeworkTypes.VOCABULARY_ENGLISH) {
-        const row = new HomeworkVocabularyTask()
+        const row = new HomeworkVocabularyTask(crypto.randomUUID())
         this.content.append(row)
       }
     }
@@ -91,5 +92,18 @@ class HomeworkPage extends HomeworkElement {
     trainVocabulary() {
       console.log("Train!!")
     }
+
+    deleteTask(event) {
+      const tasks = this.content.querySelectorAll("homework-vocabulary-task")
+      if(tasks.length > 1) {
+        tasks.forEach((task) => {
+          if(event.detail.id == task.getId()) {
+            alert(task.getId())
+            task.remove()
+          }
+        })
+      }
+
+    }
 }
 customElements.define('homework-page', HomeworkPage)