@schukai/monster 3.5.0 → 3.8.0

package/source/dom/updater.mjs

@@ -5,10 +5,10 @@
  * License text available at https://www.gnu.org/licenses/agpl-3.0.en.html
  */
 
-import {internalSymbol} from "../constants.mjs";
-import {diff} from "../data/diff.mjs";
-import {Pathfinder} from "../data/pathfinder.mjs";
-import {Pipe} from "../data/pipe.mjs";
+import { internalSymbol } from "../constants.mjs";
+import { diff } from "../data/diff.mjs";
+import { Pathfinder } from "../data/pathfinder.mjs";
+import { Pipe } from "../data/pipe.mjs";
 import {
     ATTRIBUTE_ERRORMESSAGE,
     ATTRIBUTE_UPDATER_ATTRIBUTES,
@@ -17,22 +17,23 @@ import {
     ATTRIBUTE_UPDATER_INSERT_REFERENCE,
     ATTRIBUTE_UPDATER_REMOVE,
     ATTRIBUTE_UPDATER_REPLACE,
-    ATTRIBUTE_UPDATER_SELECT_THIS, customElementUpdaterLinkSymbol
+    ATTRIBUTE_UPDATER_SELECT_THIS,
+    customElementUpdaterLinkSymbol,
 } from "../dom/constants.mjs";
 
-import {Base} from "../types/base.mjs";
-import {isArray, isInstance, isIterable} from "../types/is.mjs";
-import {Observer} from "../types/observer.mjs";
-import {ProxyObserver} from "../types/proxyobserver.mjs";
-import {validateArray, validateInstance} from "../types/validate.mjs";
-import {clone} from "../util/clone.mjs";
-import {trimSpaces} from "../util/trimspaces.mjs";
-import {addToObjectLink} from "./attributes.mjs";
-import {findTargetElementFromEvent} from "./events.mjs";
-import {findDocumentTemplate} from "./template.mjs";
-import {getDocument} from "./util.mjs";
+import { Base } from "../types/base.mjs";
+import { isArray, isInstance, isIterable } from "../types/is.mjs";
+import { Observer } from "../types/observer.mjs";
+import { ProxyObserver } from "../types/proxyobserver.mjs";
+import { validateArray, validateInstance } from "../types/validate.mjs";
+import { clone } from "../util/clone.mjs";
+import { trimSpaces } from "../util/trimspaces.mjs";
+import { addToObjectLink } from "./attributes.mjs";
+import { findTargetElementFromEvent } from "./events.mjs";
+import { findDocumentTemplate } from "./template.mjs";
+import { getDocument } from "./util.mjs";
 
-export {Updater, addObjectWithUpdaterToElement}
+export { Updater, addObjectWithUpdaterToElement };
 
 /**
  * The updater class connects an object with the dom. In this way, structures and contents in the DOM can be programmatically adapted via attributes.
@@ -57,7 +58,6 @@ export {Updater, addObjectWithUpdaterToElement}
  * @summary The updater class connects an object with the dom
  */
 class Updater extends Base {
-
     /**
      * @since 1.8.0
      * @param {HTMLElement} element
@@ -72,7 +72,7 @@ class Updater extends Base {
         /**
          * @type {HTMLElement}
          */
-        if (subject === undefined) subject = {}
+        if (subject === undefined) subject = {};
         if (!isInstance(subject, ProxyObserver)) {
             subject = new ProxyObserver(subject);
         }
@@ -81,27 +81,27 @@ class Updater extends Base {
             element: validateInstance(element, HTMLElement),
             last: {},
             callbacks: new Map(),
-            eventTypes: ['keyup', 'click', 'change', 'drop', 'touchend', 'input'],
-            subject: subject
-        }
-
-        this[internalSymbol].callbacks.set('checkstate', getCheckStateCallback.call(this));
-
-        this[internalSymbol].subject.attachObserver(new Observer(() => {
+            eventTypes: ["keyup", "click", "change", "drop", "touchend", "input"],
+            subject: subject,
+        };
 
-            const s = this[internalSymbol].subject.getRealSubject();
+        this[internalSymbol].callbacks.set("checkstate", getCheckStateCallback.call(this));
 
-            const diffResult = diff(this[internalSymbol].last, s)
-            this[internalSymbol].last = clone(s);
+        this[internalSymbol].subject.attachObserver(
+            new Observer(() => {
+                const s = this[internalSymbol].subject.getRealSubject();
 
-            for (const [, change] of Object.entries(diffResult)) {
-                removeElement.call(this, change);
-                insertElement.call(this, change);
-                updateContent.call(this, change);
-                updateAttributes.call(this, change);
-            }
-        }));
+                const diffResult = diff(this[internalSymbol].last, s);
+                this[internalSymbol].last = clone(s);
 
+                for (const [, change] of Object.entries(diffResult)) {
+                    removeElement.call(this, change);
+                    insertElement.call(this, change);
+                    updateContent.call(this, change);
+                    updateAttributes.call(this, change);
+                }
+            }),
+        );
     }
 
     /**
@@ -137,12 +137,11 @@ class Updater extends Base {
             // @see https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener
             this[internalSymbol].element.addEventListener(type, getControlEventHandler.call(this), {
                 capture: true,
-                passive: true
+                passive: true,
             });
         }
 
         return this;
-
     }
 
     /**
@@ -152,13 +151,11 @@ class Updater extends Base {
      * @return {Updater}
      */
     disableEventProcessing() {
-
         for (const type of this[internalSymbol].eventTypes) {
             this[internalSymbol].element.removeEventListener(type, getControlEventHandler.call(this));
         }
 
         return this;
-
     }
 
     /**
@@ -175,9 +172,9 @@ class Updater extends Base {
      * @return {Promise}
      */
     run() {
-        // the key __init__has no further meaning and is only 
+        // the key __init__has no further meaning and is only
         // used to create the diff for empty objects.
-        this[internalSymbol].last = {'__init__': true};
+        this[internalSymbol].last = { __init__: true };
         return this[internalSymbol].subject.notifyObservers();
     }
 
