feat(@angular-devkit/build-angular): support native async/await when …

…app is zoneless

This commit updates the esbuild based builders to emit native async/await when `zone.js` is not added as a polyfill.

Closes angular#22191

packages/angular_devkit/build_angular/src/builders/dev-server/vite-server.ts

@@ -248,6 +248,9 @@ export async function* serveWithVite(
       const projectRoot = join(context.workspaceRoot, root as string);
       const browsers = getSupportedBrowsers(projectRoot, context.logger);
       const target = transformSupportedBrowsersToTargets(browsers);
+      const polyfill = Array.isArray(browserOptions.polyfills)
+        ? browserOptions.polyfills
+        : [browserOptions.polyfills];
 
       // Setup server and start listening
       const serverConfiguration = await setupServer(
@@ -259,6 +262,7 @@ export async function* serveWithVite(
         !!browserOptions.ssr,
         prebundleTransformer,
         target,
+        !polyfill.some((p) => p === 'zone.js'),
         browserOptions.loader as EsbuildLoaderOption | undefined,
         extensions?.middleware,
         transformers?.indexHtml,
@@ -443,6 +447,7 @@ export async function setupServer(
   ssr: boolean,
   prebundleTransformer: JavaScriptTransformer,
   target: string[],
+  zoneless: boolean,
   prebundleLoaderExtensions: EsbuildLoaderOption | undefined,
   extensionMiddleware?: Connect.NextHandleFunction[],
   indexHtmlTransformer?: (content: string) => Promise<string>,
@@ -540,6 +545,7 @@ export async function setupServer(
         include: externalMetadata.implicitServer,
         ssr: true,
         prebundleTransformer,
+        zoneless,
         target,
         loader: prebundleLoaderExtensions,
         thirdPartySourcemaps,
@@ -570,6 +576,7 @@ export async function setupServer(
       ssr: false,
       prebundleTransformer,
       target,
+      zoneless,
       loader: prebundleLoaderExtensions,
       thirdPartySourcemaps,
     }),
@@ -605,6 +612,7 @@ function getDepOptimizationConfig({
   exclude,
   include,
   target,
+  zoneless,
   prebundleTransformer,
   ssr,
   loader,
@@ -616,6 +624,7 @@ function getDepOptimizationConfig({
   target: string[];
   prebundleTransformer: JavaScriptTransformer;
   ssr: boolean;
+  zoneless: boolean;
   loader?: EsbuildLoaderOption;
   thirdPartySourcemaps: boolean;
 }): DepOptimizationConfig {
@@ -650,7 +659,7 @@ function getDepOptimizationConfig({
     esbuildOptions: {
       // Set esbuild supported targets.
       target,
-      supported: getFeatureSupport(target),
+      supported: getFeatureSupport(target, zoneless),
       plugins,
       loader,
     },

packages/angular_devkit/build_angular/src/tools/esbuild/application-code-bundle.ts

@@ -29,14 +29,15 @@ export function createBrowserCodeBundleOptions(
   target: string[],
   sourceFileCache?: SourceFileCache,
 ): BuildOptions {
-  const { entryPoints, outputNames } = options;
+  const { entryPoints, outputNames, polyfills } = options;
 
   const { pluginOptions, styleOptions } = createCompilerPluginOptions(
     options,
     target,
     sourceFileCache,
   );
 
+  const isZoneless = !polyfills?.some((p) => p === 'zone.js');
   const buildOptions: BuildOptions = {
     ...getEsBuildCommonOptions(options),
     platform: 'browser',
@@ -48,7 +49,7 @@ export function createBrowserCodeBundleOptions(
     entryNames: outputNames.bundles,
     entryPoints,
     target,
-    supported: getFeatureSupport(target),
+    supported: getFeatureSupport(target, isZoneless),
     plugins: [
       createSourcemapIgnorelistPlugin(),
       createCompilerPlugin(
@@ -154,8 +155,15 @@ export function createServerCodeBundleOptions(
   target: string[],
   sourceFileCache: SourceFileCache,
 ): BuildOptions {
-  const { serverEntryPoint, workspaceRoot, ssrOptions, watch, externalPackages, prerenderOptions } =
-    options;
+  const {
+    serverEntryPoint,
+    workspaceRoot,
+    ssrOptions,
+    watch,
+    externalPackages,
+    prerenderOptions,
+    polyfills,
+  } = options;
 
   assert(
     serverEntryPoint,
@@ -179,6 +187,7 @@ export function createServerCodeBundleOptions(
     entryPoints['server'] = ssrEntryPoint;
   }
 
+  const isZoneless = !polyfills?.some((p) => p === 'zone.js');
   const buildOptions: BuildOptions = {
     ...getEsBuildCommonOptions(options),
     platform: 'node',
@@ -195,7 +204,7 @@ export function createServerCodeBundleOptions(
       js: `import './polyfills.server.mjs';`,
     },
     entryPoints,
-    supported: getFeatureSupport(target),
+    supported: getFeatureSupport(target, isZoneless),
     plugins: [
       createSourcemapIgnorelistPlugin(),
       createCompilerPlugin(
@@ -262,7 +271,6 @@ export function createServerPolyfillBundleOptions(
 ): BundlerOptionsFactory | undefined {
   const polyfills: string[] = [];
   const polyfillsFromConfig = new Set(options.polyfills);
-
   if (polyfillsFromConfig.has('zone.js')) {
     polyfills.push('zone.js/node');
   }

packages/angular_devkit/build_angular/src/tools/esbuild/utils.ts

@@ -170,13 +170,17 @@ export async function withNoProgress<T>(text: string, action: () => T | Promise<
  * Generates a syntax feature object map for Angular applications based on a list of targets.
  * A full set of feature names can be found here: https://esbuild.github.io/api/#supported
  * @param target An array of browser/engine targets in the format accepted by the esbuild `target` option.
+ * @param nativeAsyncAwait Indicate whether to support native async/await.
  * @returns An object that can be used with the esbuild build `supported` option.
  */
-export function getFeatureSupport(target: string[]): BuildOptions['supported'] {
+export function getFeatureSupport(
+  target: string[],
+  nativeAsyncAwait: boolean,
+): BuildOptions['supported'] {
   const supported: Record<string, boolean> = {
     // Native async/await is not supported with Zone.js. Disabling support here will cause
     // esbuild to downlevel async/await, async generators, and for await...of to a Zone.js supported form.
-    'async-await': false,
+    'async-await': nativeAsyncAwait,
     // V8 currently has a performance defect involving object spread operations that can cause signficant
     // degradation in runtime performance. By not supporting the language feature here, a downlevel form
     // will be used instead which provides a workaround for the performance issue.