Merge pull request #931 from angular/main

Create a new pull request by comparing changes across two branches

.github/workflows/ci.yml

@@ -170,7 +170,7 @@ jobs:
           ./scripts/saucelabs/wait-for-tunnel.sh
           yarn bazel test --config=saucelabs //tests/legacy-cli:e2e.saucelabs
           ./scripts/saucelabs/stop-tunnel.sh
-      - uses: actions/upload-artifact@84480863f228bb9747b473957fcc9e309aa96097 # v4.4.2
+      - uses: actions/upload-artifact@b4b15b8c7c6ac21ea08fcf65892d2ee8f75cf882 # v4.4.3
         if: ${{ failure() }}
         with:
           name: sauce-connect-log

.github/workflows/pr.yml

@@ -80,7 +80,7 @@ jobs:
       - name: Build release targets
         run: yarn ng-dev release build
       - name: Store PR release packages
-        uses: actions/upload-artifact@84480863f228bb9747b473957fcc9e309aa96097 # v4.4.2
+        uses: actions/upload-artifact@b4b15b8c7c6ac21ea08fcf65892d2ee8f75cf882 # v4.4.3
         with:
           name: packages
           path: dist/releases/*.tgz

.github/workflows/scorecard.yml

@@ -38,7 +38,7 @@ jobs:
 
       # Upload the results as artifacts.
       - name: 'Upload artifact'
-        uses: actions/upload-artifact@84480863f228bb9747b473957fcc9e309aa96097 # v4.4.2
+        uses: actions/upload-artifact@b4b15b8c7c6ac21ea08fcf65892d2ee8f75cf882 # v4.4.3
         with:
           name: SARIF file
           path: results.sarif

package.json

@@ -69,15 +69,15 @@
     "@angular/platform-server": "19.0.0-next.8",
     "@angular/router": "19.0.0-next.8",
     "@angular/service-worker": "19.0.0-next.8",
-    "@babel/core": "7.25.7",
+    "@babel/core": "7.25.8",
     "@babel/generator": "7.25.7",
     "@babel/helper-annotate-as-pure": "7.25.7",
     "@babel/helper-split-export-declaration": "7.24.7",
     "@babel/plugin-syntax-import-attributes": "7.25.7",
-    "@babel/plugin-transform-async-generator-functions": "7.25.7",
+    "@babel/plugin-transform-async-generator-functions": "7.25.8",
     "@babel/plugin-transform-async-to-generator": "7.25.7",
     "@babel/plugin-transform-runtime": "7.25.7",
-    "@babel/preset-env": "7.25.7",
+    "@babel/preset-env": "7.25.8",
     "@babel/runtime": "7.25.7",
     "@bazel/bazelisk": "1.22.0",
     "@bazel/buildifier": "7.3.1",
@@ -129,7 +129,7 @@
     "buffer": "6.0.3",
     "chokidar": "4.0.1",
     "copy-webpack-plugin": "12.0.2",
-    "critters": "0.0.24",
+    "critters": "0.0.25",
     "css-loader": "7.1.2",
     "debug": "^4.1.1",
     "esbuild": "0.24.0",
@@ -186,7 +186,7 @@
     "rollup": "4.24.0",
     "rollup-plugin-sourcemaps": "^0.6.0",
     "rxjs": "7.8.1",
-    "sass": "1.79.4",
+    "sass": "1.79.5",
     "sass-loader": "16.0.2",
     "semver": "7.6.3",
     "shelljs": "^0.8.5",

packages/angular/build/package.json

@@ -20,14 +20,14 @@
   "dependencies": {
     "@ampproject/remapping": "2.3.0",
     "@angular-devkit/architect": "0.0.0-EXPERIMENTAL-PLACEHOLDER",
-    "@babel/core": "7.25.7",
+    "@babel/core": "7.25.8",
     "@babel/helper-annotate-as-pure": "7.25.7",
     "@babel/helper-split-export-declaration": "7.24.7",
     "@babel/plugin-syntax-import-attributes": "7.25.7",
     "@inquirer/confirm": "5.0.0",
     "@vitejs/plugin-basic-ssl": "1.1.0",
     "browserslist": "^4.23.0",
-    "critters": "0.0.24",
+    "critters": "0.0.25",
     "esbuild": "0.24.0",
     "fast-glob": "3.3.2",
     "https-proxy-agent": "7.0.5",
@@ -39,7 +39,7 @@
     "picomatch": "4.0.2",
     "piscina": "4.7.0",
     "rollup": "4.24.0",
-    "sass": "1.79.4",
+    "sass": "1.79.5",
     "semver": "7.6.3",
     "vite": "5.4.8",
     "watchpack": "2.4.2"

packages/angular/build/src/tools/esbuild/angular/compiler-plugin.ts

@@ -130,6 +130,7 @@ export function createCompilerPlugin(
       // Track incremental component stylesheet builds
       const stylesheetBundler = new ComponentStylesheetBundler(
         styleOptions,
+        styleOptions.inlineStyleLanguage,
         pluginOptions.incremental,
       );
       let sharedTSCompilationState: SharedTSCompilationState | undefined;
@@ -190,8 +191,8 @@ export function createCompilerPlugin(
               stylesheetResult = await stylesheetBundler.bundleInline(
                 data,
                 containingFile,
-                // Inline stylesheets from a template style element are always CSS
-                containingFile.endsWith('.html') ? 'css' : styleOptions.inlineStyleLanguage,
+                // Inline stylesheets from a template style element are always CSS; Otherwise, use default.
+                containingFile.endsWith('.html') ? 'css' : undefined,
                 // When external runtime styles are enabled, an identifier for the style that does not change
                 // based on the content is required to avoid emitted JS code changes. Any JS code changes will
                 // invalid the output and force a full page reload for HMR cases. The containing file and order
@@ -490,7 +491,6 @@ export function createCompilerPlugin(
           build,
           stylesheetBundler,
           additionalResults,
-          styleOptions.inlineStyleLanguage,
           pluginOptions.loadResultCache,
         );
       }

packages/angular/build/src/tools/esbuild/angular/component-stylesheets.ts

@@ -33,6 +33,7 @@ export class ComponentStylesheetBundler {
    */
   constructor(
     private readonly options: BundleStylesheetOptions,
+    private readonly defaultInlineLanguage: string,
     private readonly incremental: boolean,
   ) {}
 
