mvc-kit 2.12.0 → 2.12.2

package/src/ViewModel.test.ts

@@ -0,0 +1,1236 @@
+import { describe, it, expect, vi } from 'vitest';
+import { ViewModel } from './ViewModel';
+import { Collection } from './Collection';
+import { EventBus } from './EventBus';
+import { Channel } from './Channel';
+
+interface TestState {
+  count: number;
+  name: string;
+}
+
+class TestViewModel extends ViewModel<TestState> {
+  increment() {
+    this.set({ count: this.state.count + 1 });
+  }
+
+  setName(name: string) {
+    this.set({ name });
+  }
+
+  updateWithFunction() {
+    this.set((prev) => ({ count: prev.count + 10 }));
+  }
+
+  // Expose protected method for testing
+  publicSet(partial: Partial<TestState>) {
+    this.set(partial);
+  }
+}
+
+class HookTestViewModel extends ViewModel<TestState> {
+  onSetCalls: Array<{ prev: TestState; next: TestState }> = [];
+  onDisposeCalled = false;
+
+  protected onSet(prev: TestState, next: TestState) {
+    this.onSetCalls.push({ prev: { ...prev }, next: { ...next } });
+  }
+
+  protected onDispose() {
+    this.onDisposeCalled = true;
+  }
+
+  increment() {
+    this.set({ count: this.state.count + 1 });
+  }
+}
+
+describe('ViewModel', () => {
+  describe('state initialization', () => {
+    it('initializes with provided state', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      expect(vm.state).toEqual({ count: 0, name: 'test' });
+    });
+
+    it('state is frozen', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      expect(Object.isFrozen(vm.state)).toBe(true);
+    });
+
+    it('initial disposed is false', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      expect(vm.disposed).toBe(false);
+    });
+  });
+
+  describe('state updates', () => {
+    it('updates state immutably', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      const prevState = vm.state;
+      vm.increment();
+      expect(vm.state).toEqual({ count: 1, name: 'test' });
+      expect(vm.state).not.toBe(prevState);
+    });
+
+    it('new state is frozen', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      vm.increment();
+      expect(Object.isFrozen(vm.state)).toBe(true);
+    });
+
+    it('supports updater function', () => {
+      const vm = new TestViewModel({ count: 5, name: 'test' });
+      vm.updateWithFunction();
+      expect(vm.state.count).toBe(15);
+    });
+
+    it('skips update when values unchanged', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      const listener = vi.fn();
+      vm.subscribe(listener);
+
+      vm.publicSet({ count: 0 }); // Same value
+      expect(listener).not.toHaveBeenCalled();
+    });
+
+    it('skips update when all partial values unchanged', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      const listener = vi.fn();
+      vm.subscribe(listener);
+
+      vm.publicSet({ count: 0, name: 'test' }); // Same values
+      expect(listener).not.toHaveBeenCalled();
+    });
+  });
+
+  describe('subscriptions', () => {
+    it('notifies subscriber with next and prev state', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      const listener = vi.fn();
+      vm.subscribe(listener);
+
+      vm.increment();
+
+      expect(listener).toHaveBeenCalledTimes(1);
+      expect(listener).toHaveBeenCalledWith(
+        { count: 1, name: 'test' },
+        { count: 0, name: 'test' }
+      );
+    });
+
+    it('notifies multiple subscribers', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      const listener1 = vi.fn();
+      const listener2 = vi.fn();
+      vm.subscribe(listener1);
+      vm.subscribe(listener2);
+
+      vm.increment();
+
+      expect(listener1).toHaveBeenCalledTimes(1);
+      expect(listener2).toHaveBeenCalledTimes(1);
+    });
+
+    it('unsubscribe function works', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      const listener = vi.fn();
+      const unsubscribe = vm.subscribe(listener);
+
+      vm.increment();
+      expect(listener).toHaveBeenCalledTimes(1);
+
+      unsubscribe();
+      vm.increment();
+      expect(listener).toHaveBeenCalledTimes(1); // Still 1, not called again
+    });
+  });
+
+  describe('dispose', () => {
+    it('sets disposed to true', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      vm.dispose();
+      expect(vm.disposed).toBe(true);
+    });
+
+    it('is idempotent', () => {
+      const vm = new HookTestViewModel({ count: 0, name: 'test' });
+      vm.dispose();
+      vm.dispose();
+      vm.dispose();
+      expect(vm.onDisposeCalled).toBe(true);
+      expect(vm.disposed).toBe(true);
+    });
+
+    it('returns no-op on subscribe after dispose', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      vm.dispose();
+      const unsub = vm.subscribe(() => {});
+      expect(typeof unsub).toBe('function');
+      expect(() => unsub()).not.toThrow();
+    });
+
+    it('set is a no-op after dispose', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      const stateBeforeDispose = vm.state;
+      vm.dispose();
+      vm.increment(); // should not throw
+      expect(vm.state).toBe(stateBeforeDispose);
+    });
+
+    it('clears listeners on dispose', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      const listener = vi.fn();
+      vm.subscribe(listener);
+      vm.dispose();
+
+      // Can't call set after dispose, but listeners should be cleared
+      // We verify by checking that unsubscribe after dispose doesn't error
+      expect(vm.disposed).toBe(true);
+    });
+  });
+
+  describe('hooks', () => {
+    it('calls onSet with prev and next state', () => {
+      const vm = new HookTestViewModel({ count: 0, name: 'test' });
+      vm.increment();
+      vm.increment();
+
+      expect(vm.onSetCalls).toHaveLength(2);
+      expect(vm.onSetCalls[0]).toEqual({
+        prev: { count: 0, name: 'test' },
+        next: { count: 1, name: 'test' },
+      });
+      expect(vm.onSetCalls[1]).toEqual({
+        prev: { count: 1, name: 'test' },
+        next: { count: 2, name: 'test' },
+      });
+    });
+
+    it('calls onDispose on dispose', () => {
+      const vm = new HookTestViewModel({ count: 0, name: 'test' });
+      expect(vm.onDisposeCalled).toBe(false);
+      vm.dispose();
+      expect(vm.onDisposeCalled).toBe(true);
+    });
+
+    it('onDispose only called once even with multiple dispose calls', () => {
+      let callCount = 0;
+      class CountingViewModel extends ViewModel<TestState> {
+        protected onDispose() {
+          callCount++;
+        }
+      }
+      const vm = new CountingViewModel({ count: 0, name: 'test' });
+      vm.dispose();
+      vm.dispose();
+      vm.dispose();
+      expect(callCount).toBe(1);
+    });
+  });
+
+  describe('init', () => {
+    it('starts not initialized', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      expect(vm.initialized).toBe(false);
+    });
+
+    it('sets initialized to true after init()', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      vm.init();
+      expect(vm.initialized).toBe(true);
+    });
+
+    it('calls onInit hook', () => {
+      let called = false;
+      class InitVM extends ViewModel<TestState> {
+        protected onInit() {
+          called = true;
+        }
+      }
+      const vm = new InitVM({ count: 0, name: 'test' });
+      vm.init();
+      expect(called).toBe(true);
+    });
+
+    it('is idempotent — onInit called only once', () => {
+      let callCount = 0;
+      class CountingVM extends ViewModel<TestState> {
+        protected onInit() {
+          callCount++;
+        }
+      }
+      const vm = new CountingVM({ count: 0, name: 'test' });
+      vm.init();
+      vm.init();
+      vm.init();
+      expect(callCount).toBe(1);
+    });
+
+    it('supports async onInit', async () => {
+      let resolved = false;
+      class AsyncVM extends ViewModel<TestState> {
+        protected async onInit() {
+          await Promise.resolve();
+          resolved = true;
+        }
+      }
+      const vm = new AsyncVM({ count: 0, name: 'test' });
+      await vm.init();
+      expect(resolved).toBe(true);
+    });
+
+    it('is a no-op after dispose', () => {
+      let called = false;
+      class InitVM extends ViewModel<TestState> {
+        protected onInit() {
+          called = true;
+        }
+      }
+      const vm = new InitVM({ count: 0, name: 'test' });
+      vm.dispose();
+      vm.init();
+      expect(called).toBe(false);
+      expect(vm.initialized).toBe(false);
+    });
+
+    it('can set state in onInit', () => {
+      class InitSetVM extends ViewModel<TestState> {
+        protected onInit() {
+          this.set({ count: 42 });
+        }
+        increment() {
+          this.set({ count: this.state.count + 1 });
+        }
+      }
+      const vm = new InitSetVM({ count: 0, name: 'test' });
+      vm.init();
+      expect(vm.state.count).toBe(42);
+    });
+  });
+
+  describe('signal and addCleanup', () => {
+    it('signal returns an AbortSignal', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      expect(vm.disposeSignal).toBeInstanceOf(AbortSignal);
+    });
+
+    it('returns the same signal on multiple accesses', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      const s1 = vm.disposeSignal;
+      const s2 = vm.disposeSignal;
+      expect(s1).toBe(s2);
+    });
+
+    it('signal is not aborted before dispose', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      expect(vm.disposeSignal.aborted).toBe(false);
+    });
+
+    it('signal is aborted after dispose', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      const signal = vm.disposeSignal;
+      vm.dispose();
+      expect(signal.aborted).toBe(true);
+    });
+
+    it('signal is aborted before onDispose runs', () => {
+      let wasAbortedDuringDispose = false;
+      class CheckVM extends ViewModel<TestState> {
+        protected onDispose(): void {
+          wasAbortedDuringDispose = this.disposeSignal.aborted;
+        }
+      }
+      const vm = new CheckVM({ count: 0, name: 'test' });
+      vm.disposeSignal; // force lazy creation
+      vm.dispose();
+      expect(wasAbortedDuringDispose).toBe(true);
+    });
+
+    it('addCleanup fires on dispose', () => {
+      let cleaned = false;
+      class CleanupVM extends ViewModel<TestState> {
+        setup() {
+          this.addCleanup(() => { cleaned = true; });
+        }
+      }
+      const vm = new CleanupVM({ count: 0, name: 'test' });
+      vm.setup();
+      expect(cleaned).toBe(false);
+      vm.dispose();
+      expect(cleaned).toBe(true);
+    });
+
+    it('dispose works without accessing signal (lazy, zero cost)', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      vm.dispose();
+      expect(vm.disposed).toBe(true);
+    });
+  });
+
+  describe('subscribeTo', () => {
+    it('listener is called when source changes', () => {
+      interface Item { id: string; value: number }
+      const collection = new Collection<Item>();
+
+      class SubVM extends ViewModel<TestState> {
+        values: number[] = [];
+        setup(col: Collection<Item>) {
+          this.subscribeTo(col, (items) => {
+            this.values = items.map(i => i.value);
+          });
+        }
+      }
+
+      const vm = new SubVM({ count: 0, name: 'test' });
+      vm.setup(collection);
+
+      collection.add({ id: '1', value: 42 });
+      expect(vm.values).toEqual([42]);
+
+      collection.add({ id: '2', value: 99 });
+      expect(vm.values).toEqual([42, 99]);
+    });
+
+    it('auto-unsubscribes on dispose', () => {
+      interface Item { id: string; value: number }
+      const collection = new Collection<Item>();
+      const listener = vi.fn();
+
+      class SubVM extends ViewModel<TestState> {
+        setup(col: Collection<Item>) {
+          this.subscribeTo(col, listener);
+        }
+      }
+
+      const vm = new SubVM({ count: 0, name: 'test' });
+      vm.setup(collection);
+
+      collection.add({ id: '1', value: 1 });
+      expect(listener).toHaveBeenCalledTimes(1);
+
+      vm.dispose();
+
+      collection.add({ id: '2', value: 2 });
+      expect(listener).toHaveBeenCalledTimes(1); // not called again
+    });
+
+    it('returns unsubscribe function for manual cleanup', () => {
+      interface Item { id: string; value: number }
+      const collection = new Collection<Item>();
+      const listener = vi.fn();
+
+      class SubVM extends ViewModel<TestState> {
+        setup(col: Collection<Item>): () => void {
+          return this.subscribeTo(col, listener);
+        }
+      }
+
+      const vm = new SubVM({ count: 0, name: 'test' });
+      const unsub = vm.setup(collection);
+
+      collection.add({ id: '1', value: 1 });
+      expect(listener).toHaveBeenCalledTimes(1);
+
+      unsub();
+
+      collection.add({ id: '2', value: 2 });
+      expect(listener).toHaveBeenCalledTimes(1);
+    });
+
+    it('works with other ViewModels as source', () => {
+      const source = new TestViewModel({ count: 0, name: 'source' });
+      const listener = vi.fn();
+
+      class SubVM extends ViewModel<TestState> {
+        setup(src: TestViewModel) {
+          this.subscribeTo(src, listener);
+        }
+      }
+
+      const vm = new SubVM({ count: 0, name: 'test' });
+      vm.setup(source);
+
+      source.increment();
+      expect(listener).toHaveBeenCalledTimes(1);
+      expect(listener).toHaveBeenCalledWith(
+        { count: 1, name: 'source' },
+        { count: 0, name: 'source' }
+      );
+    });
+  });
+
+  describe('listenTo', () => {
+    interface TestEvents {
+      message: { text: string };
+      status: { online: boolean };
+    }
+
+    it('handler is called when event is emitted', () => {
+      const bus = new EventBus<TestEvents>();
+      const messages: TestEvents['message'][] = [];
+
+      class ListenVM extends ViewModel<TestState> {
+        setup(b: EventBus<TestEvents>) {
+          this.listenTo(b, 'message', (msg) => messages.push(msg));
+        }
+      }
+
+      const vm = new ListenVM({ count: 0, name: 'test' });
+      vm.setup(bus);
+
+      bus.emit('message', { text: 'hello' });
+      expect(messages).toEqual([{ text: 'hello' }]);
+    });
+
+    it('auto-unsubscribes on dispose', () => {
+      const bus = new EventBus<TestEvents>();
+      const handler = vi.fn();
+
+      class ListenVM extends ViewModel<TestState> {
+        setup(b: EventBus<TestEvents>) {
+          this.listenTo(b, 'message', handler);
+        }
+      }
+
+      const vm = new ListenVM({ count: 0, name: 'test' });
+      vm.setup(bus);
+
+      bus.emit('message', { text: 'hello' });
+      expect(handler).toHaveBeenCalledTimes(1);
+
+      vm.dispose();
+
+      bus.emit('message', { text: 'world' });
+      expect(handler).toHaveBeenCalledTimes(1); // not called again
+    });
+
+    it('returns unsubscribe function for manual cleanup', () => {
+      const bus = new EventBus<TestEvents>();
+      const handler = vi.fn();
+
+      class ListenVM extends ViewModel<TestState> {
+        setup(b: EventBus<TestEvents>): () => void {
+          return this.listenTo(b, 'message', handler);
+        }
+      }
+
+      const vm = new ListenVM({ count: 0, name: 'test' });
+      const unsub = vm.setup(bus);
+
+      bus.emit('message', { text: 'hello' });
+      expect(handler).toHaveBeenCalledTimes(1);
+
+      unsub();
+
+      bus.emit('message', { text: 'world' });
+      expect(handler).toHaveBeenCalledTimes(1);
+    });
+
+    it('works with any EventSource (structural typing)', () => {
+      // Duck-type a minimal EventSource-compatible object with on()
+      // Include _types phantom for payload type narrowing (same pattern as EventBus/Channel)
+      const handlers = new Map<string, Set<(p: any) => void>>();
+      const source: { readonly _types: TestEvents; on<K extends keyof TestEvents>(event: K, handler: (payload: TestEvents[K]) => void): () => void } = {
+        _types: undefined as unknown as TestEvents,
+        on<K extends keyof TestEvents>(event: K, handler: (payload: TestEvents[K]) => void) {
+          let set = handlers.get(event as string);
+          if (!set) { set = new Set(); handlers.set(event as string, set); }
+          set.add(handler);
+          return () => { set!.delete(handler); };
+        },
+      };
+
+      const received: TestEvents['message'][] = [];
+
+      class ListenVM extends ViewModel<TestState> {
+        setup() {
+          this.listenTo(source, 'message', (msg) => received.push(msg));
+        }
+      }
+
+      const vm = new ListenVM({ count: 0, name: 'test' });
+      vm.setup();
+
+      handlers.get('message')!.forEach(h => h({ text: 'hi' }));
+      expect(received).toEqual([{ text: 'hi' }]);
+
+      vm.dispose();
+
+      handlers.get('message')!.forEach(h => h({ text: 'bye' }));
+      expect(received).toEqual([{ text: 'hi' }]); // not called after dispose
+    });
+
+    it('double-unsub is safe', () => {
+      const bus = new EventBus<TestEvents>();
+      const handler = vi.fn();
+
+      class ListenVM extends ViewModel<TestState> {
+        setup(b: EventBus<TestEvents>): () => void {
+          return this.listenTo(b, 'message', handler);
+        }
+      }
+
+      const vm = new ListenVM({ count: 0, name: 'test' });
+      const unsub = vm.setup(bus);
+
+      unsub(); // manual unsub
+      vm.dispose(); // framework unsub — should not throw
+    });
+
+    it('works with a concrete Channel subclass (generic variance regression)', () => {
+      interface ChatMessages {
+        activity: { user: string };
+        chat: { text: string };
+      }
+
+      class ChatChannel extends Channel<ChatMessages> {
+        protected open() { /* no-op */ }
+        protected close() { /* no-op */ }
+      }
+
+      const channel = new ChatChannel();
+      const received: ChatMessages['activity'][] = [];
+
+      class ListenVM extends ViewModel<TestState> {
+        setup(ch: ChatChannel) {
+          // Type-level regression: payload must be narrowed to { user: string },
+          // not the union { user: string } | { text: string }
+          this.listenTo(ch, 'activity', (payload) => {
+            void payload.user; // would fail to compile if payload were a union
+            received.push(payload);
+          });
+        }
+      }
+
+      const vm = new ListenVM({ count: 0, name: 'test' });
+      vm.setup(channel);
+
+      // Simulate receiving a message via the channel's protected receive()
+      (channel as any).receive('activity', { user: 'alice' });
+      expect(received).toEqual([{ user: 'alice' }]);
+
+      vm.dispose();
+
+      (channel as any).receive('activity', { user: 'bob' });
+      expect(received).toEqual([{ user: 'alice' }]); // not called after dispose
+    });
+
+    it('cleans up on reset and re-establishes in onInit', () => {
+      const bus = new EventBus<TestEvents>();
+      const handler = vi.fn();
+
+      class ListenVM extends ViewModel<TestState> {
+        protected onInit() {
+          this.listenTo(bus, 'message', handler);
+        }
+      }
+
+      const vm = new ListenVM({ count: 0, name: 'test' });
+      vm.init();
+
+      bus.emit('message', { text: 'before-reset' });
+      expect(handler).toHaveBeenCalledTimes(1);
+
+      vm.reset();
+
+      // Old subscription cleaned up + new one established via onInit re-run
+      bus.emit('message', { text: 'after-reset' });
+      expect(handler).toHaveBeenCalledTimes(2); // exactly 1 more call, not 2 (no duplicate)
+    });
+  });
+
+  describe('pipeChannel', () => {
+    interface DataMessages {
+      data: { id: string; value: number };
+      status: { online: boolean };
+    }
+
+    class TestChannel extends Channel<DataMessages> {
+      protected open() { /* no-op */ }
+      protected close() { /* no-op */ }
+    }
+
+    it('upserts into collection when channel receives a message', () => {
+      const channel = new TestChannel();
+      const collection = new Collection<{ id: string; value: number }>();
+
+      class PipeVM extends ViewModel<TestState> {
+        protected onInit() {
+          this.pipeChannel(channel, 'data', collection);
+        }
+      }
+
+      const vm = new PipeVM({ count: 0, name: 'test' });
+      vm.init();
+
+      (channel as any).receive('data', { id: '1', value: 42 });
+      expect(collection.items).toEqual([{ id: '1', value: 42 }]);
+
+      (channel as any).receive('data', { id: '2', value: 99 });
+      expect(collection.items).toEqual([{ id: '1', value: 42 }, { id: '2', value: 99 }]);
+
+      vm.dispose();
+    });
+
+    it('calls channel.init() automatically', () => {
+      const channel = new TestChannel();
+      const collection = new Collection<{ id: string; value: number }>();
+      const initSpy = vi.spyOn(channel, 'init');
+
+      class PipeVM extends ViewModel<TestState> {
+        protected onInit() {
+          this.pipeChannel(channel, 'data', collection);
+        }
+      }
+
+      const vm = new PipeVM({ count: 0, name: 'test' });
+      vm.init();
+
+      expect(initSpy).toHaveBeenCalledTimes(1);
+
+      vm.dispose();
+    });
+
+    it('is idempotent if channel already initialized', () => {
+      const channel = new TestChannel();
+      const collection = new Collection<{ id: string; value: number }>();
+      channel.init();
+
+      class PipeVM extends ViewModel<TestState> {
+        protected onInit() {
+          this.pipeChannel(channel, 'data', collection);
+        }
+      }
+
+      const vm = new PipeVM({ count: 0, name: 'test' });
+      expect(() => vm.init()).not.toThrow();
+
+      (channel as any).receive('data', { id: '1', value: 1 });
+      expect(collection.items).toEqual([{ id: '1', value: 1 }]);
+
+      vm.dispose();
+      channel.dispose();
+    });
+
+    it('auto-unsubscribes on dispose', () => {
+      const channel = new TestChannel();
+      const collection = new Collection<{ id: string; value: number }>();
+
+      class PipeVM extends ViewModel<TestState> {
+        protected onInit() {
+          this.pipeChannel(channel, 'data', collection);
+        }
+      }
+
+      const vm = new PipeVM({ count: 0, name: 'test' });
+      vm.init();
+
+      (channel as any).receive('data', { id: '1', value: 1 });
+      expect(collection.items).toHaveLength(1);
+
+      vm.dispose();
+
+      (channel as any).receive('data', { id: '2', value: 2 });
+      expect(collection.items).toHaveLength(1); // not upserted after dispose
+    });
+
+    it('returns unsubscribe function for manual cleanup', () => {
+      const channel = new TestChannel();
+      const collection = new Collection<{ id: string; value: number }>();
+
+      class PipeVM extends ViewModel<TestState> {
+        unsub!: () => void;
+        protected onInit() {
+          this.unsub = this.pipeChannel(channel, 'data', collection);
+        }
+      }
+
+      const vm = new PipeVM({ count: 0, name: 'test' });
+      vm.init();
+
+      (channel as any).receive('data', { id: '1', value: 1 });
+      expect(collection.items).toHaveLength(1);
+
+      vm.unsub();
+
+      (channel as any).receive('data', { id: '2', value: 2 });
+      expect(collection.items).toHaveLength(1); // stopped after manual unsub
+
+      vm.dispose();
+    });
+
+    it('cleans up on reset and re-establishes in onInit', () => {
+      const channel = new TestChannel();
+      const collection = new Collection<{ id: string; value: number }>();
+      const upsertSpy = vi.spyOn(collection, 'upsert');
+
+      class PipeVM extends ViewModel<TestState> {
+        protected onInit() {
+          this.pipeChannel(channel, 'data', collection);
+        }
+      }
+
+      const vm = new PipeVM({ count: 0, name: 'test' });
+      vm.init();
+
+      (channel as any).receive('data', { id: '1', value: 1 });
+      expect(upsertSpy).toHaveBeenCalledTimes(1);
+
+      vm.reset();
+
+      // After reset: old subscription cleaned up + new one via onInit re-run
+      (channel as any).receive('data', { id: '2', value: 2 });
+      expect(upsertSpy).toHaveBeenCalledTimes(2); // exactly 1 more call, not 2 (no duplicate)
+
+      vm.dispose();
+    });
+
+    it('type-narrowing with concrete Channel subclass', () => {
+      const channel = new TestChannel();
+      const collection = new Collection<{ id: string; value: number }>();
+
+      class PipeVM extends ViewModel<TestState> {
+        protected onInit() {
+          // Type-level: payload should be narrowed to DataMessages['data']
+          this.pipeChannel(channel, 'data', collection);
+        }
+      }
+
+      const vm = new PipeVM({ count: 0, name: 'test' });
+      vm.init();
+
+      (channel as any).receive('data', { id: '1', value: 42 });
+      expect(collection.get('1')).toEqual({ id: '1', value: 42 });
+
+      vm.dispose();
+    });
+  });
+
+  describe('reset', () => {
+    it('resets to initial state when no arg', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      vm.init();
+      vm.increment();
+      expect(vm.state.count).toBe(1);
+
+      vm.reset();
+      expect(vm.state).toEqual({ count: 0, name: 'test' });
+    });
+
+    it('resets to provided state', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      vm.init();
+      vm.increment();
+
+      vm.reset({ count: 99, name: 'new' });
+      expect(vm.state).toEqual({ count: 99, name: 'new' });
+    });
+
+    it('clears async tracking', async () => {
+      class AsyncVM extends ViewModel<TestState> {
+        async load() {
+          await Promise.resolve();
+          this.set({ count: 42 });
+        }
+      }
+
+      const vm = new AsyncVM({ count: 0, name: 'test' });
+      vm.init();
+      await vm.load();
+
+      // After load, async state exists
+      expect(vm.async.load.loading).toBe(false);
+      expect(vm.state.count).toBe(42);
+
+      vm.reset();
+
+      // Async tracking cleared — returns default
+      expect(vm.async.load).toEqual({ loading: false, error: null, errorCode: null });
+      // State reset
+      expect(vm.state.count).toBe(0);
+    });
+
+    it('re-runs onInit', () => {
+      let initCount = 0;
+      class InitVM extends ViewModel<TestState> {
+        protected onInit() {
+          initCount++;
+        }
+      }
+
+      const vm = new InitVM({ count: 0, name: 'test' });
+      vm.init();
+      expect(initCount).toBe(1);
+
+      vm.reset();
+      expect(initCount).toBe(2);
+    });
+
+    it('aborts disposeSignal, new one available after reset', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      vm.init();
+      const oldSignal = vm.disposeSignal;
+
+      vm.reset();
+
+      expect(oldSignal.aborted).toBe(true);
+      expect(vm.disposeSignal.aborted).toBe(false);
+      expect(vm.disposeSignal).not.toBe(oldSignal);
+
+      vm.dispose();
+    });
+
+    it('subscribeTo re-established after reset', () => {
+      interface Item { id: string; value: number }
+      const collection = new Collection<Item>();
+
+      class SubVM extends ViewModel<{ items: readonly Item[] }> {
+        protected onInit() {
+          this.subscribeTo(collection, (items) => {
+            this.set({ items });
+          });
+          this.set({ items: collection.items });
+        }
+      }
+
+      const vm = new SubVM({ items: [] });
+      vm.init();
+
+      collection.add({ id: '1', value: 1 });
+      expect(vm.state.items).toHaveLength(1);
+
+      vm.reset();
+
+      // onInit re-subscribes and mirrors current collection
+      expect(vm.state.items).toHaveLength(1);
+
+      // New subscription works
+      collection.add({ id: '2', value: 2 });
+      expect(vm.state.items).toHaveLength(2);
+
+      vm.dispose();
+    });
+
+    it('is no-op when disposed', () => {
+      let initCount = 0;
+      class InitVM extends ViewModel<TestState> {
+        protected onInit() {
+          initCount++;
+        }
+      }
+
+      const vm = new InitVM({ count: 0, name: 'test' });
+      vm.init();
+      expect(initCount).toBe(1);
+
+      vm.dispose();
+      vm.reset();
+
+      expect(initCount).toBe(1); // not called again
+    });
+
+    it('notifies state listeners', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      vm.init();
+      vm.increment();
+
+      const listener = vi.fn();
+      vm.subscribe(listener);
+
+      vm.reset();
+
+      expect(listener).toHaveBeenCalled();
+      expect(listener.mock.calls[0][0]).toEqual({ count: 0, name: 'test' });
+
+      vm.dispose();
+    });
+
+    it('notifies async listeners', () => {
+      class AsyncVM extends ViewModel<TestState> {
+        async load() {
+          await Promise.resolve();
+        }
+      }
+
+      const vm = new AsyncVM({ count: 0, name: 'test' });
+      vm.init();
+
+      const listener = vi.fn();
+      vm.subscribeAsync(listener);
+
+      vm.reset();
+
+      expect(listener).toHaveBeenCalled();
+
+      vm.dispose();
+    });
+  });
+
+  describe('events', () => {
+    interface TestEvents {
+      saved: { id: string };
+      error: { message: string };
+    }
+
+    class EventVM extends ViewModel<TestState, TestEvents> {
+      save(id: string) {
+        this.emit('saved', { id });
+      }
+
+      fail(message: string) {
+        this.emit('error', { message });
+      }
+    }
+
+    it('events getter returns an EventBus', () => {
+      const vm = new EventVM({ count: 0, name: 'test' });
+      expect(vm.events).toBeInstanceOf(EventBus);
+    });
+
+    it('events getter is lazy — returns same instance', () => {
+      const vm = new EventVM({ count: 0, name: 'test' });
+      const bus1 = vm.events;
+      const bus2 = vm.events;
+      expect(bus1).toBe(bus2);
+    });
+
+    it('emit fires handlers via events.on()', () => {
+      const vm = new EventVM({ count: 0, name: 'test' });
+      const handler = vi.fn();
+      vm.events.on('saved', handler);
+
+      vm.save('abc');
+
+      expect(handler).toHaveBeenCalledTimes(1);
+      expect(handler).toHaveBeenCalledWith({ id: 'abc' });
+    });
+
+    it('eventBus is auto-disposed when ViewModel disposes', () => {
+      const vm = new EventVM({ count: 0, name: 'test' });
+      const bus = vm.events;
+      expect(bus.disposed).toBe(false);
+
+      vm.dispose();
+      expect(bus.disposed).toBe(true);
+    });
+
+    it('emit is a no-op after dispose', () => {
+      const vm = new EventVM({ count: 0, name: 'test' });
+      const handler = vi.fn();
+      vm.events.on('saved', handler);
+      vm.dispose();
+
+      vm.save('abc'); // should not throw
+      expect(handler).not.toHaveBeenCalled();
+    });
+
+    it('no EventBus allocated if events getter is never accessed', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      vm.dispose();
+      // If no error is thrown and dispose works, no bus was created
+      expect(vm.disposed).toBe(true);
+    });
+
+    it('cleanup callbacks can still emit events before eventBus disposes', () => {
+      const handler = vi.fn();
+
+      class CleanupEmitVM extends ViewModel<TestState, TestEvents> {
+        setup() {
+          this.addCleanup(() => {
+            this.emit('saved', { id: 'final' });
+          });
+        }
+      }
+
+      const vm = new CleanupEmitVM({ count: 0, name: 'test' });
+      vm.events.on('saved', handler);
+      vm.setup();
+
+      vm.dispose();
+      expect(handler).toHaveBeenCalledWith({ id: 'final' });
+    });
+  });
+
+  describe('method binding', () => {
+    it('methods can be called point-free (detached from instance)', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      const { increment, setName } = vm;
+      increment();
+      expect(vm.state.count).toBe(1);
+      setName('updated');
+      expect(vm.state.name).toBe('updated');
+    });
+
+    it('bound methods work before init()', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      const fn = vm.increment;
+      fn();
+      expect(vm.state.count).toBe(1);
+    });
+
+    it('bound methods work after init() replaces them with async wrappers', async () => {
+      class AsyncVM extends ViewModel<{ value: number }> {
+        async load() {
+          this.set({ value: 42 });
+        }
+        setValue(value: number) {
+          this.set({ value });
+        }
+      }
+
+      const vm = new AsyncVM({ value: 0 });
+      await vm.init();
+
+      // After init, async wrappers replace the constructor bindings
+      const { load, setValue } = vm;
+      await load();
+      expect(vm.state.value).toBe(42);
+      setValue(99);
+      expect(vm.state.value).toBe(99);
+    });
+
+    it('bound methods survive being passed as React-style callbacks', () => {
+      const vm = new TestViewModel({ count: 0, name: 'test' });
+      // Simulate React passing the method as a callback
+      const callback: (name: string) => void = vm.setName;
+      callback('from-callback');
+      expect(vm.state.name).toBe('from-callback');
+    });
+
+    it('method reference captured before init() still works after init()', async () => {
+      class FilterVM extends ViewModel<{ filter: string }> {
+        async load() { /* noop */ }
+        setFilter(filter: string) { this.set({ filter }); }
+      }
+
+      const vm = new FilterVM({ filter: '' });
+      // Capture reference BEFORE init (simulates React first render)
+      const setFilter = vm.setFilter;
+
+      await vm.init(); // wrappers replace constructor bindings on the instance
+
+      // The captured reference is the constructor-bound function, still works
+      setFilter('active');
+      expect(vm.state.filter).toBe('active');
+    });
+  });
+
+  describe('draft mode in set()', () => {
+    interface DraftState {
+      count: number;
+      name: string;
+      config: { theme: string; fontSize: number };
+    }
+
+    class DraftVM extends ViewModel<DraftState> {
+      draftFlat(count: number) {
+        this.set((d) => { d.count = count; });
+      }
+
+      draftNested(theme: string) {
+        this.set((d) => { d.config.theme = theme; });
+      }
+
+      draftMultiple(count: number, theme: string) {
+        this.set((d) => {
+          d.count = count;
+          d.config.theme = theme;
+        });
+      }
+
+      // Existing updater pattern
+      updaterFlat(count: number) {
+        this.set(() => ({ count }));
+      }
+
+      // Object literal pattern
+      literalFlat(count: number) {
+        this.set({ count });
+      }
+    }
+
+    function createVM() {
+      return new DraftVM({ count: 0, name: 'test', config: { theme: 'dark', fontSize: 14 } });
+    }
+
+    it('draft mode: flat mutation updates state', () => {
+      const vm = createVM();
+      vm.draftFlat(5);
+      expect(vm.state.count).toBe(5);
+    });
+
+    it('draft mode: nested mutation updates state', () => {
+      const vm = createVM();
+      vm.draftNested('light');
+      expect(vm.state.config.theme).toBe('light');
+      expect(vm.state.config.fontSize).toBe(14); // preserved
+    });
+
+    it('draft mode: mixed flat + nested mutation', () => {
+      const vm = createVM();
+      vm.draftMultiple(10, 'blue');
+      expect(vm.state.count).toBe(10);
+      expect(vm.state.config.theme).toBe('blue');
+      expect(vm.state.name).toBe('test'); // unchanged
+    });
+
+    it('draft mode: no-op does not notify listeners', () => {
+      const vm = createVM();
+      const listener = vi.fn();
+      vm.subscribe(listener);
+
+      vm.draftFlat(0); // same as initial
+      expect(listener).not.toHaveBeenCalled();
+    });
+
+    it('draft mode: nested no-op does not notify', () => {
+      const vm = createVM();
+      const listener = vi.fn();
+      vm.subscribe(listener);
+
+      vm.draftNested('dark'); // same as initial
+      expect(listener).not.toHaveBeenCalled();
+    });
+
+    it('existing updater pattern still works', () => {
+      const vm = createVM();
+      vm.updaterFlat(42);
+      expect(vm.state.count).toBe(42);
+    });
+
+    it('object literal pattern still works', () => {
+      const vm = createVM();
+      vm.literalFlat(99);
+      expect(vm.state.count).toBe(99);
+    });
+
+    it('draft mode: onSet hook receives correct prev/next', () => {
+      class HookDraftVM extends ViewModel<DraftState> {
+        calls: Array<{ prev: DraftState; next: DraftState }> = [];
+        protected onSet(prev: DraftState, next: DraftState) {
+          this.calls.push({ prev: { ...prev }, next: { ...next } });
+        }
+        draftUpdate(count: number) {
+          this.set((d) => { d.count = count; });
+        }
+      }
+
+      const vm = new HookDraftVM({ count: 0, name: 'test', config: { theme: 'dark', fontSize: 14 } });
+      vm.draftUpdate(5);
+
+      expect(vm.calls).toHaveLength(1);
+      expect(vm.calls[0].prev.count).toBe(0);
+      expect(vm.calls[0].next.count).toBe(5);
+    });
+
+    it('draft mode: structural sharing preserves unchanged nested refs', () => {
+      const vm = createVM();
+      const configBefore = vm.state.config;
+
+      vm.draftFlat(1); // Only change count, not config
+
+      // Config reference should be unchanged (not in the partial)
+      expect(vm.state.config).toBe(configBefore);
+    });
+  });
+});