:bug: Enabled morphing @event handlers

package-lock.json

@@ -7046,7 +7046,7 @@
             }
         },
         "packages/alpinejs": {
-            "version": "3.11.1",
+            "version": "3.12.0",
             "license": "MIT",
             "dependencies": {
                 "@vue/reactivity": "~3.1.1"
@@ -7054,7 +7054,7 @@
         },
         "packages/collapse": {
             "name": "@alpinejs/collapse",
-            "version": "3.11.1",
+            "version": "3.12.0",
             "license": "MIT"
         },
         "packages/csp": {
@@ -7067,12 +7067,12 @@
         },
         "packages/docs": {
             "name": "@alpinejs/docs",
-            "version": "3.11.1-revision.1",
+            "version": "3.12.0-revision.1",
             "license": "MIT"
         },
         "packages/focus": {
             "name": "@alpinejs/focus",
-            "version": "3.11.1",
+            "version": "3.12.0",
             "license": "MIT",
             "dependencies": {
                 "focus-trap": "^6.6.1"
@@ -7088,17 +7088,17 @@
         },
         "packages/intersect": {
             "name": "@alpinejs/intersect",
-            "version": "3.11.1",
+            "version": "3.12.0",
             "license": "MIT"
         },
         "packages/mask": {
             "name": "@alpinejs/mask",
-            "version": "3.11.1",
+            "version": "3.12.0",
             "license": "MIT"
         },
         "packages/morph": {
             "name": "@alpinejs/morph",
-            "version": "3.11.1",
+            "version": "3.12.0",
             "license": "MIT"
         },
         "packages/navigate": {
@@ -7108,12 +7108,12 @@
         },
         "packages/persist": {
             "name": "@alpinejs/persist",
-            "version": "3.11.1",
+            "version": "3.12.0",
             "license": "MIT"
         },
         "packages/ui": {
             "name": "@alpinejs/ui",
-            "version": "3.10.5-beta.8",
+            "version": "3.12.0-beta.0",
             "license": "MIT"
         }
     },

packages/morph/src/morph.js

@@ -123,7 +123,7 @@ export function morph(from, toHtml, options) {
             let value = toAttributes[i].value
 
             if (from.getAttribute(name) !== value) {
-                from.setAttribute(name, value)
+                from.setAttribute(name.replace(/^@/,Alpine.prefixed('on:')), value)
             }
         }
     }

tests/cypress/integration/plugins/morph.spec.js

@@ -421,3 +421,23 @@ test('can morph with flat-nested conditional markers',
         get('div:nth-of-type(3) input').should(haveValue('bar'))
     },
 )
+
+// '@event' handlers cannot be assigned directly on the element
+test('can morph @event handlers', [
+    html`
+        <div x-data="{ foo: 'bar' }">
+            <button x-text="foo"></button>
+        </div>
+    `],
+    ({ get, click }, reload, window, document) => {
+        let toHtml = html`
+            <button @click="foo = 'buzz'" x-text="foo"></button>
+        `;
+
+        get('button').should(haveText('bar'));
+
+        get('button').then(([el]) => window.Alpine.morph(el, toHtml));
+        get('button').click();
+        get('button').should(haveText('buzz'));
+    }
+);