Add tests for MessageToView#traverseChildren implementation (#1)

* Initial plan

* Add tests for MessageToView#traverseChildren implementation

Co-authored-by: spearwolf <12805+spearwolf@users.noreply.github.com>

---------

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: spearwolf <12805+spearwolf@users.noreply.github.com>

Author: Copilot

packages/shadow-objects/src/in-the-dark/Kernel.spec.ts

@@ -1,6 +1,8 @@
-import {afterEach, describe, expect, it} from 'vitest';
+import {on} from '@spearwolf/eventize';
+import {afterEach, describe, expect, it, vi} from 'vitest';
+import {MessageToView} from '../constants.js';
 import {generateUUID} from '../utils/generateUUID.js';
-import {Kernel} from './Kernel.js';
+import {Kernel, type MessageToViewEvent} from './Kernel.js';
 import {Registry} from './Registry.js';
 import {ShadowObject} from './ShadowObject.js';
 
@@ -159,4 +161,85 @@ describe('Kernel', () => {
       'should contain instanceof ObersteDirektive',
     ).toBeDefined();
   });
+
+  describe('MessageToView with traverseChildren', () => {
+    it('should emit MessageToView event with traverseChildren=false by default', async () => {
+      const kernel = new Kernel();
+      const uuid = generateUUID();
+
+      kernel.createEntity(uuid, 'test');
+      const entity = kernel.getEntity(uuid);
+
+      const messageToViewSpy = vi.fn();
+      on(kernel, MessageToView, messageToViewSpy);
+
+      entity.dispatchMessageToView('testType', {payload: 'data'});
+
+      // Wait for queueMicrotask to complete
+      await new Promise((resolve) => queueMicrotask(() => resolve(undefined)));
+
+      expect(messageToViewSpy).toHaveBeenCalledTimes(1);
+
+      const message: MessageToViewEvent = messageToViewSpy.mock.calls[0][0];
+      expect(message.uuid).toBe(uuid);
+      expect(message.type).toBe('testType');
+      expect(message.data).toEqual({payload: 'data'});
+      expect(message.traverseChildren).toBe(false);
+
+      kernel.destroy();
+    });
+
+    it('should emit MessageToView event with traverseChildren=true when specified', async () => {
+      const kernel = new Kernel();
+      const uuid = generateUUID();
+
+      kernel.createEntity(uuid, 'test');
+      const entity = kernel.getEntity(uuid);
+
+      const messageToViewSpy = vi.fn();
+      on(kernel, MessageToView, messageToViewSpy);
+
+      entity.dispatchMessageToView('broadcastEvent', {message: 'hello'}, undefined, true);
+
+      // Wait for queueMicrotask to complete
+      await new Promise((resolve) => queueMicrotask(() => resolve(undefined)));
+
+      expect(messageToViewSpy).toHaveBeenCalledTimes(1);
+
+      const message: MessageToViewEvent = messageToViewSpy.mock.calls[0][0];
+      expect(message.uuid).toBe(uuid);
+      expect(message.type).toBe('broadcastEvent');
+      expect(message.data).toEqual({message: 'hello'});
+      expect(message.traverseChildren).toBe(true);
+
+      kernel.destroy();
+    });
+
+    it('should emit MessageToView with transferables', async () => {
+      const kernel = new Kernel();
+      const uuid = generateUUID();
+
+      kernel.createEntity(uuid, 'test');
+      const entity = kernel.getEntity(uuid);
+
+      const messageToViewSpy = vi.fn();
+      on(kernel, MessageToView, messageToViewSpy);
+
+      const buffer = new ArrayBuffer(8);
+      entity.dispatchMessageToView('dataEvent', {buffer}, [buffer], false);
+
+      // Wait for queueMicrotask to complete
+      await new Promise((resolve) => queueMicrotask(() => resolve(undefined)));
+
+      expect(messageToViewSpy).toHaveBeenCalledTimes(1);
+
+      const message: MessageToViewEvent = messageToViewSpy.mock.calls[0][0];
+      expect(message.uuid).toBe(uuid);
+      expect(message.type).toBe('dataEvent');
+      expect(message.transferables).toContain(buffer);
+      expect(message.traverseChildren).toBe(false);
+
+      kernel.destroy();
+    });
+  });
 });

packages/shadow-objects/src/in-the-dark/Kernel.ts

