chore(form-error-reporter): implemented destroy in form-error-reporter

This commit is contained in:
Johannes Eder 2021-06-25 11:41:44 +02:00 committed by Sarah Vaupel
parent ded4c1f64e
commit b2c3f77966
2 changed files with 29 additions and 6 deletions

View File

@ -2,6 +2,8 @@
export const EVENT_TYPE = {
CLICK : 'click',
KEYDOWN : 'keydown',
INVALID : 'invalid',
CHANGE : 'change',
//more to be added
};

View File

@ -1,5 +1,6 @@
import { Utility } from '../../core/utility';
import * as defer from 'lodash.defer';
import { EventManager, EventWrapper, EVENT_TYPE } from '../../lib/event-manager/event-manager';
const FORM_ERROR_REPORTER_INITIALIZED_CLASS = 'form-error-remover--initialized';
@ -10,12 +11,16 @@ export class FormErrorReporter {
_element;
_err;
_eventManager;
constructor(element) {
if (!element)
throw new Error('Form Error Reporter utility needs to be passed an element!');
this._element = element;
this._eventManager = new EventManager();
if (this._element.classList.contains(FORM_ERROR_REPORTER_INITIALIZED_CLASS))
return;
@ -24,11 +29,23 @@ export class FormErrorReporter {
start() {
if (this._element.willValidate) {
this._element.addEventListener('invalid', this.report.bind(this));
this._element.addEventListener('change', () => { defer(this.report.bind(this)); } );
let invalidElementEvent = new EventWrapper(EVENT_TYPE.INVALID, this.report.bind(this), this._element);
this._eventManager.registerNewListener(invalidElementEvent);
let changedElementEvent = new EventWrapper(EVENT_TYPE.CHANGE, () => { defer(this.report.bind(this)); }, this._element);
this._eventManager.registerNewListener(changedElementEvent);
}
}
destroy() {
this._eventManager.removeAllEventListenersFromUtil();
this._removeError();
if(this._element.classList.contains(FORM_ERROR_REPORTER_INITIALIZED_CLASS))
this._element.classList.remove(FORM_ERROR_REPORTER_INITIALIZED_CLASS);
}
report() {
const msg = this._element.validity.valid ? null : this._element.validationMessage;
@ -37,10 +54,7 @@ export class FormErrorReporter {
if (!target)
return;
if (this._err && this._err.parentNode) {
this._err.parentNode.removeChild(this._err);
this._err = undefined;
}
this._removeError();
if (!msg) {
target.classList.remove('standalone-field--has-error', 'form-group--has-error');
@ -65,4 +79,11 @@ export class FormErrorReporter {
}
}
}
_removeError() {
if (this._err && this._err.parentNode) {
this._err.parentNode.removeChild(this._err);
this._err = undefined;
}
}
}