@domql/element 2.27.18 → 2.28.1

package/create.js

@@ -112,6 +112,8 @@ export const create = async (
   // apply variants
   applyVariant(element, parent)
 
+  addChildrenIfNotInOriginal(element, parent, key)
+
   const onInit = await triggerEventOn('init', element, options)
   if (onInit === false) return element
 
@@ -120,8 +122,6 @@ export const create = async (
   // generate a CLASS name
   assignKeyAsClassname(element)
 
-  addChildrenIfNotInOriginal(element, parent, key)
-
   await renderElement(element, parent, options, attachOptions)
 
   addElementIntoParentChildren(element, parent)

package/dist/cjs/create.js

@@ -73,11 +73,11 @@ const create = async (element, parent, key, options = import_options.OPTIONS.cre
     return (0, import_render.assignNode)(element, parent, key, attachOptions);
   }
   (0, import_component.applyVariant)(element, parent);
+  (0, import_utils.addChildrenIfNotInOriginal)(element, parent, key);
   const onInit = await (0, import_event.triggerEventOn)("init", element, options);
   if (onInit === false) return element;
   await (0, import_event.triggerEventOn)("beforeClassAssign", element, options);
   (0, import_classList.assignKeyAsClassname)(element);
-  (0, import_utils.addChildrenIfNotInOriginal)(element, parent, key);
   await renderElement(element, parent, options, attachOptions);
   addElementIntoParentChildren(element, parent);
   await (0, import_event.triggerEventOn)("complete", element, options);

package/dist/cjs/methods/index.js

@@ -288,9 +288,19 @@ function variables(obj = {}) {
   };
 }
 function call(fnKey, ...args) {
-  var _a;
-  const context = this.context;
-  return (_a = context.utils[fnKey] || context.functions[fnKey] || context.methods[fnKey] || context.snippets[fnKey]) == null ? void 0 : _a.call(this, ...args);
+  var _a, _b, _c, _d;
+  const fn = ((_a = this.context.utils) == null ? void 0 : _a[fnKey]) || ((_b = this.context.functions) == null ? void 0 : _b[fnKey]) || ((_c = this.context.methods) == null ? void 0 : _c[fnKey]) || ((_d = this.context.snippets) == null ? void 0 : _d[fnKey]);
+  if (!fn) return void 0;
+  try {
+    const result = fn.call(this, ...args);
+    if (result && typeof result.then === "function") {
+      return result;
+    }
+    return result;
+  } catch (error2) {
+    console.error(`Error calling '${fnKey}':`, error2);
+    throw error2;
+  }
 }
 const METHODS = [
   "set",

package/dist/cjs/mixins/content.js

@@ -26,12 +26,13 @@ __export(content_exports, {
 module.exports = __toCommonJS(content_exports);
 var import_utils = require("@domql/utils");
 var import_set = require("../set.js");
-const updateContent = function(params, options) {
+const updateContent = async function(params, options) {
   const element = this;
   const ref = element.__ref;
   const contentKey = ref.contentElementKey;
   if (!element[contentKey]) return;
-  if (element[contentKey].update) element[contentKey].update(params, options);
+  if (element[contentKey].update)
+    await element[contentKey].update(params, options);
 };
 const removeContent = function(el, opts = {}) {
   const element = el || this;
@@ -40,16 +41,20 @@ const removeContent = function(el, opts = {}) {
   if (opts.contentElementKey !== "content") opts.contentElementKey = "content";
   if (element[contentElementKey]) {
     if (element[contentElementKey].node && element.node) {
-      if (element[contentElementKey].tag === "fragment") element.node.innerHTML = "";
+      if (element[contentElementKey].tag === "fragment")
+        element.node.innerHTML = "";
       else {
         const contentNode = element[contentElementKey].node;
-        if (contentNode.parentNode === element.node) element.node.removeChild(element[contentElementKey].node);
+        if (contentNode.parentNode === element.node)
+          element.node.removeChild(element[contentElementKey].node);
       }
     }
     const { __cached } = ref;
     if (__cached && __cached[contentElementKey]) {
-      if (__cached[contentElementKey].tag === "fragment") __cached[contentElementKey].parent.node.innerHTML = "";
-      else if (__cached[contentElementKey] && (0, import_utils.isFunction)(__cached[contentElementKey].remove)) __cached[contentElementKey].remove();
+      if (__cached[contentElementKey].tag === "fragment")
+        __cached[contentElementKey].parent.node.innerHTML = "";
+      else if (__cached[contentElementKey] && (0, import_utils.isFunction)(__cached[contentElementKey].remove))
+        __cached[contentElementKey].remove();
     }
     delete element[contentElementKey];
   }
@@ -58,7 +63,7 @@ async function setContent(param, element, node, opts) {
   const contentElementKey = (0, import_utils.setContentKey)(element, opts);
   if (param && element) {
     if (element[contentElementKey].update) {
-      element[contentElementKey].update({}, opts);
+      await element[contentElementKey].update({}, opts);
     } else {
       await import_set.set.call(element, param, opts);
     }

package/dist/cjs/node.js

@@ -62,21 +62,20 @@ const createNode = async (element, options) => {
     if ((0, import_utils.isUndefined)(value) || (0, import_methods.isMethod)(param, element) || (0, import_utils.isVariant)(param) || (0, import_utils.isObject)(import_mixins.REGISTRY[param]))
       continue;
     const isElement = await (0, import_applyParam.applyParam)(param, element, options);
-    if (isElement) {
-      const { hasDefine, hasContextDefine } = isElement;
-      if (element[param] && !hasDefine && !hasContextDefine) {
-        const createAsync = async () => {
-          await (0, import_create.create)((0, import_utils.exec)(value, element), element, param, options);
-        };
-        if (element.props && element.props.lazyLoad || options.lazyLoad) {
-          window.requestAnimationFrame(async () => {
-            await createAsync();
-            if (!options.preventUpdateListener) {
-              await (0, import_event.triggerEventOn)("lazyLoad", element, options);
-            }
-          });
-        } else await createAsync();
-      }
+    if (!isElement) continue;
+    const { hasDefine, hasContextDefine } = isElement;
+    if (isElement && value && !hasDefine && !hasContextDefine) {
+      const createAsync = async () => {
+        await (0, import_create.create)(await (0, import_utils.exec)(value, element), element, param, options);
+      };
+      if (element.props && element.props.lazyLoad || options.lazyLoad) {
+        window.requestAnimationFrame(async () => {
+          await createAsync();
+          if (!options.preventUpdateListener) {
+            await (0, import_event.triggerEventOn)("lazyLoad", element, options);
+          }
+        });
+      } else await createAsync();
     }
   }
   return element;

package/dist/cjs/set.js

@@ -33,6 +33,7 @@ var import_event = require("@domql/event");
 const resetElement = async (params, element, options) => {
   if (!options.preventRemove) (0, import_content.removeContent)(element, options);
   const { __ref: ref } = element;
+  if (params instanceof Promise) console.log(params, params instanceof Promise);
   await (0, import_create.create)(params, element, ref.contentElementKey || "content", {
     ignoreChildExtend: true,
     ...import_mixins.registry.defaultOptions,
@@ -60,11 +61,17 @@ const set = async function(params, options = {}, el) {
   if (options.preventContentUpdate === true && !hasCollection) return;
   if (ref.__noCollectionDifference || __contentRef && __contentRef.__cached && (0, import_utils.deepContains)(params, content)) {
     if (!options.preventBeforeUpdateListener && !options.preventListeners) {
-      const beforeUpdateReturns = await (0, import_event.triggerEventOnUpdate)("beforeUpdate", params, element, options);
+      const beforeUpdateReturns = await (0, import_event.triggerEventOnUpdate)(
+        "beforeUpdate",
+        params,
+        element,
+        options
+      );
       if (beforeUpdateReturns === false) return element;
     }
     if (content == null ? void 0 : content.update) await content.update();
-    if (!options.preventUpdateListener) await (0, import_event.triggerEventOn)("update", element, options);
+    if (!options.preventUpdateListener)
+      await (0, import_event.triggerEventOn)("update", element, options);
     return;
   }
   if (params) {

package/dist/cjs/utils/applyParam.js

@@ -25,7 +25,7 @@ var import_utils = require("@domql/utils");
 var import_mixins = require("../mixins/index.js");
 const applyParam = async (param, element, options) => {
   const { node, context, __ref: ref } = element;
-  const prop = element[param];
+  const prop = await (0, import_utils.exec)(element[param], element);
   const { onlyUpdate } = options;
   const DOMQLProperty = import_mixins.REGISTRY[param];
   const DOMQLPropertyFromContext = context && context.registry && context.registry[param];

package/dist/cjs/utils/propEvents.js

@@ -32,7 +32,7 @@ const propagateEventsFromProps = (element) => {
     if ((0, import_utils.isFunction)(origEvent)) {
       on[eventName] = (...args) => {
         const originalEventRetunrs = origEvent(...args);
-        if (originalEventRetunrs !== false) funcFromProps(...args);
+        if (originalEventRetunrs !== false) return funcFromProps(...args);
       };
     } else on[eventName] = funcFromProps;
   });

package/dist/esm/create.js

@@ -69,11 +69,11 @@ const create = async (element, parent, key, options = OPTIONS.create || {}, atta
     return assignNode(element, parent, key, attachOptions);
   }
   applyVariant(element, parent);
+  addChildrenIfNotInOriginal(element, parent, key);
   const onInit = await triggerEventOn("init", element, options);
   if (onInit === false) return element;
   await triggerEventOn("beforeClassAssign", element, options);
   assignKeyAsClassname(element);
-  addChildrenIfNotInOriginal(element, parent, key);
   await renderElement(element, parent, options, attachOptions);
   addElementIntoParentChildren(element, parent);
   await triggerEventOn("complete", element, options);

package/dist/esm/methods/index.js

@@ -251,9 +251,19 @@ function variables(obj = {}) {
   };
 }
 function call(fnKey, ...args) {
-  var _a;
-  const context = this.context;
-  return (_a = context.utils[fnKey] || context.functions[fnKey] || context.methods[fnKey] || context.snippets[fnKey]) == null ? void 0 : _a.call(this, ...args);
+  var _a, _b, _c, _d;
+  const fn = ((_a = this.context.utils) == null ? void 0 : _a[fnKey]) || ((_b = this.context.functions) == null ? void 0 : _b[fnKey]) || ((_c = this.context.methods) == null ? void 0 : _c[fnKey]) || ((_d = this.context.snippets) == null ? void 0 : _d[fnKey]);
+  if (!fn) return void 0;
+  try {
+    const result = fn.call(this, ...args);
+    if (result && typeof result.then === "function") {
+      return result;
+    }
+    return result;
+  } catch (error2) {
+    console.error(`Error calling '${fnKey}':`, error2);
+    throw error2;
+  }
 }
 const METHODS = [
   "set",

package/dist/esm/mixins/content.js

@@ -1,11 +1,12 @@
 import { isFunction, setContentKey } from "@domql/utils";
 import { set } from "../set.js";
-const updateContent = function(params, options) {
+const updateContent = async function(params, options) {
   const element = this;
   const ref = element.__ref;
   const contentKey = ref.contentElementKey;
   if (!element[contentKey]) return;
-  if (element[contentKey].update) element[contentKey].update(params, options);
+  if (element[contentKey].update)
+    await element[contentKey].update(params, options);
 };
 const removeContent = function(el, opts = {}) {
   const element = el || this;
@@ -14,16 +15,20 @@ const removeContent = function(el, opts = {}) {
   if (opts.contentElementKey !== "content") opts.contentElementKey = "content";
   if (element[contentElementKey]) {
     if (element[contentElementKey].node && element.node) {
-      if (element[contentElementKey].tag === "fragment") element.node.innerHTML = "";
+      if (element[contentElementKey].tag === "fragment")
+        element.node.innerHTML = "";
       else {
         const contentNode = element[contentElementKey].node;
-        if (contentNode.parentNode === element.node) element.node.removeChild(element[contentElementKey].node);
+        if (contentNode.parentNode === element.node)
+          element.node.removeChild(element[contentElementKey].node);
       }
     }
     const { __cached } = ref;
     if (__cached && __cached[contentElementKey]) {
-      if (__cached[contentElementKey].tag === "fragment") __cached[contentElementKey].parent.node.innerHTML = "";
-      else if (__cached[contentElementKey] && isFunction(__cached[contentElementKey].remove)) __cached[contentElementKey].remove();
+      if (__cached[contentElementKey].tag === "fragment")
+        __cached[contentElementKey].parent.node.innerHTML = "";
+      else if (__cached[contentElementKey] && isFunction(__cached[contentElementKey].remove))
+        __cached[contentElementKey].remove();
     }
     delete element[contentElementKey];
   }
@@ -32,7 +37,7 @@ async function setContent(param, element, node, opts) {
   const contentElementKey = setContentKey(element, opts);
   if (param && element) {
     if (element[contentElementKey].update) {
-      element[contentElementKey].update({}, opts);
+      await element[contentElementKey].update({}, opts);
     } else {
       await set.call(element, param, opts);
     }

package/dist/esm/node.js

@@ -48,21 +48,20 @@ const createNode = async (element, options) => {
     if (isUndefined(value) || isMethod(param, element) || isVariant(param) || isObject(REGISTRY[param]))
       continue;
     const isElement = await applyParam(param, element, options);
-    if (isElement) {
-      const { hasDefine, hasContextDefine } = isElement;
-      if (element[param] && !hasDefine && !hasContextDefine) {
-        const createAsync = async () => {
-          await create(exec(value, element), element, param, options);
-        };
-        if (element.props && element.props.lazyLoad || options.lazyLoad) {
-          window.requestAnimationFrame(async () => {
-            await createAsync();
-            if (!options.preventUpdateListener) {
-              await triggerEventOn("lazyLoad", element, options);
-            }
-          });
-        } else await createAsync();
-      }
+    if (!isElement) continue;
+    const { hasDefine, hasContextDefine } = isElement;
+    if (isElement && value && !hasDefine && !hasContextDefine) {
+      const createAsync = async () => {
+        await create(await exec(value, element), element, param, options);
+      };
+      if (element.props && element.props.lazyLoad || options.lazyLoad) {
+        window.requestAnimationFrame(async () => {
+          await createAsync();
+          if (!options.preventUpdateListener) {
+            await triggerEventOn("lazyLoad", element, options);
+          }
+        });
+      } else await createAsync();
     }
   }
   return element;

package/dist/esm/set.js

@@ -7,6 +7,7 @@ import { triggerEventOn, triggerEventOnUpdate } from "@domql/event";
 const resetElement = async (params, element, options) => {
   if (!options.preventRemove) removeContent(element, options);
   const { __ref: ref } = element;
+  if (params instanceof Promise) console.log(params, params instanceof Promise);
   await create(params, element, ref.contentElementKey || "content", {
     ignoreChildExtend: true,
     ...registry.defaultOptions,
@@ -34,11 +35,17 @@ const set = async function(params, options = {}, el) {
   if (options.preventContentUpdate === true && !hasCollection) return;
   if (ref.__noCollectionDifference || __contentRef && __contentRef.__cached && deepContains(params, content)) {
     if (!options.preventBeforeUpdateListener && !options.preventListeners) {
-      const beforeUpdateReturns = await triggerEventOnUpdate("beforeUpdate", params, element, options);
+      const beforeUpdateReturns = await triggerEventOnUpdate(
+        "beforeUpdate",
+        params,
+        element,
+        options
+      );
       if (beforeUpdateReturns === false) return element;
     }
     if (content == null ? void 0 : content.update) await content.update();
-    if (!options.preventUpdateListener) await triggerEventOn("update", element, options);
+    if (!options.preventUpdateListener)
+      await triggerEventOn("update", element, options);
     return;
   }
   if (params) {

package/dist/esm/utils/applyParam.js

@@ -1,8 +1,8 @@
-import { isFunction } from "@domql/utils";
+import { exec, isFunction } from "@domql/utils";
 import { REGISTRY } from "../mixins/index.js";
 const applyParam = async (param, element, options) => {
   const { node, context, __ref: ref } = element;
-  const prop = element[param];
+  const prop = await exec(element[param], element);
   const { onlyUpdate } = options;
   const DOMQLProperty = REGISTRY[param];
   const DOMQLPropertyFromContext = context && context.registry && context.registry[param];

package/dist/esm/utils/propEvents.js

@@ -9,7 +9,7 @@ const propagateEventsFromProps = (element) => {
     if (isFunction(origEvent)) {
       on[eventName] = (...args) => {
         const originalEventRetunrs = origEvent(...args);
-        if (originalEventRetunrs !== false) funcFromProps(...args);
+        if (originalEventRetunrs !== false) return funcFromProps(...args);
       };
     } else on[eventName] = funcFromProps;
   });

package/methods/index.js

@@ -302,14 +302,41 @@ export function variables (obj = {}) {
   }
 }
 
+/**
+ * A unified call function that detects the calling context and adapts accordingly.
+ * - When called in an async context (with await), it fully resolves promises
+ * - When called in a sync context, it returns sync results directly and handles promises appropriately
+ *
+ * @param {string} fnKey - The name of the function to call
+ * @param {...any} args - Arguments to pass to the function
+ * @returns {any|Promise} - The result or a Promise to the result
+ */
 export function call (fnKey, ...args) {
-  const context = this.context
-  return (
-    context.utils[fnKey] ||
-    context.functions[fnKey] ||
-    context.methods[fnKey] ||
-    context.snippets[fnKey]
-  )?.call(this, ...args)
+  const fn =
+    this.context.utils?.[fnKey] ||
+    this.context.functions?.[fnKey] ||
+    this.context.methods?.[fnKey] ||
+    this.context.snippets?.[fnKey]
+
+  if (!fn) return undefined
+
+  try {
+    // Call the function
+    const result = fn.call(this, ...args)
+
+    // Handle promises
+    if (result && typeof result.then === 'function') {
+      // This magic allows the function to be awaited if called with await
+      // but still work reasonably when called without await
+      return result
+    }
+
+    // Return synchronous results directly
+    return result
+  } catch (error) {
+    console.error(`Error calling '${fnKey}':`, error)
+    throw error
+  }
 }
 
 export const METHODS = [

package/mixins/content.js

@@ -3,14 +3,15 @@
 import { isFunction, setContentKey } from '@domql/utils'
 import { set } from '../set.js'
 
-export const updateContent = function (params, options) {
+export const updateContent = async function (params, options) {
   const element = this
   const ref = element.__ref
 
   const contentKey = ref.contentElementKey
 
   if (!element[contentKey]) return
-  if (element[contentKey].update) element[contentKey].update(params, options)
+  if (element[contentKey].update)
+    await element[contentKey].update(params, options)
 }
 
 export const removeContent = function (el, opts = {}) {
@@ -20,17 +21,24 @@ export const removeContent = function (el, opts = {}) {
   if (opts.contentElementKey !== 'content') opts.contentElementKey = 'content'
   if (element[contentElementKey]) {
     if (element[contentElementKey].node && element.node) {
-      if (element[contentElementKey].tag === 'fragment') element.node.innerHTML = ''
+      if (element[contentElementKey].tag === 'fragment')
+        element.node.innerHTML = ''
       else {
         const contentNode = element[contentElementKey].node
-        if (contentNode.parentNode === element.node) element.node.removeChild(element[contentElementKey].node)
+        if (contentNode.parentNode === element.node)
+          element.node.removeChild(element[contentElementKey].node)
       }
     }
 
     const { __cached } = ref
     if (__cached && __cached[contentElementKey]) {
-      if (__cached[contentElementKey].tag === 'fragment') __cached[contentElementKey].parent.node.innerHTML = ''
-      else if (__cached[contentElementKey] && isFunction(__cached[contentElementKey].remove)) __cached[contentElementKey].remove()
+      if (__cached[contentElementKey].tag === 'fragment')
+        __cached[contentElementKey].parent.node.innerHTML = ''
+      else if (
+        __cached[contentElementKey] &&
+        isFunction(__cached[contentElementKey].remove)
+      )
+        __cached[contentElementKey].remove()
     }
 
     delete element[contentElementKey]
@@ -45,7 +53,7 @@ export async function setContent (param, element, node, opts) {
   const contentElementKey = setContentKey(element, opts)
   if (param && element) {
     if (element[contentElementKey].update) {
-      element[contentElementKey].update({}, opts)
+      await element[contentElementKey].update({}, opts)
     } else {
       await set.call(element, param, opts)
     }

package/node.js

@@ -79,23 +79,24 @@ export const createNode = async (element, options) => {
       continue
 
     const isElement = await applyParam(param, element, options)
-    if (isElement) {
-      const { hasDefine, hasContextDefine } = isElement
-      if (element[param] && !hasDefine && !hasContextDefine) {
-        const createAsync = async () => {
-          await create(exec(value, element), element, param, options)
-        }
-
-        if ((element.props && element.props.lazyLoad) || options.lazyLoad) {
-          window.requestAnimationFrame(async () => {
-            await createAsync()
-            // handle lazy load
-            if (!options.preventUpdateListener) {
-              await triggerEventOn('lazyLoad', element, options)
-            }
-          })
-        } else await createAsync()
+    if (!isElement) continue
+
+    const { hasDefine, hasContextDefine } = isElement
+
+    if (isElement && value && !hasDefine && !hasContextDefine) {
+      const createAsync = async () => {
+        await create(await exec(value, element), element, param, options)
       }
+
+      if ((element.props && element.props.lazyLoad) || options.lazyLoad) {
+        window.requestAnimationFrame(async () => {
+          await createAsync()
+          // handle lazy load
+          if (!options.preventUpdateListener) {
+            await triggerEventOn('lazyLoad', element, options)
+          }
+        })
+      } else await createAsync()
     }
   }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@domql/element",
-  "version": "2.27.18",
+  "version": "2.28.1",
   "license": "MIT",
   "type": "module",
   "module": "index.js",
@@ -27,12 +27,12 @@
     "prepublish": "npx rimraf -I dist && npm run build && npm run copy:package:cjs"
   },
   "dependencies": {
-    "@domql/event": "^2.27.18",
-    "@domql/render": "^2.27.18",
-    "@domql/state": "^2.27.18",
-    "@domql/utils": "^2.27.18"
+    "@domql/event": "^2.28.1",
+    "@domql/render": "^2.28.1",
+    "@domql/state": "^2.28.1",
+    "@domql/utils": "^2.28.1"
   },
-  "gitHead": "0d6418dd1eabd119d4ef1b6bb07b7733151878a5",
+  "gitHead": "371cc070cdca345fcd7ea73558d336a03c847825",
   "devDependencies": {
     "@babel/core": "^7.26.0"
   }

package/set.js

@@ -11,6 +11,7 @@ import { triggerEventOn, triggerEventOnUpdate } from '@domql/event'
 export const resetElement = async (params, element, options) => {
   if (!options.preventRemove) removeContent(element, options)
   const { __ref: ref } = element
+  if (params instanceof Promise) console.log(params, params instanceof Promise)
   await create(params, element, ref.contentElementKey || 'content', {
     ignoreChildExtend: true,
     ...registry.defaultOptions,
@@ -19,7 +20,7 @@ export const resetElement = async (params, element, options) => {
   })
 }
 
-export const reset = async (options) => {
+export const reset = async options => {
   const element = this
   await create(element, element.parent, undefined, {
     ignoreChildExtend: true,
@@ -37,16 +38,26 @@ export const set = async function (params, options = {}, el) {
   const __contentRef = content && content.__ref
   const lazyLoad = element.props && element.props.lazyLoad
 
-  const hasCollection = element.$collection || element.$stateCollection || element.$propsCollection
+  const hasCollection =
+    element.$collection || element.$stateCollection || element.$propsCollection
   if (options.preventContentUpdate === true && !hasCollection) return
 
-  if (ref.__noCollectionDifference || (__contentRef && __contentRef.__cached && deepContains(params, content))) {
+  if (
+    ref.__noCollectionDifference ||
+    (__contentRef && __contentRef.__cached && deepContains(params, content))
+  ) {
     if (!options.preventBeforeUpdateListener && !options.preventListeners) {
-      const beforeUpdateReturns = await triggerEventOnUpdate('beforeUpdate', params, element, options)
+      const beforeUpdateReturns = await triggerEventOnUpdate(
+        'beforeUpdate',
+        params,
+        element,
+        options
+      )
       if (beforeUpdateReturns === false) return element
     }
     if (content?.update) await content.update()
-    if (!options.preventUpdateListener) await triggerEventOn('update', element, options)
+    if (!options.preventUpdateListener)
+      await triggerEventOn('update', element, options)
     return
   }
 

package/utils/applyParam.js

@@ -1,16 +1,17 @@
 'use strict'
 
-import { isFunction } from '@domql/utils'
+import { exec, isFunction } from '@domql/utils'
 import { REGISTRY } from '../mixins/index.js'
 
 export const applyParam = async (param, element, options) => {
   const { node, context, __ref: ref } = element
-  const prop = element[param]
+  const prop = await exec(element[param], element)
 
   const { onlyUpdate } = options
 
   const DOMQLProperty = REGISTRY[param]
-  const DOMQLPropertyFromContext = context && context.registry && context.registry[param]
+  const DOMQLPropertyFromContext =
+    context && context.registry && context.registry[param]
   const isGlobalTransformer = DOMQLPropertyFromContext || DOMQLProperty
 
   const hasDefine = element.define && element.define[param]
@@ -18,7 +19,9 @@ export const applyParam = async (param, element, options) => {
 
   if (!ref.__if) return
 
-  const hasOnlyUpdate = onlyUpdate ? (onlyUpdate === param || element.lookup(onlyUpdate)) : true
+  const hasOnlyUpdate = onlyUpdate
+    ? onlyUpdate === param || element.lookup(onlyUpdate)
+    : true
 
   if (isGlobalTransformer && !hasContextDefine && hasOnlyUpdate) {
     if (isFunction(isGlobalTransformer)) {

package/utils/propEvents.js

@@ -12,7 +12,7 @@ export const propagateEventsFromProps = (element) => {
     if (isFunction(origEvent)) {
       on[eventName] = (...args) => {
         const originalEventRetunrs = origEvent(...args)
-        if (originalEventRetunrs !== false) funcFromProps(...args)
+        if (originalEventRetunrs !== false) return funcFromProps(...args)
       }
     } else on[eventName] = funcFromProps
   })