Debug

css/iui.css

@@ -3099,3 +3099,19 @@ html[dir='rtl'] .navbar-item[level='1'] {
 {
     
 }
+
+.iui-error {
+    background: #7171714d;
+    position: absolute;
+    top: 0;
+    left: 0;
+    height: 100%;
+    width: 100%;
+    pointer-events: none;
+}
+
+.iui-error > span {
+    background: red;
+    color: white;
+    padding: 4px;
+}

src/Core/Binding.js

@@ -179,6 +179,10 @@ export class Binding {
 
         if (context.error != undefined)
         {
+            if (thisArg instanceof IUIElement){
+                thisArg.setError(context.error);
+            }
+
             console.log("Execution failed", context.error.name + ": " + context.error.message, this.script, this.target);
             return;
         }
@@ -192,6 +196,11 @@ export class Binding {
             {
                 return await context.value;
             } catch(ex) {
+
+                if (thisArg instanceof IUIElement){
+                    thisArg.setError(ex);
+                }
+    
                 console.log("Execution failed", ex.name + ": " + ex.message, this.script, this.target);
             }
         }

src/Core/IUI.js

@@ -6,6 +6,8 @@ import BindingList  from "./BindingList.js";
 
 export class IUI {
 
+	static debugMode = true;
+	
 	static _menus = [];
 	static views = [];
 	static modules = {};

src/Core/IUIElement.js

@@ -64,6 +64,22 @@ export default class IUIElement extends HTMLElement {
     }
 
 
+    setError(exception) {
+        if (!IUI.debugMode)
+            return;
+
+        if (this._errorElement == null) {
+            this._errorElement = document.createElement("div");
+            this._errorElement.className = "iui-error";
+            this.append(this._errorElement);
+        }
+
+        var label = document.createElement("span");
+        label.innerHTML = exception;
+        this._errorElement.append(label);
+    }
+
+    
     async updated() {
         // to be implemented by the user.
     }