@angular-devkit/build-angular 21.0.0-next.3 → 21.0.0-next.5

package/package.json

@@ -1,16 +1,16 @@
 {
   "name": "@angular-devkit/build-angular",
-  "version": "21.0.0-next.3",
+  "version": "21.0.0-next.5",
   "description": "Angular Webpack Build Facade",
   "main": "src/index.js",
   "typings": "src/index.d.ts",
   "builders": "builders.json",
   "dependencies": {
     "@ampproject/remapping": "2.3.0",
-    "@angular-devkit/architect": "0.2100.0-next.3",
-    "@angular-devkit/build-webpack": "0.2100.0-next.3",
-    "@angular-devkit/core": "21.0.0-next.3",
-    "@angular/build": "21.0.0-next.3",
+    "@angular-devkit/architect": "0.2100.0-next.5",
+    "@angular-devkit/build-webpack": "0.2100.0-next.5",
+    "@angular-devkit/core": "21.0.0-next.5",
+    "@angular/build": "21.0.0-next.5",
     "@babel/core": "7.28.4",
     "@babel/generator": "7.28.3",
     "@babel/helper-annotate-as-pure": "7.27.3",
@@ -21,14 +21,14 @@
     "@babel/preset-env": "7.28.3",
     "@babel/runtime": "7.28.4",
     "@discoveryjs/json-ext": "0.6.3",
-    "@ngtools/webpack": "21.0.0-next.3",
+    "@ngtools/webpack": "21.0.0-next.5",
     "ansi-colors": "4.1.3",
     "autoprefixer": "10.4.21",
     "babel-loader": "10.0.0",
-    "browserslist": "^4.21.5",
+    "browserslist": "^4.26.0",
     "copy-webpack-plugin": "13.0.1",
     "css-loader": "7.1.2",
-    "esbuild-wasm": "0.25.9",
+    "esbuild-wasm": "0.25.10",
     "http-proxy-middleware": "3.0.5",
     "istanbul-lib-instrument": "6.0.3",
     "jsonc-parser": "3.3.1",
@@ -39,14 +39,14 @@
     "loader-utils": "3.3.1",
     "mini-css-extract-plugin": "2.9.4",
     "open": "10.2.0",
-    "ora": "8.2.0",
+    "ora": "9.0.0",
     "picomatch": "4.0.3",
     "piscina": "5.1.3",
     "postcss": "8.5.6",
     "postcss-loader": "8.2.0",
     "resolve-url-loader": "5.0.0",
     "rxjs": "7.8.2",
-    "sass": "1.92.1",
+    "sass": "1.93.1",
     "sass-loader": "16.0.5",
     "semver": "7.7.2",
     "source-map-loader": "5.0.0",
@@ -62,7 +62,7 @@
     "webpack-subresource-integrity": "5.1.0"
   },
   "optionalDependencies": {
-    "esbuild": "0.25.9"
+    "esbuild": "0.25.10"
   },
   "peerDependencies": {
     "@angular/core": "^21.0.0-next.0",
@@ -71,7 +71,7 @@
     "@angular/platform-browser": "^21.0.0-next.0",
     "@angular/platform-server": "^21.0.0-next.0",
     "@angular/service-worker": "^21.0.0-next.0",
-    "@angular/ssr": "^21.0.0-next.3",
+    "@angular/ssr": "^21.0.0-next.5",
     "@web/test-runner": "^0.20.0",
     "browser-sync": "^3.0.2",
     "jest": "^29.5.0",
@@ -137,7 +137,7 @@
     "type": "git",
     "url": "https://github.com/angular/angular-cli.git"
   },
-  "packageManager": "pnpm@10.15.1",
+  "packageManager": "pnpm@10.17.1",
   "engines": {
     "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
     "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",

package/src/builders/app-shell/index.js

@@ -59,7 +59,11 @@ async function _renderUniversal(options, context, browserResult, serverResult, s
     const browserOptions = await context.validateOptions(rawBrowserOptions, browserBuilderName);
     // Locate zone.js to load in the render worker
     const root = context.workspaceRoot;
-    const zonePackage = require.resolve('zone.js', { paths: [root] });
+    let zonePackage;
+    try {
+        zonePackage = require.resolve('zone.js', { paths: [root] });
+    }
+    catch { }
     const projectName = context.target && context.target.project;
     if (!projectName) {
         throw new Error('The builder requires a target.');

package/src/builders/app-shell/render-worker.js

@@ -101,8 +101,9 @@ function isBootstrapFn(value) {
  * @returns A promise resolving to the render function of the worker.
  */
 async function initialize() {
-    // Setup Zone.js
-    await Promise.resolve(`${zonePackage}`).then(s => __importStar(require(s)));
+    if (zonePackage) {
+        await Promise.resolve(`${zonePackage}`).then(s => __importStar(require(s)));
+    }
     // Return the render function for use
     return render;
 }

package/src/builders/jest/index.js

@@ -141,7 +141,7 @@ exports.default = (0, architect_1.createBuilder)(async (schema, context) => {
         // the environment for fake async to work correctly.
         // Third, we initialize `TestBed`. This is dependent on fake async being set up correctly beforehand.
         `--setupFilesAfterEnv="<rootDir>/jest-global.mjs"`,
-        ...(options.polyfills ? [`--setupFilesAfterEnv="<rootDir>/polyfills.mjs"`] : []),
+        ...(options.polyfills?.length ? [`--setupFilesAfterEnv="<rootDir>/polyfills.mjs"`] : []),
         `--setupFilesAfterEnv="<rootDir>/init-test-bed.mjs"`,
         // Don't run any infrastructure files as tests, they are manually loaded where needed.
         `--testPathIgnorePatterns="<rootDir>/jest-global\\.mjs"`,

package/src/builders/jest/init-test-bed.mjs

@@ -9,10 +9,16 @@
 // TODO(dgp1130): These imports likely don't resolve in stricter package environments like `pnpm`, since they are resolved relative to
 // `@angular-devkit/build-angular` rather than the user's workspace. Should look into virtual modules to support those use cases.
 
+import { NgModule, provideZoneChangeDetection } from '@angular/core';
 import { getTestBed } from '@angular/core/testing';
 import { BrowserTestingModule, platformBrowserTesting } from '@angular/platform-browser/testing';
 
-getTestBed().initTestEnvironment(BrowserTestingModule, platformBrowserTesting(), {
+@NgModule({
+  providers: [typeof window.Zone !== 'undefined' ? provideZoneChangeDetection() : []],
+})
+class TestModule {}
+
+getTestBed().initTestEnvironment([BrowserTestingModule, TestModule], platformBrowserTesting(), {
   errorOnUnknownElements: true,
   errorOnUnknownProperties: true,
 });

package/src/builders/karma/browser_builder.js

@@ -129,13 +129,17 @@ async function initializeBrowser(options, context, webpackConfigurationTransform
     }, context, (wco) => [(0, configs_1.getCommonConfig)(wco), (0, configs_1.getStylesConfig)(wco)]);
     return [karma, (await webpackConfigurationTransformer?.(config)) ?? config];
 }
-function getBuiltInMainFile() {
+function getBuiltInMainFile(includeZoneProvider = false) {
     const content = Buffer.from(`
+  import { provideZoneChangeDetection, ɵcompileNgModuleDefs as compileNgModuleDefs } from '@angular/core';
   import { getTestBed } from '@angular/core/testing';
   import { BrowserTestingModule, platformBrowserTesting } from '@angular/platform-browser/testing';
 
+  export class TestModule {}
+  compileNgModuleDefs(TestModule, {providers: [${includeZoneProvider ? 'provideZoneChangeDetection()' : ''}]});
+
   // Initialize the Angular testing environment.
-  getTestBed().initTestEnvironment(BrowserTestingModule, platformBrowserTesting(), {
+  getTestBed().initTestEnvironment([BrowserTestingModule, TestModule], platformBrowserTesting(), {
     errorOnUnknownElements: true,
     errorOnUnknownProperties: true
   });

package/src/builders/prerender/index.js

@@ -69,6 +69,11 @@ async function getRoutes(indexFile, outputPath, serverBundlePath, options, works
             routes.add(route);
         }
     }
+    let zonePackage;
+    try {
+        zonePackage = require.resolve('zone.js/node', { paths: [workspaceRoot] });
+    }
+    catch { }
     if (discoverRoutes) {
         const renderWorker = new piscina_1.default({
             filename: require.resolve('./routes-extractor-worker'),
@@ -77,7 +82,7 @@ async function getRoutes(indexFile, outputPath, serverBundlePath, options, works
                 indexFile,
                 outputPath,
                 serverBundlePath,
-                zonePackage: require.resolve('zone.js', { paths: [workspaceRoot] }),
+                zonePackage,
             },
             recordTiming: false,
         });
@@ -145,7 +150,11 @@ async function _renderUniversal(options, context, browserResult, serverResult, b
     // Users can specify a different base html file e.g. "src/home.html"
     const indexFile = (0, webpack_browser_config_1.getIndexOutputFile)(browserOptions.index);
     const { styles: normalizedStylesOptimization } = (0, utils_1.normalizeOptimization)(browserOptions.optimization);
-    const zonePackage = require.resolve('zone.js', { paths: [context.workspaceRoot] });
+    let zonePackage;
+    try {
+        zonePackage = require.resolve('zone.js/node', { paths: [context.workspaceRoot] });
+    }
+    catch { }
     const { baseOutputPath = '' } = serverResult;
     const worker = new piscina_1.default({
         filename: path.join(__dirname, 'render-worker.js'),

package/src/builders/prerender/render-worker.js

@@ -126,8 +126,10 @@ function isBootstrapFn(value) {
  * @returns A promise resolving to the render function of the worker.
  */
 async function initialize() {
-    // Setup Zone.js
-    await Promise.resolve(`${zonePackage}`).then(s => __importStar(require(s)));
+    if (zonePackage) {
+        // Setup Zone.js
+        await Promise.resolve(`${zonePackage}`).then(s => __importStar(require(s)));
+    }
     // Return the render function for use
     return render;
 }

package/src/builders/prerender/routes-extractor-worker.d.ts

@@ -6,7 +6,7 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 export interface RoutesExtractorWorkerData {
-    zonePackage: string;
+    zonePackage: string | undefined;
     indexFile: string;
     outputPath: string;
     serverBundlePath: string;

package/src/builders/prerender/routes-extractor-worker.js

@@ -70,8 +70,10 @@ async function extract() {
  * @returns A promise resolving to the extract function of the worker.
  */
 async function initialize() {
-    // Setup Zone.js
-    await Promise.resolve(`${zonePackage}`).then(s => __importStar(require(s)));
+    if (zonePackage) {
+        // Setup Zone.js
+        await Promise.resolve(`${zonePackage}`).then(s => __importStar(require(s)));
+    }
     return extract;
 }
 /**

package/src/builders/server/index.js

@@ -206,22 +206,18 @@ async function checkTsConfigForPreserveWhitespacesSetting(context, tsConfigPath)
 function getPlatformServerExportsConfig(wco) {
     // Add `@angular/platform-server` exports.
     // This is needed so that DI tokens can be referenced and set at runtime outside of the bundle.
-    // Only add `@angular/platform-server` exports when it is installed.
-    // In some cases this builder is used when `@angular/platform-server` is not installed.
-    // Example: when using `@nguniversal/common/clover` which does not need `@angular/platform-server`.
-    return (0, helpers_1.isPackageInstalled)(wco.root, '@angular/platform-server')
-        ? {
-            module: {
-                rules: [
-                    {
-                        loader: require.resolve('./platform-server-exports-loader'),
-                        include: [path.resolve(wco.root, wco.buildOptions.main)],
-                        options: {
-                            angularSSRInstalled: (0, helpers_1.isPackageInstalled)(wco.root, '@angular/ssr'),
-                        },
+    return {
+        module: {
+            rules: [
+                {
+                    loader: require.resolve('./platform-server-exports-loader'),
+                    include: [path.resolve(wco.root, wco.buildOptions.main)],
+                    options: {
+                        angularSSRInstalled: (0, helpers_1.isPackageInstalled)(wco.root, '@angular/ssr'),
+                        isZoneJsInstalled: (0, helpers_1.isPackageInstalled)(wco.root, 'zone.js'),
                     },
-                ],
-            },
-        }
-        : {};
+                },
+            ],
+        },
+    };
 }

package/src/builders/server/platform-server-exports-loader.d.ts

@@ -12,4 +12,5 @@
  */
 export default function (this: import('webpack').LoaderContext<{
     angularSSRInstalled: boolean;
+    isZoneJsInstalled: boolean;
 }>, content: string, map: Parameters<import('webpack').LoaderDefinitionFunction>[1]): void;

package/src/builders/server/platform-server-exports-loader.js

@@ -14,7 +14,7 @@ exports.default = default_1;
  * @see https://github.com/webpack/webpack/issues/15936.
  */
 function default_1(content, map) {
-    const { angularSSRInstalled } = this.getOptions();
+    const { angularSSRInstalled, isZoneJsInstalled } = this.getOptions();
     let source = `${content}
 
   // EXPORTS added by @angular-devkit/build-angular
@@ -25,6 +25,10 @@ function default_1(content, map) {
       export { ɵgetRoutesFromAngularRouterConfig } from '@angular/ssr';
     `;
     }
+    if (isZoneJsInstalled) {
+        source = `import 'zone.js/node';
+    ${source}`;
+    }
     this.callback(null, source, map);
     return;
 }

package/src/builders/web-test-runner/jasmine_runner.js

@@ -6,6 +6,7 @@
  * found in the LICENSE file at https://angular.dev/license
  */
 
+import { NgModule } from '@angular/core';
 import { getTestBed } from '@angular/core/testing';
 import { BrowserTestingModule, platformBrowserTesting } from '@angular/platform-browser/testing';
 import {
@@ -63,8 +64,13 @@ export async function runJasmineTests(jasmineEnv) {
   // eslint-disable-next-line no-undef
   jasmine.DEFAULT_TIMEOUT_INTERVAL = config.defaultTimeoutInterval;
 
+  @NgModule({
+    providers: [typeof window.Zone !== 'undefined' ? provideZoneChangeDetection() : []],
+  })
+  class TestModule {}
+
   // Initialize `TestBed` automatically for users. This assumes we already evaluated `zone.js/testing`.
-  getTestBed().initTestEnvironment(BrowserTestingModule, platformBrowserTesting(), {
+  getTestBed().initTestEnvironment([BrowserTestingModule, TestModule], platformBrowserTesting(), {
     errorOnUnknownElements: true,
     errorOnUnknownProperties: true,
   });

package/src/tools/webpack/configs/styles.js

@@ -91,7 +91,8 @@ async function getStylesConfig(wco) {
     if (postcssConfig) {
         const postCssPluginRequire = (0, node_module_1.createRequire)(path.dirname(postcssConfig.configPath) + '/');
         for (const [pluginName, pluginOptions] of postcssConfig.config.plugins) {
-            const plugin = postCssPluginRequire(pluginName);
+            const pluginMod = postCssPluginRequire(pluginName);
+            const plugin = pluginMod.__esModule ? pluginMod['default'] : pluginMod;
             if (typeof plugin !== 'function' || plugin.postcss !== true) {
                 throw new Error(`Attempted to load invalid Postcss plugin: "${pluginName}"`);
             }

package/src/utils/normalize-cache.js

@@ -10,7 +10,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.normalizeCacheOptions = normalizeCacheOptions;
 const node_path_1 = require("node:path");
 /** Version placeholder is replaced during the build process with actual package version */
-const VERSION = '21.0.0-next.3';
+const VERSION = '21.0.0-next.5';
 function hasCacheMetadata(value) {
     return (!!value &&
         typeof value === 'object' &&