diff --git a/src/store.ts b/src/store.ts index 47660be0..e7f50c6a 100644 --- a/src/store.ts +++ b/src/store.ts @@ -27,11 +27,14 @@ export class Store extends EventBus { super(); this.debug = options.debug || false; this.state = Object.assign({}, config.state); + const self = this; this.mstate = magify({ raw: this.state, key: "state", parent: this, - onDirty: () => (this._isDirty = true) + onDirty: function() { + self._isDirty = true; + } }); this.actions = config.actions; this.mutations = config.mutations; diff --git a/tests/store.test.ts b/tests/store.test.ts index b33c2bf5..4555df17 100644 --- a/tests/store.test.ts +++ b/tests/store.test.ts @@ -101,10 +101,22 @@ describe("advanced state properties", () => { expect(state.rochefort).toBe(8); store.commit("dosomething"); expect(store.state.rochefort).toBe(10); - expect(store.state.rochefort).toBe(10); expect(store.state).not.toBe(state); }); + test("state is reference equal after pushing in a list", async () => { + const mutations = { + addRochefort(state) { + state.rocheforts.push(10); + } + }; + const store = new Store({ state: { rocheforts: [] }, mutations }); + const state = store.state; + store.commit("addRochefort"); + expect(store.state.rocheforts).toEqual([10]); + expect(store.state).toBe(state); + }); + test("nested state in the store behaves properly", async () => { const state = { jupiler: { maes: 1 } }; const mutations = { @@ -155,6 +167,20 @@ describe("advanced state properties", () => { expect(store.state.jupiler).not.toBe(jupiler); }); + test("can use object assign in store", async () => { + const mutations = { + dosomething(state) { + Object.assign(state.westmalle, { a: 3, b: 4 }); + } + }; + const store = new Store({ + state: { westmalle: { a: 1, b: 2 } }, + mutations + }); + store.commit("dosomething"); + expect(store.state.westmalle).toEqual({ a: 3, b: 4 }); + }); + test("aku reactive store state 1", async () => { const mutations = { inc(state) { @@ -444,14 +470,17 @@ describe("connecting a component to store", () => { inlineTemplate = ``; } - test.skip("connecting a component works", async () => { + test("connecting a component works", async () => { const state = { todos: [] }; const mutations = { addTodo(state, msg) { state.todos.push({ msg }); } }; - const TodoApp = connect(s => s)(App); + function mapStateToProps(s) { + return { todos: s.todos }; + } + const TodoApp = connect(mapStateToProps)(App); const store = new Store({ state, mutations }); (env).store = store; const app = new TodoApp(env);