asyncToGenerator needs to be opt out in web workers

[andrewalderson]

Command

build, serve

Is this a regression?

• Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

Related #25708 #23546

In reading the linked issues above I understand why the asyncToGenerator code is added but there needs to be an opt-out option especially when using web workers. I ran into an issue when trying to implement sqlite3 wasm in an Angular project using the @sqlite.org/sqlite-wasm package. I have it working except when running in a worker and using the Origin Private File System. The Angular Cli will add var _asyncToGenerator = require("/{my local path}/node_modules/@angular-devkit/build-angular/node_modules/@babel/runtime/helpers/asyncToGenerator.js").default; to the top of the sqlite3-opfs-async-proxy.js file. This causes an Uncaught ReferenceError: require is not defined error.

First, shouldn't this require statement have been converted to a ___webpack-require___ on the dev server?

Second, I know that the cli doesn't know this code is in a web worker so there needs to be a way for a developer to opt out of this behavior. I don't need zone.js or any Angular code running in my worker.

The last problem is that the require statement is not removed in the production build. Shouldn't this code be inlined if it is required?

Minimal Reproduction

https://stackblitz.com/edit/stackblitz-starters-fnwhlu

If you open the console you will see the errors when you run this.

Exception or Error

No response

Your Environment

node ➜ /workspaces/angular-worker-sqlite3-wasm (main) $ ng version

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/
    

Angular CLI: 16.2.9
Node: 18.18.0
Package Manager: npm 9.8.1
OS: linux x64

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

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1602.9
@angular-devkit/build-angular   16.2.9
@angular-devkit/core            16.2.9
@angular-devkit/schematics      16.2.9
@angular/cli                    16.2.9
@schematics/angular             16.2.9
rxjs                            7.8.1
typescript                      5.1.6
zone.js                         0.13.3

Anything else relevant?

No response

[alan-agius4]

Indeed, the require statement should be removed and inlined and the fact that it is not appears to be a problem with Webpack.

With regards to the opting out of asyncToGenerator transformations, there is already a feature request here: #22191

[andrewalderson]

@alan-agius4 ....appears to be a problem with Webpack.. So, what does the mean for this issue?

[alan-agius4]

That you'd need to log an issue with Webpack and wait until it's solved upstream. At this stage there is nothing actionable from our end to solve the require problem.

[andrewalderson]

@alan-agius4 Not that it will matter but I disagree with you on this. I learned a long time ago that as a developer if you choose to use a 3rd party library in your projects then you are responsible for it. How do I know that it is not your incorrect usage of webapck that is causing this issue.

I as a developer am not using Webpack here. The Angular Cli is using Webpack. This team made the decision to use Webpack.

I am going to log an issue with Webpack because it will probably be the faster option to resolve this issue.

[alan-agius4]

Hi @andrewalderson, I am happy to log an issue with Webpack myself, in the end it will not make much difference you will log it as long as it get resolved. That said, as you mentioned it will probably be faster if you log it yourself.

One other thing to mention is that you could try to use the Esbuild based build system which will be released as stable in version 17 later next week.

[andrewalderson]

@alan-agius4 I did try the esbuild system but it didn't support Web Workers but I see that has now changed in v17. Thanks,I will give it a try. I will still open an issue with Webpack.

[alan-agius4]

Feel free to tag me if you need anything else.

[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.}