|
|
@@ -0,0 +1,35 @@
|
|
|
+import Alpine from 'alpinejs'
|
|
|
+import Spruce from '../dist/spruce'
|
|
|
+import { waitFor } from '@testing-library/dom'
|
|
|
+
|
|
|
+beforeEach(() => {
|
|
|
+ Spruce.subscribers = []
|
|
|
+})
|
|
|
+
|
|
|
+beforeAll(() => {
|
|
|
+ window.Spruce = Spruce
|
|
|
+})
|
|
|
+
|
|
|
+test('$store > data can be set inside component', async () => {
|
|
|
+ document.body.innerHTML = `
|
|
|
+ <div x-data x-subscribe>
|
|
|
+ <span x-text="$store.foo.bar"></span>
|
|
|
+ <button @click="$store.foo.bar = 'car'"></button>
|
|
|
+ </div>
|
|
|
+ `
|
|
|
+
|
|
|
+ Spruce.store('foo', {
|
|
|
+ bar: 'bob'
|
|
|
+ })
|
|
|
+
|
|
|
+ await Spruce.start()
|
|
|
+
|
|
|
+ Alpine.start()
|
|
|
+
|
|
|
+ document.querySelector('button').click()
|
|
|
+
|
|
|
+ await waitFor(() => {
|
|
|
+ expect(Spruce.stores.foo.bar).toEqual('car')
|
|
|
+ expect(document.querySelector('span').innerText).toEqual('car')
|
|
|
+ })
|
|
|
+})
|
Ryan Chandler