feat(core events): Support await_pattern_init with pattern double registration attempt.

When a pattern is tried to be initialized on the same element twice,
     throw an event and use that event in await_pattern_init to reject
     the promise. When using await_pattern_init you might want to
     try/catch the block to handle any possible double-registration
     errors.

Author: thet

src/core/basepattern.js

@@ -6,6 +6,7 @@
  *
  * For usage, see basepattern.md
  */
+import events from "./events";
 import logging from "./logging";
 
 const log = logging.getLogger("basepattern");
@@ -46,6 +47,14 @@ class BasePattern {
             if (typeof this.el[`pattern-${this.name}`] !== "undefined") {
                 // Do not reinstantiate
                 log.debug(`Not reinstatiating the pattern ${this.name}.`, this.el);
+
+                // Notify that not instantiated
+                this.el.dispatchEvent(
+                    new Event(`not-init.${this.name}.patterns`, {
+                        bubbles: true,
+                        cancelable: false,
+                    })
+                );
                 return;
             }
 
@@ -80,9 +89,15 @@ class BasePattern {
      * @param {function} callback - Callback to call when the event is thrown.
      */
     one(event_name, event_callback) {
-        this.el.addEventListener(`${event_name}.${this.name}.patterns`, event_callback, {
-            once: true,
-        });
+        events.add_event_listener(
+            this.el,
+            `${event_name}.${this.name}.patterns`,
+            `basepattern-one--${event_name}.${this.name}.patterns`,
+            event_callback,
+            {
+                once: true,
+            }
+        );
     }
 
     /**

src/core/basepattern.test.js

@@ -185,7 +185,48 @@ describe("Basepattern class tests", function () {
         expect(el["pattern-example"]).toBeInstanceOf(Pat);
     });
 
-    it("6.1 - Registers a one-time event listener on the element.", async function () {
+    it("6.1 - Can register a special namespaced one-time event listener on the element.", async function () {
+        class Pat extends BasePattern {
+            static name = "example";
+            static trigger = ".example";
+        }
+
+        const el = document.createElement("div");
+
+        const pat = new Pat(el);
+
+        let cnt = 0;
+        pat.one("test", () => {
+            cnt++;
+        });
+
+        el.dispatchEvent(new Event("test.example.patterns")); // Note this special event name.
+
+        expect(cnt).toBe(1);
+
+        // The handler is now unregistered.
+        el.dispatchEvent(new Event("test.example.patterns"));
+
+        expect(cnt).toBe(1);
+    });
+
+    it("6.2 - Throws a init event after asynchronous initialization has finished.", async function () {
+        const events = (await import("./events")).default;
+        class Pat extends BasePattern {
+            static name = "example";
+            static trigger = ".example";
+        }
+
+        const el = document.createElement("div");
+
+        const pat = new Pat(el);
+        await events.await_pattern_init(pat);
+
+        // If test reaches this expect statement, the init event catched.
+        expect(true).toBe(true);
+    });
+
+    it("6.3 - Throws a not-init event in case of an double initialization event which is handled by await_pattern_init.", async function () {
         const events = (await import("./events")).default;
         class Pat extends BasePattern {
             static name = "example";
@@ -200,5 +241,55 @@ describe("Basepattern class tests", function () {
 
         // If test reaches this expect statement, the init event catched.
         expect(true).toBe(true);
+
+        // The same pattern cannot be registered twice without destroying the
+        // first one. If the same pattern is initialized twice on the same
+        // element, a event is thrown.
+        const pat2 = new Pat(el);
+        try {
+            await events.await_pattern_init(pat2);
+        } catch (e) {
+            expect(e instanceof Error).toBe(true);
+            expect(e.message).toBe(`Pattern "example" not initialized.`);
+        }
+
+        // We can also use the catch method of the promise to handle that case.
+        const pat3 = new Pat(el);
+        await events.await_pattern_init(pat3).catch((e) => {
+            expect(e instanceof Error).toBe(true);
+            expect(e.message).toBe(`Pattern "example" not initialized.`);
+            return; // We need to return here.
+        });
+
+        // If test reaches this expect statement, the not-init event was catched.
+        expect(true).toBe(true);
+    });
+
+    it("6.4 - Destroying a pattern before re-initializing again also works together with await_pattern_init.", async function () {
+        const events = (await import("./events")).default;
+        class Pat extends BasePattern {
+            static name = "example";
+            static trigger = ".example";
+        }
+
+        const el = document.createElement("div");
+        el.classList.add("example");
+
+        const pat = new Pat(el);
+        await events.await_pattern_init(pat);
+
+        // If test reaches this expect statement, the init event catched.
+        expect(true).toBe(true);
+
+        pat.destroy();
+
+        const pat2 = new Pat(el);
+        await events.await_pattern_init(pat2).catch(() => {
+            // this is not reached.
+            expect(false).toBe(true);
+        });
+
+        // If test reaches this expect statement, the init event catched.
+        expect(true).toBe(true);
     });
 });

src/core/events.js

@@ -100,7 +100,29 @@ const await_event = (el, event_name) => {
  */
 const await_pattern_init = (pattern) => {
     // See: https://stackoverflow.com/a/44746691/1337474
-    return new Promise((resolve) => pattern.one("init", resolve));
+    return new Promise((resolve, reject) => {
+        // Case initialized
+        pattern.one("init", () => {
+            // Resolve promise and unregister the not-init event handler.
+            remove_event_listener(
+                pattern.el,
+                `basepattern-one--not-init.${pattern.name}.patterns`
+            );
+            resolve();
+        });
+
+        // Case not initialized
+        pattern.one("not-init", () => {
+            // Reject promise and unregister the init event handler.
+            remove_event_listener(
+                pattern.el,
+                `basepattern-one--init.${pattern.name}.patterns`
+            );
+            reject();
+        });
+    }).catch(() => {
+        throw new Error(`Pattern "${pattern.name}" not initialized.`);
+    });
 };
 
 /**

src/core/events.test.js

@@ -65,7 +65,7 @@ describe("core.events tests", () => {
             expect(event_listener_map[el].test_once_event).not.toBeDefined();
         });
 
-        it("Awaits an event to happen", async () => {
+        it("Awaits an event to happen.", async () => {
             const el = document.createElement("div");
 
             window.setTimeout(() => {
@@ -78,7 +78,7 @@ describe("core.events tests", () => {
             expect(true).toBe(true);
         });
 
-        it("Awaits a pattern to be initialized", async () => {
+        it("Awaits a pattern to be initialized.", async () => {
             const pat = Base.extend({
                 name: "tmp",
                 trigger: ".pat-tmp",
@@ -94,7 +94,47 @@ describe("core.events tests", () => {
             expect(true).toBe(true);
         });
 
-        it("Awaits a class based pattern to be initialized", async () => {
+        it("Awaits a class based pattern to be initialized.", async () => {
+            class Pat extends BasePattern {
+                static name = "tmp";
+                static trigger = ".pat-tmp";
+                init() {}
+            }
+
+            const el = document.createElement("div");
+            const instance = new Pat(el);
+
+            await events.await_pattern_init(instance);
+
+            // If test reaches this expect statement, all is fine.
+            expect(true).toBe(true);
+
+            // The same pattern cannot be registered twice without destroying
+            // the first one. If the same pattern is initialized twice on the
+            // same element, a event is thrown.
+            const pat2 = new Pat(el);
+            try {
+                await events.await_pattern_init(pat2);
+            } catch (e) {
+                expect(e instanceof Error).toBe(true);
+                expect(e.message).toBe(`Pattern "tmp" not initialized.`);
+            }
+
+            // We can also use the catch method of the promise to handle that
+            // case.
+            const pat3 = new Pat(el);
+            await events.await_pattern_init(pat3).catch((e) => {
+                expect(e instanceof Error).toBe(true);
+                expect(e.message).toBe(`Pattern "tmp" not initialized.`);
+                return; // We need to return here.
+            });
+
+            // If test reaches this expect statement, the not-init event was
+            // catched.
+            expect(true).toBe(true);
+        });
+
+        it("Handles double-registration attempts by rejecting the await_pattern_init promise.", async () => {
             class Pat extends BasePattern {
                 static name = "tmp";
                 static trigger = ".pat-tmp";