🐛 Fixes proxy stack setters bug

packages/alpinejs/src/scope.js

@@ -64,14 +64,14 @@ let mergeProxyTrap = {
         )
     },
 
-    set({ objects }, name, value) {
-        return Reflect.set(
-            objects.find((obj) =>
+    set({ objects }, name, value, thisProxy) {
+        const target = objects.find((obj) =>
                 Object.prototype.hasOwnProperty.call(obj, name)
-            ) || objects[objects.length-1],
-            name,
-            value
-        )
+            ) || objects[objects.length - 1];
+        const descriptor = Object.getOwnPropertyDescriptor(target, name);
+        if (descriptor?.set && descriptor?.get)
+            return Reflect.set(target, name, value, thisProxy);
+        return Reflect.set(target, name, value);
     },
 }
 

tests/cypress/integration/scope.spec.js

@@ -0,0 +1,28 @@
+import { haveText, html, test } from "../utils";
+
+test('properly merges the datastack',
+    [html`
+        <div x-data="{ foo: 'fizz' }">
+            <div x-data="{ bar: 'buzz' }">
+                <span x-text="foo + bar"></span>
+            </div>
+        </div>
+    `], ({ get }) => {
+    get('span').should(haveText('fizzbuzz'));
+});
+
+test('handles getter setter pairs',
+    [html`
+        <div x-data="{ foo: 'fizzbuzz' }">
+            <div x-data="{ get bar() { return this.foo }, set bar(value) { this.foo = value } }">
+                <span id="one" x-text="bar" @click="bar = 'foobar'"></span>
+            </div>
+            <span id="two" x-text="foo"></span>
+        </div>
+    `], ({ get }) => {
+    get('span#one').should(haveText('fizzbuzz'));
+    get('span#two').should(haveText('fizzbuzz'));
+    get('span#one').click();
+    get('span#one').should(haveText('foobar'));
+    get('span#two').should(haveText('foobar'));
+});