@ryupold/vode 1.8.8 → 1.8.11

package/test/tests-patch-advanced.ts

@@ -1,11 +1,11 @@
-import { expect } from "./helper";
-import { app, createState, DIV } from "../index";
+import { delay, expect } from "./helper";
+import { app, ContainerNode, createState, DIV } from "../index";
 
 function setup() {
     const root = document.createElement("div");
     const container = document.createElement("div");
     root.appendChild(container);
-    return container;
+    return container as unknown as ContainerNode;
 }
 
 export default {
@@ -14,7 +14,7 @@ export default {
         const state: any = createState({ count: 0 });
         app(container, state, (s: any) => [DIV, String(s.count)]);
 
-        expect(state.count).toEqual(0);
+        await expect(state.count).toEqual(0);
 
         state.patch(function* () {
             yield { count: 1 };
@@ -24,8 +24,8 @@ export default {
 
         await new Promise(r => setTimeout(r, 0));
 
-        expect(state.count).toEqual(3);
-        expect(container).toMatch([DIV, "3"]);
+        await expect(state.count).toEqual(3);
+        await expect(container).toMatch([DIV, "3"]);
     },
 
     "patch(): async generator yields over time": async () => {
@@ -33,19 +33,22 @@ export default {
         const state: any = createState({ phase: "start", value: 0 });
         app(container, state, (s: any) => [DIV, s.phase, String(s.value)]);
 
-        expect(state.phase).toEqual("start");
+        await expect(state.phase).toEqual("start");
 
         state.patch(async function* () {
+            await expect(container._vode.stats.syncRenderPatchCount).toEqual(0);
             yield { phase: "working", value: 10 };
+            await expect(container._vode.stats.syncRenderPatchCount).toEqual(1);
             yield { phase: "almost", value: 20 };
+            await expect(container._vode.stats.syncRenderPatchCount).toEqual(2);
             return { phase: "done", value: 30 };
         }());
 
         await new Promise(r => setTimeout(r, 0));
 
-        expect(state.phase).toEqual("done");
-        expect(state.value).toEqual(30);
-        expect(container).toMatch([DIV, "done", "30"]);
+        await expect(state.phase).toEqual("done");
+        await expect(state.value).toEqual(30);
+        await expect(container).toMatch([DIV, "done", "30"]);
     },
 
     "patch(): Promise resolves and applies patch": async () => {
@@ -55,30 +58,135 @@ export default {
 
         state.patch(Promise.resolve({ msg: "after" }));
 
-        await new Promise(r => setTimeout(r, 0));
+        await delay(10);
 
-        expect(state.msg).toEqual("after");
-        expect(container).toMatch([DIV, "after"]);
+        await expect(state.msg).toEqual("after");
+        await expect(container).toMatch([DIV, "after"]);
     },
 
-    "patch(): array with empty patches applies nothing": () => {
+    "patch(): array with empty patches applies nothing": async () => {
         const container = setup();
         const state: any = createState({ x: 1, y: 2 });
         app(container, state, (s: any) => [DIV]);
 
         state.patch([{}, {}]);
-        expect(state.x).toEqual(1);
-        expect(state.y).toEqual(2);
+        await expect(state.x).toEqual(1);
+        await expect(state.y).toEqual(2);
     },
 
-    "patch(): array with null/undefined items skips them": () => {
+    "patch(): array with null/undefined items skips them": async () => {
         const container = setup();
         const state: any = createState({ x: 0, y: 0 });
         app(container, state, (s: any) => [DIV, String(s.x), String(s.y)]);
 
         state.patch([null, { x: 10 }, undefined, { y: 20 }]);
 
-        expect(state.x).toEqual(10);
-        expect(state.y).toEqual(20);
+        await delay(10);
+
+        await expect(state.x).toEqual(10);
+        await expect(state.y).toEqual(20);
+    },
+
+    "patch(): returns Promise for generator functions, can be awaited": async () => {
+        const container = setup();
+        const state = createState({ count: 0 });
+        app<typeof state>(container, state, (s) => [DIV, String(s.count)]);
+
+        await expect(container._vode.stats.patchCount).toEqual(0);
+        const result = state.patch(function* () {
+            yield { count: 1 };
+            return { count: 2 };
+        });
+        await expect(container._vode.stats.patchCount).toEqual(1);
+
+        expect(result).toBeA("object");
+        await expect(result instanceof Promise).toEqual(true);
+
+        await result;
+        await expect(container._vode.stats.patchCount).toEqual(3);
+
+        await expect(state.count).toEqual(2);
+        await expect(container).toMatch([DIV, "2"]);
+    },
+
+    "patch(): returns Promise for Promise patches, can be awaited": async () => {
+        const container = setup();
+        const state = createState({ msg: "before" });
+        app<typeof state>(container, state, (s) => [DIV, s.msg]);
+
+        const result = state.patch(Promise.resolve({ msg: "after" }));
+
+        expect(result).toBeA("object");
+        await expect(result instanceof Promise).toEqual(true);
+
+        await result;
+
+        await expect(state.msg).toEqual("after");
+        await expect(container).toMatch([DIV, "after"]);
+    },
+
+    "patch(): returns void for object patches": async () => {
+        const container = setup();
+        const state = createState({ x: 1 });
+        app<typeof state>(container, state, (s) => [DIV, String(s.x)]);
+
+        const result = state.patch({ x: 2 });
+
+        expect(result).toBeA("undefined");
+
+        await expect(state.x).toEqual(2);
+        await expect(container).toMatch([DIV, "2"]);
+    },
+
+    "patch(): forward promise error when one happens during patch": async () => {
+        const container = setup();
+        const state = createState({ msg: "before" });
+        app<typeof state>(container, state, (s) => [DIV, s.msg]);
+
+        const mockPromise = Promise.withResolvers<void>();
+        const promisePatchResult = state.patch(mockPromise.promise);
+        mockPromise.reject(new Error("promise error"));
+
+        let err = await expect(() => promisePatchResult)
+            .toFailAsync("promise (1) error expected");
+        expect(err.message).toEqual("promise error");
+
+        err = await expect(() => state.patch(async () => {
+            await delay(1);
+            throw new Error("promise error")
+        })).toFailAsync("promise (2) error expected");
+        expect(err.message).toEqual("promise error");
+    },
+
+    "patch(): forward generator error when one happens during patch": async () => {
+        const container = setup();
+        const state = createState({ msg: "before" });
+        app<typeof state>(container, state, (s) => [DIV, s.msg]);
+
+        const err = await expect(
+            () => state.patch(
+                async function* () {
+                    yield {};
+                    await delay(1);
+                    yield {};
+                    throw new Error("generator error");
+                }
+            )
+        ).toFailAsync("generator error expected");
+        expect(err.message).toEqual("generator error");
+    },
+    "patch(): forward error when one happens during patch": async () => {
+        const container = setup();
+        const state = createState({ msg: "before" });
+        app<typeof state>(container, state, (s) => [DIV, s.msg]);
+
+        const err = await expect(
+            () => state.patch(
+                () => {
+                    throw new Error("void error");
+                }
+            )
+        ).toFailAsync("void error expected");
+        expect(err.message).toEqual("void error");
     },
 };

package/test/tests-patch-merge.ts

@@ -9,58 +9,58 @@ function setup() {
 }
 
 export default {
-    "patch-merge: array property replaces existing array": () => {
+    "patch-merge: array property replaces existing array": async () => {
         const container = setup();
         const state: any = createState({ items: [1, 2, 3] });
         app(container, state, () => [DIV]);
 
         state.patch({ items: [4, 5, 6] });
 
-        expect(state.items).toEqual([4, 5, 6]);
+        await expect(state.items).toEqual([4, 5, 6]);
     },
 
-    "patch-merge: Date property stores correctly": () => {
+    "patch-merge: Date property stores correctly": async () => {
         const container = setup();
         const state: any = createState({ date: new Date("2024-01-01") });
         app(container, state, () => [DIV]);
 
         state.patch({ date: new Date("2025-06-15") });
 
-        expect(state.date instanceof Date).toEqual(true);
-        expect(state.date.getFullYear()).toEqual(2025);
-        expect(state.date.getMonth()).toEqual(5);
-        expect(state.date.getDate()).toEqual(15);
+        await expect(state.date instanceof Date).toEqual(true);
+        await expect(state.date.getFullYear()).toEqual(2025);
+        await expect(state.date.getMonth()).toEqual(5);
+        await expect(state.date.getDate()).toEqual(15);
     },
 
-    "patch-merge: object replaces existing array property": () => {
+    "patch-merge: object replaces existing array property": async () => {
         const container = setup();
         const state: any = createState({ data: [1, 2, 3] });
         app(container, state, () => [DIV]);
 
         state.patch({ data: { key: "value" } });
 
-        expect(Array.isArray(state.data)).toEqual(false);
-        expect(state.data.key).toEqual("value");
+        await expect(Array.isArray(state.data)).toEqual(false);
+        await expect(state.data.key).toEqual("value");
     },
 
-    "patch-merge: object replaces existing primitive property": () => {
+    "patch-merge: object replaces existing primitive property": async () => {
         const container = setup();
         const state: any = createState({ value: 42 });
         app(container, state, () => [DIV]);
 
         state.patch({ value: { nested: true } });
 
-        expect(state.value.nested).toEqual(true);
+        await expect(state.value.nested).toEqual(true);
     },
 
-    "patch-merge: new array property via patch": () => {
+    "patch-merge: new array property via patch": async () => {
         const container = setup();
         const state: any = createState({ name: "test" });
         app(container, state, () => [DIV]);
 
         state.patch({ tags: ["a", "b", "c"] });
 
-        expect(Array.isArray(state.tags)).toEqual(true);
-        expect(state.tags).toEqual(["a", "b", "c"]);
+        await expect(Array.isArray(state.tags)).toEqual(true);
+        await expect(state.tags).toEqual(["a", "b", "c"]);
     },
 };

package/test/tests-props.ts

@@ -2,33 +2,33 @@ import { props, DIV, SPAN } from "../index";
 import { expect } from "./helper";
 
 export default {
-    "props(): on vode with props returns props object": () => {
-        expect(props([DIV, { class: "foo" }, "hello"]))
+    "props(): on vode with props returns props object": async () => {
+        await expect(props([DIV, { class: "foo" }, "hello"]))
             .toEqual({ class: "foo" });
     },
 
-    "props(): on just-tag vode returns undefined": () => {
-        expect(props([DIV])).toEqual(undefined);
+    "props(): on just-tag vode returns undefined": async () => {
+        await expect(props([DIV])).toEqual(undefined);
     },
 
-    "props(): on text vode returns undefined": () => {
-        expect(props("hello")).toEqual(undefined);
+    "props(): on text vode returns undefined": async () => {
+        await expect(props("hello")).toEqual(undefined);
     },
 
-    "props(): on vode where second element is an array (child) returns undefined": () => {
-        expect(props([DIV, [SPAN]] as any)).toEqual(undefined);
+    "props(): on vode where second element is an array (child) returns undefined": async () => {
+        await expect(props([DIV, [SPAN]] as any)).toEqual(undefined);
     },
 
-    "props(): on vode where second element is null returns undefined": () => {
-        expect(props([DIV, null as any, "hi"])).toEqual(undefined);
+    "props(): on vode where second element is null returns undefined": async () => {
+        await expect(props([DIV, null as any, "hi"])).toEqual(undefined);
     },
 
-    "props(): on falsy input returns undefined": () => {
-        expect(props(null as any)).toEqual(undefined);
-        expect(props(undefined as any)).toEqual(undefined);
+    "props(): on falsy input returns undefined": async () => {
+        await expect(props(null as any)).toEqual(undefined);
+        await expect(props(undefined as any)).toEqual(undefined);
     },
 
-    "props(): on vode with length 1 returns undefined": () => {
-        expect(props([DIV] as any)).toEqual(undefined);
+    "props(): on vode with length 1 returns undefined": async () => {
+        await expect(props([DIV] as any)).toEqual(undefined);
     }
 };

package/test/tests-state-context.ts

@@ -3,135 +3,135 @@ import { context, ProxySubContext } from "../src/state-context";
 import { createState } from "../src/vode";
 
 export default {
-    "StateContext.state: returns the state reference": () => {
+    "StateContext.state: returns the state reference": async () => {
         const state = createState({ x: 10 });
         const ctx = context(state);
 
-        expect((ctx).state === state)
+        await expect((ctx).state === state)
             .toEqual(true);
     },
 
-    "StateContext.get() returns whole state": () => {
+    "StateContext.get() returns whole state": async () => {
         const state = createState({ a: 1, b: 2 });
         const ctx = context(state);
 
-        expect(ctx.get())
+        await expect(ctx.get())
             .toEqual({ a: 1, b: 2 });
     },
 
 
-    "StateContext.get(): deep nested": () => {
+    "StateContext.get(): deep nested": async () => {
         const state = createState({ a: { b: { c: 42 } } });
         const ctx = context(state);
 
-        expect(ctx.a.b.c.get())
+        await expect(ctx.a.b.c.get())
             .toEqual(42);
     },
 
-    "StateContext.get(): missing nested path returns undefined": () => {
+    "StateContext.get(): missing nested path returns undefined": async () => {
         const state = createState({ a: {} });
         const ctx = context(state);
 
-        expect((ctx.a as any).b.get())
+        await expect((ctx.a as any).b.get())
             .toEqual(undefined);
     },
 
-    "StateContext.put(): silently mutates state": () => {
+    "StateContext.put(): silently mutates state": async () => {
         const state = createState({ a: { b: 1 } });
         const ctx = context(state);
         ctx.a.b.put(2);
 
-        expect(state.a.b)
+        await expect(state.a.b)
             .toEqual(2);
     },
 
-    "StateContext.put() on nested object replaces the sub-object": () => {
+    "StateContext.put() on nested object replaces the sub-object": async () => {
         const state = createState({ a: { b: { x: 1, y: 2 } } });
         const ctx = context(state);
         ctx.a.b.put({ y: 99 });
 
-        expect(state.a.b)
+        await expect(state.a.b)
             .toEqual({ y: 99 });
     },
 
-    "StateContext.put() at root level with empty keys": () => {
+    "StateContext.put() at root level with empty keys": async () => {
         const state = createState({ a: 1, b: 2 });
         const ctx = context(state);
         ctx.put({ b: undefined });
 
-        expect(state)
+        await expect(state)
             .toEqual({ a: 1 });
     },
 
-    "StateContext.patch(): calls state.patch with proper deep partial": () => {
+    "StateContext.patch(): calls state.patch with proper deep partial": async () => {
         const state = createState({ a: { b: 1 } });
         const ctx = context(state);
         ctx.a.b.patch(2);
 
         const patches = (state as any).patch.initialPatches;
 
-        expect(patches.length)
+        await expect(patches.length)
             .toEqual(1);
-        expect(patches[0])
+        await expect(patches[0])
             .toEqual({ a: { b: 2 } });
     },
 
-    "StateContext.patch(): async wraps in array": () => {
+    "StateContext.patch(): async wraps in array": async () => {
         const state = createState({ a: { b: 1 } });
         const ctx = context(state);
         ctx.a.b.patch(2, true);
 
         const patches = (state as any).patch.initialPatches;
 
-        expect(patches.length)
+        await expect(patches.length)
             .toEqual(1);
-        expect(Array.isArray(patches[0]))
+        await expect(Array.isArray(patches[0]))
             .toEqual(true);
-        expect(patches[0][0])
+        await expect(patches[0][0])
             .toEqual({ a: { b: 2 } });
     },
 
-    "StateContext.patch() on nested deep path three levels": () => {
+    "StateContext.patch() on nested deep path three levels": async () => {
         const state = createState({ x: { y: { z: 0 } } });
         const ctx = context(state);
         ctx.x.y.z.patch(100);
 
         const patches = (state as any).patch.initialPatches;
 
-        expect(patches.length)
+        await expect(patches.length)
             .toEqual(1);
-        expect(patches[0])
+        await expect(patches[0])
             .toEqual({ x: { y: { z: 100 } } });
     },
 
-    "StateContext.put() with intermediate null creates objects along the path": () => {
+    "StateContext.put() with intermediate null creates objects along the path": async () => {
         const state = createState({ a: null as { b: number } | null });
         const ctx = context(state);
 
         ctx.a.b.put(42);
-        expect(state.a?.b).toEqual(42);
+        await expect(state.a?.b).toEqual(42);
 
         ctx.a.put(null);
-        expect(state.a).toEqual(null);
-        expect(state.a?.b).toEqual(undefined);
+        await expect(state.a).toEqual(null);
+        await expect(state.a?.b).toEqual(undefined);
     },
 
-    "StateContext.put() with three-level intermediate null": () => {
+    "StateContext.put() with three-level intermediate null": async () => {
         const state = createState({ a: null as { b: { c: number } } | null });
         const ctx = context(state);
 
         ctx.a.b.c.put(99);
 
-        expect(state.a?.b.c).toEqual(99);
+        await expect(state.a?.b.c).toEqual(99);
     },
 
-    "StateContext.put() with multiple intermediate nulls": () => {
+    "StateContext.put() with multiple intermediate nulls": async () => {
         const state = createState({ a: { x: null as { z: string } | null, y: 1 } });
         const ctx = context(state);
 
         ctx.a.x.z.put("deep");
 
-        expect(state.a.x?.z).toEqual("deep");
-        expect(state.a.y).toEqual(1);
+        await expect(state.a.x?.z).toEqual("deep");
+        await expect(state.a.y).toEqual(1);
     },
 };

package/test/tests-tag.ts

@@ -2,32 +2,32 @@ import { tag, DIV, SPAN } from "../index";
 import { expect } from "./helper";
 
 export default {
-    "tag(): on a vode returns the tag name": () => {
-        expect(tag([DIV]))
+    "tag(): on a vode returns the tag name": async () => {
+        await expect(tag([DIV]))
             .toEqual("div");
     },
 
-    "tag(): on a vode with props and children": () => {
-        expect(tag([DIV, { class: "foo" }, [SPAN, "hi"]]))
+    "tag(): on a vode with props and children": async () => {
+        await expect(tag([DIV, { class: "foo" }, [SPAN, "hi"]]))
             .toEqual("div");
     },
 
-    "tag(): on a text vode (string) returns #text": () => {
-        expect(tag("hello"))
+    "tag(): on a text vode (string) returns #text": async () => {
+        await expect(tag("hello"))
             .toEqual("#text");
     },
 
-    "tag(): on falsy values returns undefined": () => {
-        expect(tag(null)).toEqual(undefined);
-        expect(tag(undefined)).toEqual(undefined);
+    "tag(): on falsy values returns undefined": async () => {
+        await expect(tag(null)).toEqual(undefined);
+        await expect(tag(undefined)).toEqual(undefined);
     },
 
-    "tag(): on no-vode values returns undefined": () => {
-        expect(tag(0)).toEqual(undefined);
-        expect(tag(true)).toEqual(undefined);
+    "tag(): on no-vode values returns undefined": async () => {
+        await expect(tag(0)).toEqual(undefined);
+        await expect(tag(true)).toEqual(undefined);
     },
 
-    "tag(): on empty array returns undefined": () => {
-        expect(tag([])).toEqual(undefined);
+    "tag(): on empty array returns undefined": async () => {
+        await expect(tag([])).toEqual(undefined);
     }
 };

package/test/tests-vode.ts

@@ -2,14 +2,14 @@ import { vode, DIV, Vode, SPAN, STRONG } from "../index";
 import { expect } from "./helper";
 
 export default {
-    "vode(): passing an already constructed vode returns it": () => {
+    "vode(): passing an already constructed vode returns it": async () => {
         const testVode: Vode = [DIV, { class: 'test' }, "hello world"];
 
-        expect(vode(testVode)).toEqual(testVode);
+        await expect(vode(testVode)).toEqual(testVode);
     },
 
-    "vode(): constructing a vode from parts": () => {
-        expect(
+    "vode(): constructing a vode from parts": async () => {
+        await expect(
             vode(DIV, { class: 'test' },
                 [SPAN, "hello"],
                 [STRONG, { style: 'color: green' }, "world"])
@@ -20,8 +20,8 @@ export default {
         );
     },
 
-    "vode(): passing an invalid tag fails": () => {
+    "vode(): passing an invalid tag fails": async () => {
         const err = expect(() => vode(null as any)).toFail();
-        expect(err.message).toEqual("first argument to vode() must be a tag name or a vode");
+        await expect(err.message).toEqual("first argument to vode() must be a tag name or a vode");
     }
 };