provideWorkerPort

examples/demo-app-worker/src/Chat.tsx

@@ -18,7 +18,7 @@ export default function Chat() {
             worker.current = new Worker(new URL('./worker.ts', import.meta.url), {
                 type: 'module',
             });
-            aiMaskClient.sendWorkerPort(worker.current)
+            aiMaskClient.provideWorkerPort(worker.current)
             setLoading(false);
         }
     }, []);

examples/demo-app-worker/vite.config.ts

@@ -4,5 +4,4 @@ import react from '@vitejs/plugin-react'
 // https://vitejs.dev/config/
 export default defineConfig({
   plugins: [react()],
-  base: '/ai-mask/',
 })

packages/sdk/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @ai-mask/sdk
 
+## 0.7.2
+
+### Patch Changes
+
+- passive port providing for workers
+
 ## 0.7.1
 
 ### Patch Changes

packages/sdk/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@ai-mask/sdk",
-    "version": "0.7.1",
+    "version": "0.7.2",
     "repository": {
         "type": "git",
         "url": "git+https://github.com/pacoccino/ai-mask"

packages/sdk/src/AIMaskClient.ts

@@ -115,34 +115,41 @@ export class AIMaskClient {
     }
 
     // TODO: only one worker can be used with AIMask atm
-    sendWorkerPort(worker: Worker) {
-        const { port1: mainPort, port2: workerPort } = new MessageChannel();
+    provideWorkerPort(worker: Worker) {
+        worker.addEventListener('message', ({ data }) => {
+            if (data._AIMaskWorkerPortRequest) {
+                const { port1: mainPort, port2: workerPort } = new MessageChannel();
+
+                this.messager.setPassthroughListener((message) => {
+                    mainPort.postMessage(message)
+                })
+
+                mainPort.onmessage = (event) => {
+                    const message = event.data
+                    this.messager.passthroughRequest(message)
+                }
 
-        this.messager.setPassthroughListener((message) => {
-            mainPort.postMessage(message)
+                worker.postMessage({ _AIMaskWorkerPort: workerPort }, [workerPort]);
+            }
         })
-
-        mainPort.onmessage = (event) => {
-            const message = event.data
-            this.messager.passthroughRequest(message)
-        }
-
-        worker.postMessage({ _AIMaskWorkerPort: workerPort }, [workerPort]);
     }
 
     static async getWorkerClient() {
         return new Promise<AIMaskClient>((resolve, reject) => {
             const timeout = setTimeout(() => {
                 reject(new Error('[AIMaskWorkerClient] Did not receive worker port, did you send from main thread with aiMask.sendWorkerPort(worker) ?'))
             }, 2000)
-            self.addEventListener("message", async ({ data }) => {
+            const listener = ({ data }: any) => {
                 if (data._AIMaskWorkerPort) {
-                    clearTimeout(timeout)
+                    self.removeEventListener("message", listener)
+                    clearInterval(timeout)
                     const fakePort = createFakePort(data._AIMaskWorkerPort)
                     const aiMaskClient = new AIMaskClient({ port: fakePort })
                     resolve(aiMaskClient)
                 }
-            });
+            }
+            self.addEventListener("message", listener)
+            self.postMessage({ _AIMaskWorkerPortRequest: true })
         })
     }
 }