@@ -25,7 +25,6 @@ export interface MessageToViewEvent {
   data?: unknown;
   transferables?: Transferable[];
   traverseChildren?: boolean;
-  // TODO(test) if MessageToView#traverseChildren is implemented all the way down
 }
 
 interface EntityEntry {
@@ -383,7 +382,11 @@ export class Kernel {
           return ctxProvider;
         },
 
-        provideGlobalContext<T = unknown>(name: string | symbol, sourceOrInitialValue?: T | SignalReader<T>, isEqual?: CompareFunc<T>) {
+        provideGlobalContext<T = unknown>(
+          name: string | symbol,
+          sourceOrInitialValue?: T | SignalReader<T>,
+          isEqual?: CompareFunc<T>,
+        ) {
           let ctxProvider = contextRootProviders.get(name);
 
           if (ctxProvider == null) {

packages/shadow-objects/src/view/ShadowEnv.spec.ts

@@ -1,7 +1,8 @@
-import {once} from '@spearwolf/eventize';
+import {on, once} from '@spearwolf/eventize';
 import {afterEach, describe, expect, it, vi} from 'vitest';
 import {Registry} from '../in-the-dark/Registry.js';
 import {ShadowObject} from '../in-the-dark/ShadowObject.js';
+import type {ShadowObjectParams} from '../types.js';
 import {ComponentContext} from './ComponentContext.js';
 import {LocalShadowObjectEnv} from './LocalShadowObjectEnv.js';
 import {ShadowEnv} from './ShadowEnv.js';
@@ -87,4 +88,115 @@ describe('ShadowEnv', () => {
 
     env.destroy();
   });
+
+  it('should dispatch MessageToView with traverseChildren=true through the entire stack', async () => {
+    const env = new ShadowEnv();
+    env.view = ComponentContext.get();
+    env.envProxy = new LocalShadowObjectEnv();
+
+    // Create a hierarchy of view components
+    const parentVC = new ViewComponent('parent', {context: env.view});
+    const childVC1 = new ViewComponent('child1', {context: env.view, parent: parentVC});
+    const childVC2 = new ViewComponent('child2', {context: env.view, parent: parentVC});
+    const grandChildVC = new ViewComponent('grandChild', {context: env.view, parent: childVC1});
+
+    // Set up spies on ViewComponents to track event dispatch
+    const parentSpy = vi.fn();
+    const child1Spy = vi.fn();
+    const child2Spy = vi.fn();
+    const grandChildSpy = vi.fn();
+
+    on(parentVC, 'myEvent', parentSpy);
+    on(childVC1, 'myEvent', child1Spy);
+    on(childVC2, 'myEvent', child2Spy);
+    on(grandChildVC, 'myEvent', grandChildSpy);
+
+    // Define a shadow object that will dispatch the message with traverseChildren
+    let entityRef: {
+      dispatchMessageToView: (type: string, data?: unknown, transferables?: Transferable[], traverseChildren?: boolean) => void;
+    } | null = null;
+
+    @ShadowObject({token: 'parent'})
+    class ParentShadowObject {
+      constructor({entity}: ShadowObjectParams) {
+        entityRef = entity;
+      }
+    }
+
+    expect(ParentShadowObject).toBeDefined();
+
+    await env.syncWait();
+
+    // Verify shadow object was created and we have the entity reference
+    expect(entityRef).not.toBeNull();
+
+    // Dispatch a message with traverseChildren=true from the shadow object
+    entityRef!.dispatchMessageToView('myEvent', {testData: 'hello'}, undefined, true);
+
+    // Wait for the microtask queue to process
+    await new Promise((resolve) => setTimeout(resolve, 50));
+
+    // Verify the event was dispatched to parent and all descendants
+    expect(parentSpy).toHaveBeenCalledTimes(1);
+    expect(parentSpy).toHaveBeenCalledWith({testData: 'hello'});
+
+    expect(child1Spy).toHaveBeenCalledTimes(1);
+    expect(child1Spy).toHaveBeenCalledWith({testData: 'hello'});
+
+    expect(child2Spy).toHaveBeenCalledTimes(1);
+    expect(child2Spy).toHaveBeenCalledWith({testData: 'hello'});
+
+    expect(grandChildSpy).toHaveBeenCalledTimes(1);
+    expect(grandChildSpy).toHaveBeenCalledWith({testData: 'hello'});
+
+    env.destroy();
+  });
+
+  it('should dispatch MessageToView with traverseChildren=false only to the target component', async () => {
+    const env = new ShadowEnv();
+    env.view = ComponentContext.get();
+    env.envProxy = new LocalShadowObjectEnv();
+
+    // Create a hierarchy of view components
+    const parentVC = new ViewComponent('parent2', {context: env.view});
+    const childVC = new ViewComponent('child', {context: env.view, parent: parentVC});
+
+    // Set up spies on ViewComponents to track event dispatch
+    const parentSpy = vi.fn();
+    const childSpy = vi.fn();
+
+    on(parentVC, 'myEvent', parentSpy);
+    on(childVC, 'myEvent', childSpy);
+
+    // Define a shadow object that will dispatch the message without traverseChildren
+    let entityRef: {
+      dispatchMessageToView: (type: string, data?: unknown, transferables?: Transferable[], traverseChildren?: boolean) => void;
+    } | null = null;
+
+    @ShadowObject({token: 'parent2'})
+    class Parent2ShadowObject {
+      constructor({entity}: ShadowObjectParams) {
+        entityRef = entity;
+      }
+    }
+
+    expect(Parent2ShadowObject).toBeDefined();
+
+    await env.syncWait();
+
+    expect(entityRef).not.toBeNull();
+
+    // Dispatch a message with traverseChildren=false
+    entityRef!.dispatchMessageToView('myEvent', {testData: 'world'}, undefined, false);
+
+    // Wait for the microtask queue to process
+    await new Promise((resolve) => setTimeout(resolve, 50));
+
+    // Verify the event was dispatched only to parent, not to child
+    expect(parentSpy).toHaveBeenCalledTimes(1);
+    expect(parentSpy).toHaveBeenCalledWith({testData: 'world'});
+    expect(childSpy).not.toHaveBeenCalled();
+
+    env.destroy();
+  });
 });

packages/shadow-objects/src/view/ViewComponent.spec.ts

@@ -1,4 +1,5 @@
-import {afterEach, describe, expect, it} from 'vitest';
+import {on} from '@spearwolf/eventize';
+import {afterEach, describe, expect, it, vi} from 'vitest';
 import {ComponentContext} from './ComponentContext.js';
 import {ViewComponent} from './ViewComponent.js';
 
@@ -143,4 +144,84 @@ describe('ViewComponent', () => {
 
     otherCtx.clear();
   });
+
+  it('should dispatch event without traverseChildren', () => {
+    const parent = new ViewComponent('parent');
+    const child = new ViewComponent('child', parent);
+    const grandChild = new ViewComponent('grandChild', child);
+
+    const parentSpy = vi.fn();
+    const childSpy = vi.fn();
+    const grandChildSpy = vi.fn();
+
+    on(parent, 'testEvent', parentSpy);
+    on(child, 'testEvent', childSpy);
+    on(grandChild, 'testEvent', grandChildSpy);
+
+    parent.dispatchEvent('testEvent', {foo: 'bar'}, false);
+
+    expect(parentSpy).toHaveBeenCalledTimes(1);
+    expect(parentSpy).toHaveBeenCalledWith({foo: 'bar'});
+    expect(childSpy).not.toHaveBeenCalled();
+    expect(grandChildSpy).not.toHaveBeenCalled();
+  });
+
+  it('should dispatch event with traverseChildren=true to all descendants', () => {
+    const parent = new ViewComponent('parent');
+    const child1 = new ViewComponent('child1', parent);
+    const child2 = new ViewComponent('child2', parent);
+    const grandChild1 = new ViewComponent('grandChild1', child1);
+    const grandChild2 = new ViewComponent('grandChild2', child1);
+
+    const parentSpy = vi.fn();
+    const child1Spy = vi.fn();
+    const child2Spy = vi.fn();
+    const grandChild1Spy = vi.fn();
+    const grandChild2Spy = vi.fn();
+
+    on(parent, 'testEvent', parentSpy);
+    on(child1, 'testEvent', child1Spy);
+    on(child2, 'testEvent', child2Spy);
+    on(grandChild1, 'testEvent', grandChild1Spy);
+    on(grandChild2, 'testEvent', grandChild2Spy);
+
+    parent.dispatchEvent('testEvent', {data: 123}, true);
+
+    expect(parentSpy).toHaveBeenCalledTimes(1);
+    expect(parentSpy).toHaveBeenCalledWith({data: 123});
+
+    expect(child1Spy).toHaveBeenCalledTimes(1);
+    expect(child1Spy).toHaveBeenCalledWith({data: 123});
+
+    expect(child2Spy).toHaveBeenCalledTimes(1);
+    expect(child2Spy).toHaveBeenCalledWith({data: 123});
+
+    expect(grandChild1Spy).toHaveBeenCalledTimes(1);
+    expect(grandChild1Spy).toHaveBeenCalledWith({data: 123});
+
+    expect(grandChild2Spy).toHaveBeenCalledTimes(1);
+    expect(grandChild2Spy).toHaveBeenCalledWith({data: 123});
+  });
+
+  it('should dispatch event from child with traverseChildren=true without affecting parent', () => {
+    const parent = new ViewComponent('parent');
+    const child = new ViewComponent('child', parent);
+    const grandChild = new ViewComponent('grandChild', child);
+
+    const parentSpy = vi.fn();
+    const childSpy = vi.fn();
+    const grandChildSpy = vi.fn();
+
+    on(parent, 'testEvent', parentSpy);
+    on(child, 'testEvent', childSpy);
+    on(grandChild, 'testEvent', grandChildSpy);
+
+    child.dispatchEvent('testEvent', 'hello', true);
+
+    expect(parentSpy).not.toHaveBeenCalled();
+    expect(childSpy).toHaveBeenCalledTimes(1);
+    expect(childSpy).toHaveBeenCalledWith('hello');
+    expect(grandChildSpy).toHaveBeenCalledTimes(1);
+    expect(grandChildSpy).toHaveBeenCalledWith('hello');
+  });
 });