@@ -219,7 +216,6 @@ class Updater extends Base {
         this[internalSymbol].callbacks.set(name, callback);
         return this;
     }
-
 }
 
 /**
@@ -233,27 +229,25 @@ function getCheckStateCallback() {
     const self = this;
 
     return function (current) {
-
         // this is a reference to the current object (therefore no array function here)
         if (this instanceof HTMLInputElement) {
-            if (['radio', 'checkbox'].indexOf(this.type) !== -1) {
-                return (this.value + "" === current + "") ? 'true' : undefined
+            if (["radio", "checkbox"].indexOf(this.type) !== -1) {
+                return `${this.value}` === `${current}` ? "true" : undefined;
             }
         } else if (this instanceof HTMLOptionElement) {
-
             if (isArray(current) && current.indexOf(this.value) !== -1) {
-                return 'true'
+                return "true";
             }
 
             return undefined;
         }
-    }
+    };
 }
 
 /**
  * @private
  */
-const symbol = Symbol('@schukai/monster/updater@@EventHandler');
+const symbol = Symbol("@schukai/monster/updater@@EventHandler");
 
 /**
  * @private
@@ -262,7 +256,6 @@ const symbol = Symbol('@schukai/monster/updater@@EventHandler');
  * @throws {Error} the bind argument must start as a value with a path
  */
 function getControlEventHandler() {
-
     const self = this;
 
     if (self[symbol]) {
@@ -282,12 +275,9 @@ function getControlEventHandler() {
         }
 
         retrieveAndSetValue.call(self, element);
-
-    }
+    };
 
     return self[symbol];
