imp: work on store, refactor, improve todoapp

tests/__snapshots__/store.test.ts.snap

@@ -0,0 +1,15 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`connecting a component to store connecting a component works 1`] = `
+"<div>
+                
+            </div>"
+`;
+
+exports[`connecting a component to store connecting a component works 2`] = `
+"<div>
+                
+                    <span>hello</span>
+                
+            </div>"
+`;

tests/store.test.ts

@@ -1,5 +1,11 @@
-import { Store } from "../src/store";
-import { nextMicroTick } from "./helpers";
+import { Store, connect } from "../src/store";
+import { Component, Env } from "../src/component";
+import {
+  nextMicroTick,
+  makeTestWEnv,
+  makeTestFixture,
+  nextTick
+} from "./helpers";
 
 describe("basic use", () => {
   test("commit a mutation", () => {
@@ -54,3 +60,50 @@ describe("basic use", () => {
     expect(updateCounter).toBe(1);
   });
 });
+
+describe("connecting a component to store", () => {
+  let fixture: HTMLElement;
+  let env: Env;
+
+  beforeEach(() => {
+    fixture = makeTestFixture();
+    env = makeTestWEnv();
+  });
+
+  afterEach(() => {
+    fixture.remove();
+  });
+
+  class App extends Component<any, any, any> {
+    inlineTemplate = `
+            <div>
+                <t t-foreach="props.todos" t-as="todo">
+                    <t t-widget="Todo" t-props="todo"/>
+                </t>
+            </div>`;
+    widgets = { Todo };
+  }
+  class Todo extends Component<any, any, any> {
+    inlineTemplate = `<span><t t-esc="props.msg"/></span>`;
+  }
+
+  test("connecting a component works", async () => {
+    const state = { todos: [] };
+    const mutations = {
+      addTodo(state, msg) {
+        state.todos.push({ msg });
+      }
+    };
+    const TodoApp = connect(s => s)(App);
+    const store = new Store({ state, mutations });
+    (<any>env).store = store;
+    const app = new TodoApp(env);
+
+    await app.mount(fixture);
+    expect(fixture.innerHTML).toMatchSnapshot();
+
+    store.commit("addTodo", "hello");
+    await nextTick();
+    expect(fixture.innerHTML).toMatchSnapshot();
+  });
+});

tests/utils.test.ts

@@ -4,7 +4,8 @@ import {
   idGenerator,
   memoize,
   debounce,
-  findInTree
+  findInTree,
+  shallowEqual
 } from "../src/utils";
 
 describe("escape", () => {
@@ -91,3 +92,14 @@ describe("findInTree", () => {
     expect(match2).toBe(null);
   });
 });
+
+describe("shallowEqual", () => {
+  test("simple comparisons", () => {
+    const obj1 = {};
+    expect(shallowEqual(obj1, obj1)).toBe(true);
+    expect(shallowEqual({}, {})).toBe(true);
+    expect(shallowEqual({ a: 1 }, {})).toBe(false);
+    expect(shallowEqual({ a: 1 }, { a: 1 })).toBe(true);
+    expect(shallowEqual({ a: 1 }, ["a"])).toBe(false);
+  });
+});