From 1c3a37fd8b34ef32c122bb94d1e74c64fc78ff9e Mon Sep 17 00:00:00 2001
From: JensLincke <jens.lincke@hpi.uni-potsdam.de>
Date: Tue, 16 Apr 2024 16:58:12 +0200
Subject: [PATCH 1/4] added some event handler null check

SQUASHED: AUTO-COMMIT-src-client-morphic-events.js,AUTO-COMMIT-src-components-tools-lively-container-navbar.js,
---
 src/client/morphic/events.js                    | 4 ++++
 src/components/tools/lively-container-navbar.js | 1 -
 2 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/client/morphic/events.js b/src/client/morphic/events.js
index a27e004b8..73b0ee802 100644
--- a/src/client/morphic/events.js
+++ b/src/client/morphic/events.js
@@ -113,6 +113,10 @@ export default class Events {
     
     HTMLElement.prototype.addEventListener = function(type, cb, ...rest) {
         // we cannot just wrapp a callback cb, because callbacks are also used in removeEventListener...
+        if (!cb) {
+          console.warn("addEventListener: registering empty callback for " + type)
+          return
+        }
         var func = cbMap.get(cb) || (function(...args) {
           
           // this becomes dangerous... without COP, we need a global flag
diff --git a/src/components/tools/lively-container-navbar.js b/src/components/tools/lively-container-navbar.js
index 7bdf33f96..6311723b1 100644
--- a/src/components/tools/lively-container-navbar.js
+++ b/src/components/tools/lively-container-navbar.js
@@ -1022,7 +1022,6 @@ export default class LivelyContainerNavbar extends Morph {
       eaMethodInfo.class = classInfo.name // for later use
       var name = eaMethodInfo.name
       var methodItem = this.createDetailsItem(name)
-      debugger
       if (eaMethodInfo.static) {
         methodItem.insertBefore(<span class="mod">static</span>, methodItem.querySelector("a"))
       }

From 065d19036445c8116906b814a1c2c8a20df9bfc9 Mon Sep 17 00:00:00 2001
From: JensLincke <jens.lincke@hpi.uni-potsdam.de>
Date: Mon, 22 Apr 2024 14:10:44 +0200
Subject: [PATCH 2/4] added jsx19.js example

SQUASHED: AUTO-COMMIT-demos-jsx19.js,AUTO-COMMIT-src-external-diffDom.js,
---
 demos/jsx19.js          | 64 +++++++++++++++++++++++++++++++++++++++++
 src/external/diffDom.js |  7 ++++-
 2 files changed, 70 insertions(+), 1 deletion(-)
 create mode 100644 demos/jsx19.js

diff --git a/demos/jsx19.js b/demos/jsx19.js
new file mode 100644
index 000000000..a0f34ceb4
--- /dev/null
+++ b/demos/jsx19.js
@@ -0,0 +1,64 @@
+'enable rp19-jsx';
+
+
+/*MD
+## Example:
+```
+import FooMorph from "https://lively-kernel.org/lively4/lively4-jens/demos/jsx19.js"
+customElements.define("foo-morph", FooMorph);
+
+that.innerHTML = "<foo-morph></foo-morph>"
+```
+// that.innerHTML = ""
+
+MD*/
+
+import ReactiveMorph from 'src/client/reactive/components/rewritten/conduit/rpComponents/reactiveMorph.js';
+
+var model = {
+  name: "Foo"
+}
+
+
+export default class FooMorph extends ReactiveMorph {
+  
+  /* Event handler */
+  onRegisterForm(event) {
+    event.preventDefault();
+  }
+  
+  // (1) Project on initialize
+  render_1() {    
+      return <div>{model.name}</div>
+    
+  }
+  
+  // (2) with a loop
+  render_2() {    
+      return <div>
+        <div>{model.name}</div>
+        <button click={() => model.name = "bar"}>change</button>
+      </div>
+  }
+  
+  // (3) with a magic loop ... chanage in input is pushed to model
+  render() {    
+      return <div>
+        <form id='registerForm'>
+          <fieldset>
+            <input 
+               id='usernameInput'
+                      class='form-control form-control-lg'
+                      type='text'
+                      placeholder='Username'
+              
+              value={model.name }></input>
+          </fieldset>
+        </form>
+        <div>MODEL: {model.name}</div>
+        <button click={() => model.name = "bar"}>change</button>
+      </div>
+  }
+  
+  
+}
diff --git a/src/external/diffDom.js b/src/external/diffDom.js
index 8019b3c10..f234ecfc5 100644
--- a/src/external/diffDom.js
+++ b/src/external/diffDom.js
@@ -1,4 +1,9 @@
-var diffDOM = function(e) {
+let mod = diffDOM({})
+let x = mod.DiffDOM
+
+export {x as DiffDOM}
+
+export function diffDOM(e) {
   "use strict";
 
   function t(e, o, n) {

From cb7e602a30a0720f57c114857b55cdab09341875 Mon Sep 17 00:00:00 2001
From: JensLincke <jens.lincke@hpi.uni-potsdam.de>
Date: Mon, 22 Apr 2024 14:14:39 +0200
Subject: [PATCH 3/4] added jsx19.js cleanup

SQUASHED: AUTO-COMMIT-demos-jsx19.js,
---
 demos/jsx19.js | 7 +------
 1 file changed, 1 insertion(+), 6 deletions(-)

diff --git a/demos/jsx19.js b/demos/jsx19.js
index a0f34ceb4..342767dad 100644
--- a/demos/jsx19.js
+++ b/demos/jsx19.js
@@ -47,16 +47,11 @@ export default class FooMorph extends ReactiveMorph {
         <form id='registerForm'>
           <fieldset>
             <input 
-               id='usernameInput'
-                      class='form-control form-control-lg'
-                      type='text'
-                      placeholder='Username'
-              
+              id='nameInput'
               value={model.name }></input>
           </fieldset>
         </form>
         <div>MODEL: {model.name}</div>
-        <button click={() => model.name = "bar"}>change</button>
       </div>
   }
   

From d50b33f241ba5428993c9f29d24166996e155073 Mon Sep 17 00:00:00 2001
From: JensLincke <jens.lincke@hpi.uni-potsdam.de>
Date: Mon, 22 Apr 2024 14:24:14 +0200
Subject: [PATCH 4/4] added jsx19.js cleanup 2

SQUASHED: AUTO-COMMIT-demos-jsx19.js,
---
 demos/jsx19.js | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/demos/jsx19.js b/demos/jsx19.js
index 342767dad..0e79222d0 100644
--- a/demos/jsx19.js
+++ b/demos/jsx19.js
@@ -36,19 +36,20 @@ export default class FooMorph extends ReactiveMorph {
   // (2) with a loop
   render_2() {    
       return <div>
-        <div>{model.name}</div>
+        <div>{model.name + "XXX"}</div>
         <button click={() => model.name = "bar"}>change</button>
       </div>
   }
   
   // (3) with a magic loop ... chanage in input is pushed to model
   render() {    
+      // Rewriting ERROR: value={model.name + "XXX"}></input>
       return <div>
         <form id='registerForm'>
           <fieldset>
             <input 
               id='nameInput'
-              value={model.name }></input>
+              value={model.name}></input>
           </fieldset>
         </form>
         <div>MODEL: {model.name}</div>