-
-
 }
 
 /**
@@ -298,15 +288,14 @@ function getControlEventHandler() {
  * @private
  */
 function retrieveAndSetValue(element) {
-
     const self = this;
 
     const pathfinder = new Pathfinder(self[internalSymbol].subject.getSubject());
 
     let path = element.getAttribute(ATTRIBUTE_UPDATER_BIND);
 
-    if (path.indexOf('path:') !== 0) {
-        throw new Error('the bind argument must start as a value with a path');
+    if (path.indexOf("path:") !== 0) {
+        throw new Error("the bind argument must start as a value with a path");
     }
 
     path = path.substring(5);
@@ -315,39 +304,37 @@ function retrieveAndSetValue(element) {
 
     if (element instanceof HTMLInputElement) {
         switch (element.type) {
-
-            case 'checkbox':
+            case "checkbox":
                 value = element.checked ? element.value : undefined;
                 break;
             default:
                 value = element.value;
                 break;
-
-
         }
     } else if (element instanceof HTMLTextAreaElement) {
         value = element.value;
-
     } else if (element instanceof HTMLSelectElement) {
-
         switch (element.type) {
-            case 'select-one':
+            case "select-one":
                 value = element.value;
                 break;
-            case 'select-multiple':
+            case "select-multiple":
                 value = element.value;
 
                 let options = element?.selectedOptions;
                 if (options === undefined) options = element.querySelectorAll(":scope option:checked");
-                value = Array.from(options).map(({value}) => value);
+                value = Array.from(options).map(({ value }) => value);
 
                 break;
         }
 
-
-        // values from customelements 
-    } else if ((element?.constructor?.prototype && !!Object.getOwnPropertyDescriptor(element.constructor.prototype, 'value')?.['get']) || element.hasOwnProperty('value')) {
-        value = element?.['value'];
+        // values from customelements
+    } else if (
+        (element?.constructor?.prototype &&
+            !!Object.getOwnPropertyDescriptor(element.constructor.prototype, "value")?.["get"]) ||
+        element.hasOwnProperty("value")
+    ) {
+        value = element?.["value"];
     } else {
         throw new Error("unsupported object");
     }
@@ -372,14 +359,13 @@ function retrieveAndSetValue(element) {
 function retrieveFromBindings() {
     const self = this;
 
-    if (self[internalSymbol].element.matches('[' + ATTRIBUTE_UPDATER_BIND + ']')) {
-        retrieveAndSetValue.call(self, self[internalSymbol].element)
+    if (self[internalSymbol].element.matches(`[${ATTRIBUTE_UPDATER_BIND}]`)) {
+        retrieveAndSetValue.call(self, self[internalSymbol].element);
     }
 
-    for (const [, element] of self[internalSymbol].element.querySelectorAll('[' + ATTRIBUTE_UPDATER_BIND + ']').entries()) {
-        retrieveAndSetValue.call(self, element)
+    for (const [, element] of self[internalSymbol].element.querySelectorAll(`[${ATTRIBUTE_UPDATER_BIND}]`).entries()) {
+        retrieveAndSetValue.call(self, element);
     }
-
 }
 
 /**
@@ -392,7 +378,9 @@ function retrieveFromBindings() {
 function removeElement(change) {
     const self = this;
 
-    for (const [, element] of self[internalSymbol].element.querySelectorAll(':scope [' + ATTRIBUTE_UPDATER_REMOVE + ']').entries()) {
+    for (const [, element] of self[internalSymbol].element
+        .querySelectorAll(`:scope [${ATTRIBUTE_UPDATER_REMOVE}]`)
+        .entries()) {
         element.parentNode.removeChild(element);
     }
 }
@@ -414,7 +402,7 @@ function insertElement(change) {
     const subject = self[internalSymbol].subject.getRealSubject();
     const document = getDocument();
 
-    let mem = new WeakSet;
+    let mem = new WeakSet();
     let wd = 0;
 
     const container = self[internalSymbol].element;
@@ -423,21 +411,19 @@ function insertElement(change) {
         let found = false;
         wd++;
 
-        let p = clone(change?.['path']);
+        let p = clone(change?.["path"]);
         if (!isArray(p)) return self;
 
         while (p.length > 0) {
-            const current = p.join('.');
+            const current = p.join(".");
 
-            let iterator = new Set;
-            const query = '[' + ATTRIBUTE_UPDATER_INSERT + '*="path:' + current + '"]';
+            let iterator = new Set();
+            const query = `[${ATTRIBUTE_UPDATER_INSERT}*="path:${current}"]`;
 
             const e = container.querySelectorAll(query);
 
             if (e.length > 0) {
-                iterator = new Set(
-                    [...e]
-                )
+                iterator = new Set([...e]);
             }
 
             if (container.matches(query)) {
@@ -445,38 +431,37 @@ function insertElement(change) {
             }
 
             for (const [, containerElement] of iterator.entries()) {
-
                 if (mem.has(containerElement)) continue;
-                mem.add(containerElement)
+                mem.add(containerElement);
 
                 found = true;
 
                 const attributes = containerElement.getAttribute(ATTRIBUTE_UPDATER_INSERT);
                 let def = trimSpaces(attributes);
-                let i = def.indexOf(' ');
+                let i = def.indexOf(" ");
                 let key = trimSpaces(def.substr(0, i));
-                let refPrefix = key + '-';
+                let refPrefix = `${key}-`;
                 let cmd = trimSpaces(def.substr(i));
 
                 // this case is actually excluded by the query but is nevertheless checked again here
-                if (cmd.indexOf('|') > 0) {
+                if (cmd.indexOf("|") > 0) {
                     throw new Error("pipes are not allowed when cloning a node.");
                 }
 
                 let pipe = new Pipe(cmd);
                 self[internalSymbol].callbacks.forEach((f, n) => {
                     pipe.setCallback(n, f);
-                })
+                });
 
-                let value
+                let value;
                 try {
                     containerElement.removeAttribute(ATTRIBUTE_ERRORMESSAGE);
-                    value = pipe.run(subject)
+                    value = pipe.run(subject);
                 } catch (e) {
                     containerElement.setAttribute(ATTRIBUTE_ERRORMESSAGE, e.message);
                 }
 
-                let dataPath = cmd.split(':').pop();
+                let dataPath = cmd.split(":").pop();
 
                 let insertPoint;
                 if (containerElement.hasChildNodes()) {
@@ -484,17 +469,17 @@ function insertElement(change) {
                 }
 
                 if (!isIterable(value)) {
-                    throw new Error('the value is not iterable');
+                    throw new Error("the value is not iterable");
                 }
 
-                let available = new Set;
+                let available = new Set();
 
                 for (const [i, obj] of Object.entries(value)) {
                     let ref = refPrefix + i;
-                    let currentPath = dataPath + "." + i;
+                    let currentPath = `${dataPath}.${i}`;
 
                     available.add(ref);
-                    let refElement = containerElement.querySelector('[' + ATTRIBUTE_UPDATER_INSERT_REFERENCE + '="' + ref + '"]');
+                    let refElement = containerElement.querySelector(`[${ATTRIBUTE_UPDATER_INSERT_REFERENCE}="${ref}"]`);
 
                     if (refElement instanceof HTMLElement) {
                         insertPoint = refElement;
@@ -504,15 +489,19 @@ function insertElement(change) {
                     appendNewDocumentFragment(containerElement, key, ref, currentPath);
                 }
 
-                let nodes = containerElement.querySelectorAll('[' + ATTRIBUTE_UPDATER_INSERT_REFERENCE + '*="' + refPrefix + '"]');
+                let nodes = containerElement.querySelectorAll(
+                    `[${ATTRIBUTE_UPDATER_INSERT_REFERENCE}*="${refPrefix}"]`,
+                );
                 for (const [, node] of Object.entries(nodes)) {
                     if (!available.has(node.getAttribute(ATTRIBUTE_UPDATER_INSERT_REFERENCE))) {
                         try {
                             containerElement.removeChild(node);
                         } catch (e) {
-                            containerElement.setAttribute(ATTRIBUTE_ERRORMESSAGE, (containerElement.getAttribute(ATTRIBUTE_ERRORMESSAGE) + ", " + e.message).trim());
+                            containerElement.setAttribute(
+                                ATTRIBUTE_ERRORMESSAGE,
+                                `${containerElement.getAttribute(ATTRIBUTE_ERRORMESSAGE)}, ${e.message}`.trim(),
+                            );
                         }
-
                     }
                 }
             }
@@ -522,9 +511,8 @@ function insertElement(change) {
 
         if (found === false) break;
         if (wd++ > 200) {
-            throw new Error('the maximum depth for the recursion is reached.');
+            throw new Error("the maximum depth for the recursion is reached.");
         }
-
     }
 }
 
@@ -540,13 +528,11 @@ function insertElement(change) {
  * @throws {Error} no template was found with the specified key.
  */
 function appendNewDocumentFragment(container, key, ref, path) {
-
     let template = findDocumentTemplate(key, container);
 
     let nodes = template.createDocumentFragment();
     for (const [, node] of Object.entries(nodes.childNodes)) {
         if (node instanceof HTMLElement) {
-
             applyRecursive(node, key, path);
             node.setAttribute(ATTRIBUTE_UPDATER_INSERT_REFERENCE, ref);
         }
@@ -565,17 +551,15 @@ function appendNewDocumentFragment(container, key, ref, path) {
  * @return {void}
  */
 function applyRecursive(node, key, path) {
-
     if (node instanceof HTMLElement) {
-
         if (node.hasAttribute(ATTRIBUTE_UPDATER_REPLACE)) {
             let value = node.getAttribute(ATTRIBUTE_UPDATER_REPLACE);
-            node.setAttribute(ATTRIBUTE_UPDATER_REPLACE, value.replaceAll("path:" + key, "path:" + path));
+            node.setAttribute(ATTRIBUTE_UPDATER_REPLACE, value.replaceAll(`path:${key}`, `path:${path}`));
         }
 
         if (node.hasAttribute(ATTRIBUTE_UPDATER_ATTRIBUTES)) {
             let value = node.getAttribute(ATTRIBUTE_UPDATER_ATTRIBUTES);
-            node.setAttribute(ATTRIBUTE_UPDATER_ATTRIBUTES, value.replaceAll("path:" + key, "path:" + path));
+            node.setAttribute(ATTRIBUTE_UPDATER_ATTRIBUTES, value.replaceAll(`path:${key}`, `path:${path}`));
         }
 
         for (const [, child] of Object.entries(node.childNodes)) {
@@ -596,10 +580,10 @@ function updateContent(change) {
     const self = this;
     const subject = self[internalSymbol].subject.getRealSubject();
 
-    let p = clone(change?.['path']);
+    let p = clone(change?.["path"]);
     runUpdateContent.call(this, this[internalSymbol].element, p, subject);
 
-    const slots = this[internalSymbol].element.querySelectorAll('slot');
+    const slots = this[internalSymbol].element.querySelectorAll("slot");
     if (slots.length > 0) {
         for (const [, slot] of Object.entries(slots)) {
             for (const [, element] of Object.entries(slot.assignedNodes())) {
@@ -623,19 +607,17 @@ function runUpdateContent(container, parts, subject) {
     if (!(container instanceof HTMLElement)) return;
     parts = clone(parts);
 
-    let mem = new WeakSet;
+    let mem = new WeakSet();
 
     while (parts.length > 0) {
-        const current = parts.join('.');
+        const current = parts.join(".");
         parts.pop();
 
         // Unfortunately, static data is always changed as well, since it is not possible to react to changes here.
-        const query = '[' + ATTRIBUTE_UPDATER_REPLACE + '^="path:' + current + '"], [' + ATTRIBUTE_UPDATER_REPLACE + '^="static:"]';
-        const e = container.querySelectorAll('' + query);
+        const query = `[${ATTRIBUTE_UPDATER_REPLACE}^="path:${current}"], [${ATTRIBUTE_UPDATER_REPLACE}^="static:"]`;
+        const e = container.querySelectorAll(`${query}`);
 
-        const iterator = new Set([
-            ...e
-        ])
+        const iterator = new Set([...e]);
 
         if (container.matches(query)) {
             iterator.add(container);
@@ -645,22 +627,21 @@ function runUpdateContent(container, parts, subject) {
          * @type {HTMLElement}
          */
         for (const [element] of iterator.entries()) {
-
             if (mem.has(element)) return;
-            mem.add(element)
+            mem.add(element);
 
-            const attributes = element.getAttribute(ATTRIBUTE_UPDATER_REPLACE)
+            const attributes = element.getAttribute(ATTRIBUTE_UPDATER_REPLACE);
             let cmd = trimSpaces(attributes);
 
             let pipe = new Pipe(cmd);
             this[internalSymbol].callbacks.forEach((f, n) => {
                 pipe.setCallback(n, f);
-            })
+            });
 
-            let value
+            let value;
             try {
                 element.removeAttribute(ATTRIBUTE_ERRORMESSAGE);
-                value = pipe.run(subject)
+                value = pipe.run(subject);
             } catch (e) {
                 element.setAttribute(ATTRIBUTE_ERRORMESSAGE, e.message);
             }
@@ -673,18 +654,16 @@ function runUpdateContent(container, parts, subject) {
                 try {
                     element.appendChild(value);
                 } catch (e) {
-                    element.setAttribute(ATTRIBUTE_ERRORMESSAGE, (element.getAttribute(ATTRIBUTE_ERRORMESSAGE) + ", " + e.message).trim());
+                    element.setAttribute(
+                        ATTRIBUTE_ERRORMESSAGE,
+                        `${element.getAttribute(ATTRIBUTE_ERRORMESSAGE)}, ${e.message}`.trim(),
+                    );
                 }
-
             } else {
                 element.innerHTML = value;
             }
-
         }
-
-
     }
-
 }
 
 /**
@@ -697,7 +676,7 @@ function runUpdateContent(container, parts, subject) {
  */
 function updateAttributes(change) {
     const subject = this[internalSymbol].subject.getRealSubject();
-    let p = clone(change?.['path']);
+    let p = clone(change?.["path"]);
     runUpdateAttributes.call(this, this[internalSymbol].element, p, subject);
 }
 
@@ -710,28 +689,25 @@ function updateAttributes(change) {
  * @this Updater
  */
 function runUpdateAttributes(container, parts, subject) {
-
     const self = this;
 
     if (!isArray(parts)) return;
     parts = clone(parts);
 
-    let mem = new WeakSet;
+    let mem = new WeakSet();
 
     while (parts.length > 0) {
-        const current = parts.join('.');
+        const current = parts.join(".");
         parts.pop();
 
-        let iterator = new Set;
+        let iterator = new Set();
 
-        const query = '[' + ATTRIBUTE_UPDATER_SELECT_THIS + '], [' + ATTRIBUTE_UPDATER_ATTRIBUTES + '*="path:' + current + '"], [' + ATTRIBUTE_UPDATER_ATTRIBUTES + '^="static:"]';
+        const query = `[${ATTRIBUTE_UPDATER_SELECT_THIS}], [${ATTRIBUTE_UPDATER_ATTRIBUTES}*="path:${current}"], [${ATTRIBUTE_UPDATER_ATTRIBUTES}^="static:"]`;
 
         const e = container.querySelectorAll(query);
 
         if (e.length > 0) {
-            iterator = new Set(
-                [...e]
-            )
+            iterator = new Set([...e]);
         }
 
         if (container.matches(query)) {
@@ -739,15 +715,14 @@ function runUpdateAttributes(container, parts, subject) {
         }
 
         for (const [element] of iterator.entries()) {
-
             if (mem.has(element)) return;
-            mem.add(element)
+            mem.add(element);
 
-            const attributes = element.getAttribute(ATTRIBUTE_UPDATER_ATTRIBUTES)
+            const attributes = element.getAttribute(ATTRIBUTE_UPDATER_ATTRIBUTES);
 
-            for (let [, def] of Object.entries(attributes.split(','))) {
+            for (let [, def] of Object.entries(attributes.split(","))) {
                 def = trimSpaces(def);
-                let i = def.indexOf(' ');
+                let i = def.indexOf(" ");
                 let name = trimSpaces(def.substr(0, i));
                 let cmd = trimSpaces(def.substr(i));
 
@@ -755,30 +730,26 @@ function runUpdateAttributes(container, parts, subject) {
 
                 self[internalSymbol].callbacks.forEach((f, n) => {
                     pipe.setCallback(n, f, element);
-                })
+                });
 
-                let value
+                let value;
                 try {
                     element.removeAttribute(ATTRIBUTE_ERRORMESSAGE);
-                    value = pipe.run(subject)
+                    value = pipe.run(subject);
                 } catch (e) {
                     element.setAttribute(ATTRIBUTE_ERRORMESSAGE, e.message);
                 }
 
-
                 if (value === undefined) {
-                    element.removeAttribute(name)
-
+                    element.removeAttribute(name);
                 } else if (element.getAttribute(name) !== value) {
                     element.setAttribute(name, value);
                 }
 
                 handleInputControlAttributeUpdate.call(this, element, name, value);
-
             }
         }
     }
-
 }
 
 /**
@@ -794,11 +765,8 @@ function handleInputControlAttributeUpdate(element, name, value) {
     const self = this;
 
     if (element instanceof HTMLSelectElement) {
-
-
         switch (element.type) {
-            case 'select-multiple':
-
+            case "select-multiple":
                 for (const [index, opt] of Object.entries(element.options)) {
                     if (value.indexOf(opt.value) !== -1) {
                         opt.selected = true;
@@ -808,7 +776,7 @@ function handleInputControlAttributeUpdate(element, name, value) {
                 }
 
                 break;
-            case 'select-one':
+            case "select-one":
                 // Only one value may be selected
 
                 for (const [index, opt] of Object.entries(element.options)) {
@@ -820,14 +788,10 @@ function handleInputControlAttributeUpdate(element, name, value) {
 
                 break;
         }
-
-
     } else if (element instanceof HTMLInputElement) {
         switch (element.type) {
-
-            case 'radio':
-                if (name === 'checked') {
-
+            case "radio":
+                if (name === "checked") {
                     if (value !== undefined) {
                         element.checked = true;
                     } else {
@@ -837,10 +801,8 @@ function handleInputControlAttributeUpdate(element, name, value) {
 
                 break;
 
-            case 'checkbox':
-
-                if (name === 'checked') {
-
+            case "checkbox":
+                if (name === "checked") {
                     if (value !== undefined) {
                         element.checked = true;
                     } else {
@@ -849,26 +811,21 @@ function handleInputControlAttributeUpdate(element, name, value) {
                 }
 
                 break;
-            case 'text':
+            case "text":
             default:
-                if (name === 'value') {
-                    element.value = (value === undefined ? "" : value);
+                if (name === "value") {
+                    element.value = value === undefined ? "" : value;
                 }
 
                 break;
-
-
         }
     } else if (element instanceof HTMLTextAreaElement) {
-        if (name === 'value') {
-            element.value = (value === undefined ? "" : value);
+        if (name === "value") {
+            element.value = value === undefined ? "" : value;
         }
     }
-
 }
 
-
-
 /**
  * @param {NodeList|HTMLElement|Set<HTMLElement>} elements
  * @param {Symbol} symbol
@@ -881,44 +838,41 @@ function handleInputControlAttributeUpdate(element, name, value) {
  * @throws {TypeError} the context of the function is not an instance of HTMLElement
  * @throws {TypeError} symbol must be an instance of Symbol
  */
-function addObjectWithUpdaterToElement (elements,symbol, object) {
+function addObjectWithUpdaterToElement(elements, symbol, object) {
     const self = this;
     if (!(self instanceof HTMLElement)) {
-        throw new TypeError('the context of this function must be an instance of HTMLElement');
+        throw new TypeError("the context of this function must be an instance of HTMLElement");
     }
-    
-    if (!(typeof symbol === 'symbol')) {
-        throw new TypeError('symbol must be an instance of Symbol');
+
+    if (!(typeof symbol === "symbol")) {
+        throw new TypeError("symbol must be an instance of Symbol");
     }
 
-    const updaters = new Set;
+    const updaters = new Set();
 
     if (elements instanceof NodeList) {
-        elements = new Set([
-            ...elements
-        ])
+        elements = new Set([...elements]);
     } else if (elements instanceof HTMLElement) {
-        elements = new Set([
-            elements
-        ])
+        elements = new Set([elements]);
     } else if (elements instanceof Set) {
     } else {
-        throw new TypeError('elements is not a valid type. (actual: ' + typeof elements + ')');
+        throw new TypeError(`elements is not a valid type. (actual: ${typeof elements})`);
     }
 
     let result = [];
 
     elements.forEach((element) => {
         if (!(element instanceof HTMLElement)) return;
-        if ((element instanceof HTMLTemplateElement)) return;
+        if (element instanceof HTMLTemplateElement) return;
 
-        const u = new Updater(element, object)
+        const u = new Updater(element, object);
         updaters.add(u);
 
-        result.push(u.run().then(() => {
-            return u.enableEventProcessing();
-        }));
-
+        result.push(
+            u.run().then(() => {
+                return u.enableEventProcessing();
+            }),
+        );
     });
 
     if (updaters.size > 0) {