dispatch message to view

spearwolf · Jun 26, 2024 · 165400f · 165400f
1 parent 2de9f97
commit 165400f
Show file tree

Hide file tree

Showing 6 changed files with 33 additions and 6 deletions.
diff --git a/packages/shadow-ents-e2e/src/remote-worker-env.js b/packages/shadow-ents-e2e/src/remote-worker-env.js
@@ -27,10 +27,18 @@ async function main() {
   const foo = new ViewComponent('foo');
   foo.setProperty('xyz', 123);
 
+  foo.on('helloFromFoo', (...args) => {
+    console.log('HELLO', ...args);
+  });
+
   const bar = new ViewComponent('bar', {parent: foo});
   bar.setProperty('plah', 666);
 
   await testAsyncAction('shadow-env-1st-sync', async () => {
     await shadowEnv.sync();
   });
+
+  await testAsyncAction('shadow-env-hello', async () => {
+    await foo.onceAsync('helloFromFoo');
+  });
 }
diff --git a/packages/shadow-ents-e2e/src/testAsyncAction.js b/packages/shadow-ents-e2e/src/testAsyncAction.js
@@ -1,8 +1,17 @@
 import {createTestNode} from './createTestNode.js';
 
-export async function testAsyncAction(name, action) {
+export async function testAsyncAction(name, action, timeout = 5000) {
+  const waitForAction = new Promise((resolve, reject) => {
+    const timeoutId = setTimeout(reject, timeout);
+    action()
+      .then(() => {
+        clearTimeout(timeoutId);
+        resolve();
+      })
+      .catch(reject);
+  });
   try {
-    await Promise.resolve(action());
+    await waitForAction;
     createTestNode(name, 'ok', 'success');
   } catch (error) {
     createTestNode(name, 'fail', `${error}`);

diff --git a/packages/shadow-ents-e2e/tests/remote-worker-env.spec.ts b/packages/shadow-ents-e2e/tests/remote-worker-env.spec.ts
@@ -13,5 +13,5 @@ test.describe('remote-worker-env', () => {
     await page.goto('/pages/remote-worker-env.html');
   });
 
-  lookupTests(['shadow-env-ready', 'shadow-env-importScript', 'shadow-env-isReady', 'shadow-env-1st-sync']);
+  lookupTests(['shadow-env-ready', 'shadow-env-importScript', 'shadow-env-isReady', 'shadow-env-1st-sync', 'shadow-env-hello']);
 });
diff --git a/packages/shadow-ents/src/view/ComponentContext.ts b/packages/shadow-ents/src/view/ComponentContext.ts
@@ -194,6 +194,13 @@ export class ComponentContext {
     }
   }
 
+  /**
+   * Dispatch an event (usually from the shadow-objects from the worker env) to a specific view component
+   */
+  dispatchMessage(uuid: string, type: string, data: unknown = undefined, traverseChildren = false) {
+    this.#components.get(uuid)?.component.dispatchEvent(type, data, traverseChildren);
+  }
+
   /**
    * Create the component change trails at this point in time.
    * The next call will only return the differences from the previous call.

diff --git a/packages/shadow-ents/src/view/ShadowEnv.ts b/packages/shadow-ents/src/view/ShadowEnv.ts
@@ -132,5 +132,6 @@ export class ShadowEnv {
 
   #onMessageToView(event: Omit<MessageToViewEvent, 'transferables'>) {
     console.log('ShadowEnv: onMessageToView', event.type, event.data);
+    this.view?.dispatchMessage(event.uuid, event.type, event.data);
   }
 }
diff --git a/packages/shadow-ents/src/view/ViewComponent.ts b/packages/shadow-ents/src/view/ViewComponent.ts
@@ -132,10 +132,12 @@ export class ViewComponent {
     this.#context.dispatchShadowObjectsEvent(this, type, data, transferables);
   }
 
-  dispatchEvent(type: string, data: unknown) {
+  dispatchEvent(type: string, data: unknown, traverseChildren = true) {
     this.emit(type, data);
-    for (const child of this.#context!.getChildren(this)) {
-      child.dispatchEvent(type, data);
+    if (traverseChildren) {
+      for (const child of this.#context!.getChildren(this)) {
+        child.dispatchEvent(type, data);
+      }
     }
   }