@@ -63,7 +64,12 @@ export class ComponentStylesheetBundler {
     );
   }
 
-  async bundleInline(data: string, filename: string, language: string, externalId?: string) {
+  async bundleInline(
+    data: string,
+    filename: string,
+    language = this.defaultInlineLanguage,
+    externalId?: string,
+  ) {
     // Use a hash of the inline stylesheet content to ensure a consistent identifier. External stylesheets will resolve
     // to the actual stylesheet file path.
     // TODO: Consider xxhash instead for hashing

packages/angular/build/src/tools/esbuild/angular/jit-plugin-callbacks.ts

@@ -66,7 +66,6 @@ export function setupJitPluginCallbacks(
   build: PluginBuild,
   stylesheetBundler: ComponentStylesheetBundler,
   additionalResultFiles: Map<string, { outputFiles?: OutputFile[]; metafile?: Metafile }>,
-  inlineStyleLanguage: string,
   loadCache?: LoadResultCache,
 ): void {
   const root = build.initialOptions.absWorkingDir ?? '';
@@ -114,11 +113,7 @@ export function setupJitPluginCallbacks(
       if (entry.contents === undefined) {
         stylesheetResult = await stylesheetBundler.bundleFile(entry.path);
       } else {
-        stylesheetResult = await stylesheetBundler.bundleInline(
-          entry.contents,
-          entry.path,
-          inlineStyleLanguage,
-        );
+        stylesheetResult = await stylesheetBundler.bundleInline(entry.contents, entry.path);
       }
 
       const { contents, outputFiles, errors, warnings, metafile, referencedFiles } =

packages/angular/build/src/tools/vite/middlewares/ssr-middleware.ts

@@ -92,20 +92,18 @@ export async function createAngularSsrExternalMiddleware(
     next: Connect.NextFunction,
   ) {
     (async () => {
-      const { default: handler, AngularAppEngine } = (await server.ssrLoadModule(
-        './server.mjs',
-      )) as {
-        default?: unknown;
+      const { reqHandler, AngularAppEngine } = (await server.ssrLoadModule('./server.mjs')) as {
+        reqHandler?: unknown;
         AngularAppEngine: typeof SSRAngularAppEngine;
       };
-
-      if (!isSsrNodeRequestHandler(handler) && !isSsrRequestHandler(handler)) {
+      if (!isSsrNodeRequestHandler(reqHandler) && !isSsrRequestHandler(reqHandler)) {
         if (!fallbackWarningShown) {
           // eslint-disable-next-line no-console
           console.warn(
-            `The default export in 'server.ts' does not provide a Node.js request handler. ` +
+            `The 'reqHandler' export in 'server.ts' is either undefined or does not provide a recognized request handler. ` +
               'Using the internal SSR middleware instead.',
           );
+
           fallbackWarningShown = true;
         }
 
@@ -130,10 +128,10 @@ export async function createAngularSsrExternalMiddleware(
       }
 
       // Forward the request to the middleware in server.ts
-      if (isSsrNodeRequestHandler(handler)) {
-        await handler(req, res, next);
+      if (isSsrNodeRequestHandler(reqHandler)) {
+        await reqHandler(req, res, next);
       } else {
-        const webRes = await handler(createWebRequestFromNodeRequest(req));
+        const webRes = await reqHandler(createWebRequestFromNodeRequest(req));
         if (!webRes) {
           next();
 

packages/angular/build/src/utils/server-rendering/launch-server.ts

@@ -20,23 +20,23 @@ export const DEFAULT_URL = new URL('http://ng-localhost/');
  * @returns A promise that resolves to the URL of the running server.
  */
 export async function launchServer(): Promise<URL> {
-  const { default: handler } = await loadEsmModuleFromMemory('./server.mjs');
+  const { reqHandler } = await loadEsmModuleFromMemory('./server.mjs');
   const { createWebRequestFromNodeRequest, writeResponseToNodeResponse } =
     await loadEsmModule<typeof import('@angular/ssr/node')>('@angular/ssr/node');
 
-  if (!isSsrNodeRequestHandler(handler) && !isSsrRequestHandler(handler)) {
+  if (!isSsrNodeRequestHandler(reqHandler) && !isSsrRequestHandler(reqHandler)) {
     return DEFAULT_URL;
   }
 
   const server = createServer((req, res) => {
     (async () => {
       // handle request
-      if (isSsrNodeRequestHandler(handler)) {
-        await handler(req, res, (e) => {
+      if (isSsrNodeRequestHandler(reqHandler)) {
+        await reqHandler(req, res, (e) => {
           throw e;
         });
       } else {
-        const webRes = await handler(createWebRequestFromNodeRequest(req));
+        const webRes = await reqHandler(createWebRequestFromNodeRequest(req));
         if (webRes) {
           await writeResponseToNodeResponse(webRes, res);
         } else {

packages/angular/build/src/utils/server-rendering/load-esm-from-memory.ts

@@ -24,7 +24,7 @@ interface MainServerBundleExports {
  * Represents the exports available from the server bundle.
  */
 interface ServerBundleExports {
-  default: unknown;
+  reqHandler?: unknown;
 }
 
 export function loadEsmModuleFromMemory(

packages/angular_devkit/build_angular/package.json

@@ -11,14 +11,14 @@
     "@angular-devkit/build-webpack": "0.0.0-EXPERIMENTAL-PLACEHOLDER",
     "@angular-devkit/core": "0.0.0-PLACEHOLDER",
     "@angular/build": "0.0.0-PLACEHOLDER",
-    "@babel/core": "7.25.7",
+    "@babel/core": "7.25.8",
     "@babel/generator": "7.25.7",
     "@babel/helper-annotate-as-pure": "7.25.7",
     "@babel/helper-split-export-declaration": "7.24.7",
-    "@babel/plugin-transform-async-generator-functions": "7.25.7",
+    "@babel/plugin-transform-async-generator-functions": "7.25.8",
     "@babel/plugin-transform-async-to-generator": "7.25.7",
     "@babel/plugin-transform-runtime": "7.25.7",
-    "@babel/preset-env": "7.25.7",
+    "@babel/preset-env": "7.25.8",
     "@babel/runtime": "7.25.7",
     "@discoveryjs/json-ext": "0.6.1",
     "@ngtools/webpack": "0.0.0-PLACEHOLDER",
@@ -28,7 +28,7 @@
     "babel-loader": "9.2.1",
     "browserslist": "^4.21.5",
     "copy-webpack-plugin": "12.0.2",
-    "critters": "0.0.24",
+    "critters": "0.0.25",
     "css-loader": "7.1.2",
     "esbuild-wasm": "0.24.0",
     "fast-glob": "3.3.2",
@@ -53,7 +53,7 @@
     "postcss-loader": "8.1.1",
     "resolve-url-loader": "5.0.0",
     "rxjs": "7.8.1",
-    "sass": "1.79.4",
+    "sass": "1.79.5",
     "sass-loader": "16.0.2",
     "semver": "7.6.3",
     "source-map-loader": "5.0.0",

packages/schematics/angular/ssr/files/application-builder/server.ts.template

@@ -14,10 +14,21 @@ const browserDistFolder = resolve(serverDistFolder, '../<%= browserDistDirectory
 const app = express();
 const angularApp = new AngularNodeAppEngine();
 
-// Example Express Rest API endpoints
-// app.get('/api/**', (req, res) => { });
+/**
+ * Example Express Rest API endpoints can be defined here.
+ * Uncomment and define endpoints as necessary.
+ *
+ * Example:
+ * ```ts
+ * app.get('/api/**', (req, res) => {
+ *   // Handle API request
+ * });
+ * ```
+ */
 
-// Serve static files from /<%= browserDistDirectory %>
+/**
+ * Serve static files from /<%= browserDistDirectory %>
+ */
 app.get(
   '**',
   express.static(browserDistFolder, {
@@ -32,18 +43,30 @@ app.get(
   }),
 );
 
+/**
+ * Handle all other requests by rendering the Angular application.
+ */
 app.get('**', (req, res, next) => {
   angularApp
     .render(req)
-    .then((response) => (response ? writeResponseToNodeResponse(response, res) : next()))
+    .then((response) =>
+      response ? writeResponseToNodeResponse(response, res) : next(),
+    )
     .catch(next);
 });
 
+/**
+ * Start the server if this module is the main entry point.
+ * The server listens on the port defined by the `PORT` environment variable, or defaults to 4000.
+ */
 if (isMainModule(import.meta.url)) {
   const port = process.env['PORT'] || 4000;
   app.listen(port, () => {
     console.log(`Node Express server listening on http://localhost:${port}`);
   });
 }
 
-export default createNodeRequestHandler(app);
+/**
+ * The request handler used by the Angular CLI (dev-server and during build).
+ */
+export const reqHandler = createNodeRequestHandler(app);

tests/legacy-cli/e2e/tests/build/server-rendering/server-routes-output-mode-server-platform-neutral.ts

@@ -82,9 +82,7 @@ export default async function () {
       );
 
       app.use(router);
-
-      const handler = toWebHandler(app);
-      export default createRequestHandler(handler);
+      export const reqHandler = createRequestHandler(toWebHandler(app));
     `,
   });
   // Generate components for the above routes

tests/legacy-cli/e2e/tests/build/server-rendering/server-routes-output-mode-static-http-calls.ts

@@ -110,7 +110,7 @@ export default async function () {
         });
       }
 
-      export default createNodeRequestHandler(server);
+      export const reqHandler = createNodeRequestHandler(server);
     `,
   });
 

tests/legacy-cli/e2e/tests/vite/ssr-entry-express.ts

@@ -79,7 +79,7 @@ export default async function () {
         });
       }
 
-      export default createNodeRequestHandler(server);
+      export const reqHandler = createNodeRequestHandler(server);
   `,
   });
 

tests/legacy-cli/e2e/tests/vite/ssr-entry-fastify.ts

@@ -76,7 +76,7 @@ export default async function () {
         });
       }
 
-      export default createNodeRequestHandler(async (req, res) => {
+      export const reqHandler = createNodeRequestHandler(async (req, res) => {
         await server.ready();
         server.server.emit('request', req, res);
       });

tests/legacy-cli/e2e/tests/vite/ssr-entry-h3.ts

@@ -69,8 +69,8 @@ export default async function () {
       }
 
       const server = app();
-      const handler = toWebHandler(server);
-      export default createRequestHandler(handler);
+
+      export const reqHandler = createRequestHandler(toWebHandler(server));
     `,
   });
 

tests/legacy-cli/e2e/tests/vite/ssr-entry-hono.ts

@@ -62,7 +62,7 @@ export default async function () {
       }
 
       const server = app();
-      export default createRequestHandler(server.fetch);
+      export const reqHandler = createRequestHandler(server.fetch);
     `,
   });