iobroker.mywebui 1.37.82 → 1.37.84

package/io-package.json

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

package/package.json

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

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

@@ -21,6 +21,7 @@ export class IobrokerWebuiScreenEditor extends BaseCustomWebComponentConstructor
     _webuiBindings;
     _styleBindings;
     _settingsChanged;
+    _designerScriptObject = null;
     async initialize(name, type, html, style, script, settings, properties, serviceContainer) {
         if (name[0] == '/')
             name = name.substring(1);
@@ -114,6 +115,8 @@ export class IobrokerWebuiScreenEditor extends BaseCustomWebComponentConstructor
                         // Layout not ready yet — keep zoomFactor=1 so canvas stays visible
                         this.documentContainer.designerView.designerCanvas.zoomFactor = 1;
                     }
+                    // Run the control's script so JS-generated content is visible in the designer
+                    this._applyDesignerScript();
                 });
             });
 
@@ -642,6 +645,13 @@ export class IobrokerWebuiScreenEditor extends BaseCustomWebComponentConstructor
         this.documentContainer.designerView.designerHeight = this._settings.height ?? defH;
     }
     dispose() {
+        if (this._designerScriptObject?.disconnectedCallback) {
+            try {
+                const rootEl = this.documentContainer.designerView.designerCanvas.rootDesignItem?.element;
+                this._designerScriptObject.disconnectedCallback(rootEl, rootEl?.shadowRoot);
+            } catch (err) {}
+        }
+        this._designerScriptObject = null;
         this.removeBindings();
         this.documentContainer.dispose();
         this._configChangedListener?.dispose();
@@ -651,5 +661,27 @@ export class IobrokerWebuiScreenEditor extends BaseCustomWebComponentConstructor
         window.appShell.styleEditor.model = null;
         window.appShell.javascriptEditor.model = null;
     }
+    async _applyDesignerScript() {
+        if (this._type !== 'control') return;
+        const scriptCode = this.scriptModel.getValue();
+        if (!scriptCode?.trim()) return;
+        const canvas = this.documentContainer.designerView.designerCanvas;
+        const rootEl = canvas.rootDesignItem?.element;
+        const shadowRoot = rootEl?.shadowRoot;
+        if (!rootEl || !shadowRoot) return;
+        try {
+            const url = URL.createObjectURL(new Blob([scriptCode], { type: 'application/javascript' }));
+            let scriptObj = await import(url);
+            if (scriptObj?.default && !scriptObj?.connectedCallback)
+                scriptObj = scriptObj.default;
+            this._designerScriptObject = scriptObj;
+            if (scriptObj?.init)
+                scriptObj.init(rootEl, shadowRoot);
+            if (scriptObj?.connectedCallback)
+                scriptObj.connectedCallback(rootEl, shadowRoot);
+        } catch (err) {
+            console.warn('Designer script execution failed:', err);
+        }
+    }
 }
 customElements.define("iobroker-webui-screen-editor", IobrokerWebuiScreenEditor);

package/www/dist/frontend/runtime/ScreenViewer.js

@@ -318,27 +318,13 @@ let ScreenViewer = class ScreenViewer extends BaseCustomWebComponentConstructorA
         else
             this._iobBindings = res;
         this._scriptObject = await window.appShell.scriptSystem.assignAllScripts('screenviewer - ' + this.screenName, script, this._rootShadow, this, iobrokerHandler);
-        
-        console.log('📜 [ScreenViewer] Script object for "' + this.screenName + '":', this._scriptObject);
-        console.log('📜 [ScreenViewer] Object type:', Object.prototype.toString.call(this._scriptObject));
-        console.log('📜 [ScreenViewer] Has default?', this._scriptObject?.default);
-        console.log('📜 [ScreenViewer] Has connectedCallback?', typeof this._scriptObject?.connectedCallback);
-        console.log('📜 [ScreenViewer] Has default.connectedCallback?', typeof this._scriptObject?.default?.connectedCallback);
-        
-        // If module with default export, use it
-        if (this._scriptObject?.default && !this._scriptObject?.connectedCallback) {
-            console.log('🔄 [ScreenViewer] Using default export for "' + this.screenName + '"');
+        if (this._scriptObject?.default && !this._scriptObject?.connectedCallback)
             this._scriptObject = this._scriptObject.default;
-        }
-        
-        // Call connectedCallback after script is loaded
         if (this._scriptObject?.connectedCallback) {
-            console.log('✅ [ScreenViewer] Calling connectedCallback after script load for "' + this.screenName + '"');
             try {
                 this._scriptObject.connectedCallback(this, this._rootShadow);
-                console.log('✅ [ScreenViewer] connectedCallback executed successfully for "' + this.screenName + '"');
             } catch (err) {
-                console.error('❌ [ScreenViewer] Error in connectedCallback for "' + this.screenName + '":', err);
+                console.error('connectedCallback error for "' + this.screenName + '":', err);
             }
         }