From e2aa913ff377261cd6f014dd362a4e9888ec7b32 Mon Sep 17 00:00:00 2001
From: Johannes Eder <ederj@cip.ifi.lmu.de>
Date: Mon, 28 Jun 2021 09:33:53 +0200
Subject: [PATCH] chore(async-form): implemented destroy method in async-form

---
 frontend/src/lib/event-manager/event-manager.js  |  1 +
 frontend/src/utils/async-form/async-form.js      | 13 +++++++++++--
 frontend/src/utils/async-form/async-form.spec.js |  8 +++++++-
 3 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/frontend/src/lib/event-manager/event-manager.js b/frontend/src/lib/event-manager/event-manager.js
index a73a30fc2..5b590052f 100644
--- a/frontend/src/lib/event-manager/event-manager.js
+++ b/frontend/src/lib/event-manager/event-manager.js
@@ -5,6 +5,7 @@ export const EVENT_TYPE = {
     INVALID : 'invalid',
     CHANGE : 'change',
     MOUSE_OVER : 'mouseover',
+    SUBMIT : 'submit',
     //more to be added
 };
 
diff --git a/frontend/src/utils/async-form/async-form.js b/frontend/src/utils/async-form/async-form.js
index 6c0da95c0..19e147be8 100644
--- a/frontend/src/utils/async-form/async-form.js
+++ b/frontend/src/utils/async-form/async-form.js
@@ -1,5 +1,6 @@
 import { Utility } from '../../core/utility';
 import { Datepicker } from '../form/datepicker';
+import { EventManager, EventWrapper, EVENT_TYPE } from '../../lib/event-manager/event-manager';
 import './async-form.sass';
 
 const ASYNC_FORM_INITIALIZED_CLASS = 'check-all--initialized';
@@ -20,6 +21,8 @@ export class AsyncForm {
   _element;
   _app;
 
+  _eventManager;
+
   constructor(element, app) {
     if (!element) {
       throw new Error('Async Form Utility cannot be setup without an element!');
@@ -28,17 +31,23 @@ export class AsyncForm {
     this._element = element;
     this._app = app;
 
+    this._eventManager = new EventManager();
+
     if (this._element.classList.contains(ASYNC_FORM_INITIALIZED_CLASS)) {
       return false;
     }
 
-    this._element.addEventListener('submit', this._submitHandler);
+    const submitEvent = new EventWrapper(EVENT_TYPE.SUBMIT, this._submitHandler.bind(this), this._element);
+    this._eventManager.registerNewListener(submitEvent);
 
     this._element.classList.add(ASYNC_FORM_INITIALIZED_CLASS);
   }
 
   destroy() {
-    // TODO
+    this._eventManager.removeAllEventListenersFromUtil();
+
+    if(this._element.classList.contains(ASYNC_FORM_INITIALIZED_CLASS))
+      this._element.classList.remove(ASYNC_FORM_INITIALIZED_CLASS);
   }
 
   _processResponse(response) {
diff --git a/frontend/src/utils/async-form/async-form.spec.js b/frontend/src/utils/async-form/async-form.spec.js
index f01280b8a..aeb7ce4ba 100644
--- a/frontend/src/utils/async-form/async-form.spec.js
+++ b/frontend/src/utils/async-form/async-form.spec.js
@@ -1,4 +1,4 @@
-import { AsyncForm } from './async-form';
+import { AsyncForm, ASYNC_FORM_INITIALIZED_CLASS } from './async-form';
 
 describe('AsyncForm', () => {
 
@@ -13,6 +13,12 @@ describe('AsyncForm', () => {
     expect(asyncForm).toBeTruthy();
   });
 
+  it('should destroy asyncForm', () => {
+    asyncForm.destroy();
+    expect(asyncForm._eventManager._registeredListeners.length).toBe(0);
+    expect(asyncForm._element.classList).not.toContain(ASYNC_FORM_INITIALIZED_CLASS);
+  });
+
   it('should throw if called without an element', () => {
     expect(() => {
       new AsyncForm();