Angular doesn't work with wasm web worker

[directcuteo]

Which @angular/* package(s) are the source of the bug?

Don't known / other

Is this a regression?

Yes

Description

In my Angular 16 project, I want to use a library that provides some functionalities. These functionalities are very CPU intens, therefore they were build using Rust and OCaml and integrated using WebWorkers and WASM.
I am able to access the library successfully in a simple HTML + javascript + npm project but not in my Angular project.
It seems that the code that is delivered by the web worker is different than the original and it is accessing an inexistent function.

The error

Error location

I don't know why there is a _mainWorker function but that one is not found anywhere in the code (at compile time).
The file is grabbed at runtime as blob using http request.

And here is that function's body in its original form(in the IDE)

It seems that on runtime this code is changed and it is changed in a wrong way -> it results in that error.

Please provide a link to a minimal reproduction of the bug

No response

Please provide the exception or error you saw

`_mainWorker` is not defined

Please provide the environment you discovered this bug in (run ng version)

Angular CLI: 16.1.8
Node: 16.16.0
Package Manager: npm 8.11.0
OS: darwin arm64

Angular: 16.1.8
... animations, cli, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1601.8
@angular-devkit/build-angular   16.1.8
@angular-devkit/core            16.1.8
@angular-devkit/schematics      16.1.8
@angular/cdk                    16.1.7
@angular/fire                   7.6.1
@angular/material               16.1.7
@schematics/angular             16.1.8
ng-packagr                      16.1.0
rxjs                            7.8.1
typescript                      5.1.6
webpack                         5.88.2
zone.js                         0.13.1

Anything else?

No response

[alan-agius4]

This seems like a bug but we'll need to look at a reproduction to find and fix the problem. Can you setup a minimal repro please?

You can read here why this is needed. A good way to make a minimal repro is to create a new app via ng new repro-app and adding the minimum possible code to show the problem. Then you can push this repository to github and link it here.

This might be related to your directory structure so its really important to get an accurate repro to diagnose this.

[directcuteo]

Hello @alan-agius4 !
Here is a fresh angular project that reproduces the issue. https://github.com/directcuteo/angular-wasm
Thanks for looking into this!

[alan-agius4]

Hi @directcuteo, thanks for the reproduction.

It seems that this caused by incompatibles with top level await, which the Angular CLI this purposely not enable as it is not supported by all bundlers like esbuild evanw/esbuild#253 (comment).

It is also worth mentioned that by using a custom Webpack config we are moving away from the supported and recommended path.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}