working on fixing ojs rendering

Author: levizwannah

src/broker/Broker.js

@@ -68,6 +68,24 @@ export default class Broker {
         }
     }
 
+    off(events, listener) {
+        if (Array.isArray(events)) {
+            for (let event of events) {
+                this.off(event, listener);
+            }
+
+            return;
+        }
+
+        events = this.parseEvents(events);
+
+        for (let event of events) {
+            event = event.trim();
+
+            this.#emitter.off(event, listener);
+        }
+    }
+
     verifyEventRegistration(event) {
         if (
             this.#emitOnlyRegisteredEvents &&

src/broker/BrokerRegistrar.js

@@ -1,3 +1,4 @@
+import Component from "../component/Component.js";
 import { container } from "../core/Container.js";
 import { isClass } from "../utils/helpers.js";
 
@@ -65,6 +66,12 @@ export default class BrokerRegistrar {
     for (let ev of events) {
       if (ev.length === 0) continue;
       container.resolve("broker").on(ev, listener.bind(object));
+
+      if (object instanceof Component) {
+        object.__brokerEvents__ = object.__brokerEvents__ || {};
+        object.__brokerEvents__[ev] = object.__brokerEvents__[ev] || [];
+        object.__brokerEvents__[ev].push(listener);
+      }
     }
   }
 }

src/component/Component.js

@@ -95,6 +95,12 @@ export default class Component {
      */
     this.emitter = new Emitter();
 
+    /**
+     * List of events that the component is listening to
+     * from the broker
+     */
+    this.__brokerEvents__ = {};
+
     this.isAnonymous = false;
 
     this.name = name ?? this.constructor.name;
@@ -167,7 +173,21 @@ export default class Component {
     }
 
     const h = container.resolve("h");
-    return h.getComponent(splitted[0]).method(splitted[1], args);
+    let cls = h.getComponent(splitted[0]);
+
+    if (!cls) {
+      console.error(`Component ${splitted[0]} not found`);
+      return;
+    }
+
+    let obj = new cls();
+
+    if (!obj.method) {
+      console.error(`Method ${splitted[1]} not found in ${splitted[0]}`);
+      return;
+    }
+
+    return obj.method(splitted[1], args);
   }
 
   /**
@@ -253,7 +273,6 @@ export default class Component {
    * Get all Emitters declared in the component
    */
   getDeclaredListeners() {
-    
     if (this.__ojsRegistered) {
       console.warn(
         `Component "${this.name}" is already registered. Skipping duplicate registration.`
@@ -310,7 +329,7 @@ export default class Component {
 
             for (let j = 0; j < events.length; j++) {
               let ev = events[j];
-
+ 
               if (!ev.length) continue;
 
               h[m](cmp, ev, (component, event, ...args) => {
@@ -524,7 +543,7 @@ export default class Component {
 
   /**
    * Ensure that the action will get called
-   * even if the event was emitted previous
+   * even if the event was emitted previously
    * @param {string} event
    * @param {...function} listeners
    */

src/component/MarkupEngine.js

@@ -43,10 +43,7 @@ export default class MarkupEngine {
     /**
      *
      * @param {string} name component name
-     * @param {Component} component OpenScript component for rendering.
-     *
-     *
-     * @return {HTMLElement|Array<HTMLElement|String>}
+     * @param {class<Component>} component OpenScript component class.
      */
     this.component = (name, component) => {
       if (!(typeof name === "string")) {
@@ -55,9 +52,9 @@ export default class MarkupEngine {
         );
       }
 
-      if (!(component instanceof Component)) {
+      if (!(component.prototype instanceof Component)) {
         throw new Error(
-          `MarkupEngine.Exception: The component for ${name} must be an Component component. ${component.constructor.name} given`
+          `MarkupEngine.Exception: The component for ${name} must be an Component component. ${component.name} given`
         );
       }