iobroker.mywebui 1.37.86 → 1.37.87

package/io-package.json

@@ -1,7 +1,7 @@
 {
   "common": {
     "name": "mywebui",
-    "version": "1.37.86",
+    "version": "1.37.87",
     "titleLang": {
       "en": "mywebui",
       "de": "mywebui",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "iobroker.mywebui",
-  "version": "1.37.86",
+  "version": "1.37.87",
   "description": "ioBroker mywebui - Custom edited mywebui by gokturk413",
   "type": "module",
   "main": "dist/backend/main.js",

package/www/dist/frontend/config/IobrokerWebuiScreenEditor.js

@@ -674,25 +674,34 @@ export class IobrokerWebuiScreenEditor extends BaseCustomWebComponentConstructor
         const shadowRoot = rootEl?.shadowRoot;
         if (!rootEl || !shadowRoot) return;
         try {
-            // Facade mimics the ScreenViewer instance API that control scripts expect.
-            // Scripts call _getDomElement(), _assignEvent(), addEventListener(), etc.
-            const facade = {
+            // Proxy wraps rootEl so ALL native HTMLElement methods (attachInternals, querySelector,
+            // closest, matches, getBoundingClientRect, etc.) work automatically.
+            // Custom WebUI API (_getDomElement, _assignEvent, shadowRoot) is injected via the handler.
+            const overrides = {
                 shadowRoot,
                 _getDomElement(id) {
                     return shadowRoot.getElementById(id) ?? shadowRoot.querySelector(`[name="${id}"]`);
                 },
                 _assignEvent(id, evtName, handler) {
-                    const el = this._getDomElement(id);
+                    const el = overrides._getDomElement(id);
                     if (el) el.addEventListener(evtName, handler);
                 },
-                addEventListener: (type, handler, opts) => rootEl.addEventListener(type, handler, opts),
-                removeEventListener: (type, handler, opts) => rootEl.removeEventListener(type, handler, opts),
-                dispatchEvent: (evt) => rootEl.dispatchEvent(evt),
-                getAttribute: (name) => rootEl.getAttribute(name),
-                setAttribute: (name, val) => rootEl.setAttribute(name, val),
-                style: rootEl.style,
-                dataset: rootEl.dataset,
             };
+            const facade = new Proxy(rootEl, {
+                get(target, prop, receiver) {
+                    if (prop in overrides) {
+                        const v = overrides[prop];
+                        return typeof v === 'function' ? v.bind(overrides) : v;
+                    }
+                    const v = target[prop];
+                    return typeof v === 'function' ? v.bind(target) : v;
+                },
+                set(target, prop, value) {
+                    if (prop in overrides) { overrides[prop] = value; return true; }
+                    target[prop] = value;
+                    return true;
+                },
+            });
             this._designerFacade = facade;
             // Use scriptSystem.assignAllScripts — handles @event attrs, init(), applyBindings, etc.
             let scriptObj = await window.appShell.scriptSystem.assignAllScripts(