gleosmith / angular-web-worker

Library that assists with the communication between web workers and Angular apps
MIT License
32 stars 7 forks source link

Async @Callable() method throws JSON serialization error #1

Closed Humberd closed 4 years ago

Humberd commented 4 years ago

Btw great library. Really.


Problem: Using the example provided in the README there is a problem with async method:

Worker:

@AngularWebWorker()
export class AppWorker {

  @Callable()
  async doSomeWork(value1: string, value2: number): Promise<string> {
    return `${value1}-${value2 * 2}`;
  }

}
bootstrapWorker(AppWorker);

Using worker:

async callWorkerMethod() {
    await this.client.connect();
    const returnValue = await this.client.call(w => w.doSomeWork('value', 2000));
    console.log(returnValue);
  }

It throws an error:

core.js:6185 ERROR Error: Uncaught (in promise): SyntaxError: Unexpected token o in JSON at position 1
SyntaxError: Unexpected token o in JSON at position 1
    at JSON.parse (<anonymous>)
    at SafeSubscriber._next (angular-web-worker-angular.js:408)
    at SafeSubscriber.__tryOrUnsub (Subscriber.js:183)
    at SafeSubscriber.next (Subscriber.js:122)
    at Subscriber._next (Subscriber.js:72)
    at Subscriber.next (Subscriber.js:49)
    at Subject.next (Subject.js:39)
    at Worker.workerRef.onmessage [as __zone_symbol__ON_PROPERTYmessage] (angular-web-worker-angular.js:595)
    at Worker.wrapFn (zone-evergreen.js:1202)
    at ZoneDelegate.invokeTask (zone-evergreen.js:400)
    at resolvePromise (zone-evergreen.js:793)
    at zone-evergreen.js:707
    at rejected (tslib.es6.js:72)
    at ZoneDelegate.invoke (zone-evergreen.js:365)
    at Object.onInvoke (core.js:41366)
    at ZoneDelegate.invoke (zone-evergreen.js:364)
    at Zone.run (zone-evergreen.js:124)
    at zone-evergreen.js:851
    at ZoneDelegate.invokeTask (zone-evergreen.js:400)
    at Object.onInvokeTask (core.js:41344)

However, if the worker method is like this (without async):

@AngularWebWorker()
export class AppWorker {

  @Callable()
  oSomeWork(value1: string, value2: number): string {
    return `${value1}-${value2 * 2}`;
  }

}
bootstrapWorker(AppWorker);

Everything works as expected.


I'm using Angular 9.1

@edit

This is the error I get when I debugged the issue:

message: "Failed to execute 'postMessage' on 'DedicatedWorkerGlobalScope': #<Promise> could not be cloned."
gleosmith commented 4 years ago

Thanks, will have a look into this.