shae-worker: import scripts

spearwolf · Jul 7, 2024 · 340aff8 · 340aff8
1 parent 1d35be1
commit 340aff8
Show file tree

Hide file tree

Showing 8 changed files with 29 additions and 20 deletions.
diff --git a/TODO.md b/TODO.md
@@ -1,7 +1,7 @@
 
 # @spearwolf/visual-fx-web-components
 
-> _Generated by [scripts/makeTODO.mjs](scripts/makeTODO.mjs) at 2024-07-07T06:56:39.960Z_
+> _Generated by [scripts/makeTODO.mjs](scripts/makeTODO.mjs) at 2024-07-07T13:59:28.128Z_
 
 This file contains an overview of all TODO, FIXME or XXX comments extracted from the source files of the packages.
 
@@ -64,7 +64,7 @@ This file contains an overview of all TODO, FIXME or XXX comments extracted from
 | [packages/shadow-ents/src/elements/ShadowWorkerElement.ts](packages/shadow-ents/src/elements/ShadowWorkerElement.ts#L304) | 304 | what should happen with the events ? |
 | [packages/shadow-ents/src/elements/ShadowWorkerElement.ts](packages/shadow-ents/src/elements/ShadowWorkerElement.ts#L315) | 315 | find a more friendly way to destroy the worker before termination |
 | [packages/shadow-ents/src/elements/ShaeEntElement.ts](packages/shadow-ents/src/elements/ShaeEntElement.ts#L84) | 84 | make token changeable (ViewComponent)? copy properties to new instance.. |
-| [packages/shadow-ents/src/elements/ShaeWorkerElement.ts](packages/shadow-ents/src/elements/ShaeWorkerElement.ts#L99) | 99 | @test add tests for defer destroy |
+| [packages/shadow-ents/src/elements/ShaeWorkerElement.ts](packages/shadow-ents/src/elements/ShaeWorkerElement.ts#L170) | 170 | @test add tests for defer destroy |
 | [packages/shadow-ents/src/elements/events.ts](packages/shadow-ents/src/elements/events.ts#L23) | 23 | remove RequestContextEvent |
 | [packages/shadow-ents/src/entities/Entity.ts](packages/shadow-ents/src/entities/Entity.ts#L252) | 252 | @test write tests for useContext() |
 | [packages/shadow-ents/src/entities/Entity.ts](packages/shadow-ents/src/entities/Entity.ts#L258) | 258 | @test write tests for provideContext() |
@@ -80,7 +80,7 @@ This file contains an overview of all TODO, FIXME or XXX comments extracted from
 | Filename | line # | XXX |
 |:------|:------:|:------|
 | [packages/shadow-ents/src/elements/ShadowWorkerElement.ts](packages/shadow-ents/src/elements/ShadowWorkerElement.ts#L220) | 220 | do we really need to set additional properties on view component ? |
-| [packages/shadow-ents/src/elements/ShaeWorkerElement.ts](packages/shadow-ents/src/elements/ShaeWorkerElement.ts#L46) | 46 | we don't expose ShadowEnv.AfterSync here, because the frequency of this event is too high |
+| [packages/shadow-ents/src/elements/ShaeWorkerElement.ts](packages/shadow-ents/src/elements/ShaeWorkerElement.ts#L68) | 68 | we don't expose ShadowEnv.AfterSync here, because the frequency of this event is too high |
 
 
 ## offscreen-display

diff --git a/packages/shadow-ents-e2e/pages/shae-worker.html b/packages/shadow-ents-e2e/pages/shae-worker.html
@@ -7,13 +7,14 @@
     <title>shae-worker</title>
   </head>
   <body>
-    <shae-worker id="worker0"></shae-worker>
+    <shae-worker id="worker0" src="/mod-hello.js"></shae-worker>
     <shae-worker id="worker1" ns="local" local no-autostart></shae-worker>
 
     <shae-ent id="ent0" token="ent0">
       <shae-ent id="ent0_1" token="ent0_1"></shae-ent>
       <shae-ent id="ent1" ns="local" token="ent1">
         <shae-ent id="ent0_2" token="ent0_2"></shae-ent>
+        <shae-ent id="foo" token="foo"></shae-ent>
         <shae-ent id="ent1_1" ns="local" token="ent1_1"></shae-ent>
         <element-with-shadow-dom ent-inside="ent-a" ent-slot-container="ant-b" ns="local">
           <shae-ent id="ent1_2_1" ns="local" token="ent1_2_1"></shae-ent>

diff --git a/packages/shadow-ents-e2e/public/mod-hello.js b/packages/shadow-ents-e2e/public/mod-hello.js
@@ -5,9 +5,9 @@ function foo({entity, useProperty}) {
 
   xyz((val) => {
     console.log('foo.xyz changed to', val);
+    entity.dispatchMessageToView('fooEcho', xyz());
   });
 
-  // entity.dispatchViewEvent('helloFromFoo', {xyz: xyz()});
   entity.dispatchMessageToView('helloFromFoo', {xyz: xyz()});
 }
 

diff --git a/packages/shadow-ents-e2e/src/shae-worker.js b/packages/shadow-ents-e2e/src/shae-worker.js
@@ -54,8 +54,8 @@ async function main() {
   testBooleanAction('worker0-ns', worker0.ns === GlobalNS);
   testAsyncAction('worker0-is-remote-env', shadowEnv0.envProxy.workerLoaded);
 
-  await testAsyncAction('worker0-env-ready', shadowEnv0.ready);
   await testCustomEvent('worker0-env-contextCreated', worker0, ContextCreated);
+  await testAsyncAction('worker0-env-ready', shadowEnv0.ready);
 
   // --- worker1 | local | no-autostart ----------------------------------------------
 

diff --git a/packages/shadow-ents/src/elements/ShaeWorkerElement.ts b/packages/shadow-ents/src/elements/ShaeWorkerElement.ts
@@ -6,10 +6,10 @@ import {RemoteWorkerEnv} from '../view/RemoteWorkerEnv.js';
 import {ShadowEnv} from '../view/ShadowEnv.js';
 import {ShaeElement} from './ShaeElement.js';
 import {readBooleanAttribute} from './attr-utils.js';
-import {ATTR_AUTO_SYNC, ATTR_LOCAL, ATTR_NO_AUTOSTART} from './constants.js';
+import {ATTR_AUTO_SYNC, ATTR_LOCAL, ATTR_NO_AUTOSTART, ATTR_SRC} from './constants.js';
 
 export class ShaeWorkerElement extends ShaeElement {
-  static override observedAttributes = [...ShaeElement.observedAttributes, ATTR_LOCAL];
+  static override observedAttributes = [...ShaeElement.observedAttributes, ATTR_LOCAL, ATTR_SRC];
 
   static DefaultAutoSync = 'frame';
 
@@ -99,6 +99,16 @@ export class ShaeWorkerElement extends ShaeElement {
     this.syncShadowObjects();
   }
 
+  async importScript(src: URL | string): Promise<ShaeWorkerElement> {
+    if (!src) {
+      throw new Error('src is blank');
+    }
+    const shadowEnv = await this.shadowEnv.ready();
+    console.log('shadowEnv', shadowEnv);
+    await shadowEnv.envProxy.importScript(src);
+    return this;
+  }
+
   override connectedCallback() {
     super.connectedCallback();
 
@@ -128,6 +138,9 @@ export class ShaeWorkerElement extends ShaeElement {
     if (name === ATTR_AUTO_SYNC) {
       this.autoSync = this.hasAttribute(ATTR_AUTO_SYNC) ? this.getAttribute(ATTR_AUTO_SYNC) : true;
     }
+    if (name === ATTR_SRC) {
+      this.importScript(this.getAttribute(ATTR_SRC));
+    }
   }
 
   start(): Promise<ShadowEnv> {

diff --git a/packages/shadow-ents/src/elements/constants.ts b/packages/shadow-ents/src/elements/constants.ts
@@ -22,3 +22,4 @@ export const ATTR_LOCAL = 'local';
 export const ATTR_NO_AUTOSTART = 'no-autostart';
 export const ATTR_TOKEN = 'token';
 export const ATTR_AUTO_SYNC = 'auto-sync';
+export const ATTR_SRC = 'src';
diff --git a/packages/shadow-ents/src/types.ts b/packages/shadow-ents/src/types.ts
@@ -84,8 +84,11 @@ export interface AppliedChangeTrailEvent {
   error?: string;
 }
 
+// TODO interface ShadowsObjectsApi (params for constructor|function)
+
 export interface ShadowObjectConstructor {
   new (...args: any[]): {};
+  displayName?: string;
 }
 
 export type ShadowObjectType = EventizeApi;

diff --git a/packages/shadow-ents/src/view/ShadowEnv.ts b/packages/shadow-ents/src/view/ShadowEnv.ts
@@ -26,7 +26,6 @@ export class ShadowEnv {
   #shaObjEnvProxy?: IShadowObjectEnvProxy;
   #syncScheduled = false;
   #syncAfterContextCreated = false;
-  #whenReady!: Promise<ShadowEnv>;
 
   readonly ns$ = createSignal<NamespaceType | undefined>();
 
@@ -44,14 +43,6 @@ export class ShadowEnv {
       this.retainClear(ShadowEnv.ContextCreated);
     });
 
-    createEffect(() => {
-      if (this.proxyReady) {
-        this.#whenReady = Promise.resolve(this);
-      } else {
-        this.#whenReady = this.onceAsync<ShadowEnv>(ShadowEnv.ContextCreated);
-      }
-    }, [this.proxyReady$]);
-
     createEffect(() => {
       if (this.viewReady && this.proxyReady) {
         this.view!.reCreateChanges();
@@ -130,14 +121,14 @@ export class ShadowEnv {
     return Boolean(this.#comCtx && this.#shaObjEnvProxy && this.proxyReady);
   }
 
-  readonly ready = async (): Promise<ShadowEnv> => {
-    return this.#whenReady;
+  readonly ready = (): Promise<ShadowEnv> => {
+    return this.isReady ? Promise.resolve(this) : this.onceAsync(ShadowEnv.ContextCreated);
   };
 
   sync(): Promise<ShadowEnv> {
     if (!this.isReady) {
       this.#syncAfterContextCreated = true;
-      return this.#whenReady;
+      return this.ready();
     }
     const onSync = this.onceAsync<ShadowEnv>(ShadowEnv.AfterSync);
     if (this.#syncScheduled) return onSync;