Bug - Alias for global persist shared between different properties (#2320)

* Add failing test

* Allow multiple aliases when using Alpine.$persist

* Remove comment

packages/persist/src/index.js

@@ -27,7 +27,7 @@ export default function (Alpine) {
         })
     }
 
-    Alpine.$persist = persist()
+    Object.defineProperty(Alpine, '$persist', { get: () => persist() })
     Alpine.magic('persist', persist)
 }
 

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

@@ -226,3 +226,29 @@ test('can persist using global Alpine.$persist within Alpine.store',
         get('span').should(haveText('Malcolm'))
     },
 )
+
+test('multiple aliases work when using global Alpine.$persist',
+    [html`
+        <div x-data>
+            <input x-model="$store.name.firstName">
+
+            <span x-text="$store.name.firstName"></span>
+            <p x-text="$store.name.lastName"></p>
+        </div>
+    `, `
+        Alpine.store('name', {
+            firstName: Alpine.$persist('John').as('first-name'),
+            lastName: Alpine.$persist('Doe').as('name-name')
+        })
+    `],
+    ({ get, window }, reload) => {
+        get('span').should(haveText('John'))
+        get('p').should(haveText('Doe'))
+        get('input').clear().type('Joe')
+        get('span').should(haveText('Joe'))
+        get('p').should(haveText('Doe'))
+        reload()
+        get('span').should(haveText('Joe'))
+        get('p').should(haveText('Doe'))
+    },
+)