[TEST] add test for event handling code

movahhedi · Aug 23, 2021 · 3de7103 · 3de7103
1 parent 47c0e1e
commit 3de7103
Showing 1 changed file with 36 additions and 15 deletions.
diff --git a/tests/block_event_handling.test.ts b/tests/block_event_handling.test.ts
@@ -1,4 +1,4 @@
-import { mount, createBlock, multi, config } from "../src";
+import { mount, createBlock, multi, config, patch } from "../src";
 // import { defaultHandler, setupMainHandler } from "../../src/bdom/block";
 import { makeTestFixture } from "./helpers";
 
@@ -18,20 +18,10 @@ afterEach(() => {
   fixture.remove();
 });
 
-test("simple event handling ", async () => {
-  config.mainEventHandler = (data, ev) => {
-    if (typeof data === "function") {
-      data();
-    } else {
-      const [owner, method] = data;
-      owner[method]();
-    }
-  };
-
+test("simple event handling, with function", async () => {
   const block = createBlock('<div owl-handler-0="click"></div>');
   let n = 0;
-  const obj = { f: () => n++ };
-  const tree = block([[obj, "f"]]);
+  const tree = block([() => n++]);
 
   mount(tree, fixture);
   expect(fixture.innerHTML).toBe("<div></div>");
@@ -42,10 +32,41 @@ test("simple event handling ", async () => {
   expect(n).toBe(1);
 });
 
-test("simple event handling, with function", async () => {
+test("simple event handling, with function and argument", async () => {
   const block = createBlock('<div owl-handler-0="click"></div>');
   let n = 0;
-  const tree = block([() => n++]);
+  const onClick = (arg: number) => {
+    n += arg;
+  };
+  const tree = block([[onClick, 3]]);
+
+  mount(tree, fixture);
+  expect(fixture.innerHTML).toBe("<div></div>");
+
+  expect(fixture.firstChild).toBeInstanceOf(HTMLDivElement);
+  expect(n).toBe(0);
+  (fixture.firstChild as HTMLDivElement).click();
+  expect(n).toBe(3);
+
+  patch(tree, block([[onClick, 5]]));
+  (fixture.firstChild as HTMLDivElement).click();
+  expect(n).toBe(8);
+});
+
+test("simple event handling ", async () => {
+  config.mainEventHandler = (data, ev) => {
+    if (typeof data === "function") {
+      data();
+    } else {
+      const [owner, method] = data;
+      owner[method]();
+    }
+  };
+
+  const block = createBlock('<div owl-handler-0="click"></div>');
+  let n = 0;
+  const obj = { f: () => n++ };
+  const tree = block([[obj, "f"]]);
 
   mount(tree, fixture);
   expect(fixture.innerHTML).toBe("<div></div>");