fix(@angular/ssr): include Content-Language header when locale is set

The server now includes the `Content-Language` HTTP header in responses whenever a locale is explicitly set. (cherry picked from commit d7214e9)
angular · Dec 7, 2024 · b3c6c7e · b3c6c7e
1 parent 9ae8351
commit b3c6c7e
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 11 deletions.
diff --git a/packages/angular/ssr/src/app.ts b/packages/angular/ssr/src/app.ts
@@ -210,11 +210,16 @@ export class AngularServerApp {
     }
 
     const assetPath = this.buildServerAssetPathFromRequest(request);
-    if (!this.assets.hasServerAsset(assetPath)) {
+    const {
+      manifest: { locale },
+      assets,
+    } = this;
+
+    if (!assets.hasServerAsset(assetPath)) {
       return null;
     }
 
-    const { text, hash, size } = this.assets.getServerAsset(assetPath);
+    const { text, hash, size } = assets.getServerAsset(assetPath);
     const etag = `"${hash}"`;
 
     return request.headers.get('if-none-match') === etag
@@ -224,6 +229,7 @@ export class AngularServerApp {
             'Content-Length': size.toString(),
             'ETag': etag,
             'Content-Type': 'text/html;charset=UTF-8',
+            ...(locale !== undefined ? { 'Content-Language': locale } : {}),
             ...headers,
           },
         });
@@ -254,11 +260,17 @@ export class AngularServerApp {
     const url = new URL(request.url);
     const platformProviders: StaticProvider[] = [];
 
+    const {
+      manifest: { bootstrap, inlineCriticalCss, locale },
+      assets,
+    } = this;
+
     // Initialize the response with status and headers if available.
     const responseInit = {
       status,
       headers: new Headers({
         'Content-Type': 'text/html;charset=UTF-8',
+        ...(locale !== undefined ? { 'Content-Language': locale } : {}),
         ...headers,
       }),
     };
@@ -281,18 +293,12 @@ export class AngularServerApp {
       );
     } else if (renderMode === RenderMode.Client) {
       // Serve the client-side rendered version if the route is configured for CSR.
-      let html = await this.assets.getServerAsset('index.csr.html').text();
+      let html = await assets.getServerAsset('index.csr.html').text();
       html = await this.runTransformsOnHtml(html, url);
 
       return new Response(html, responseInit);
     }
 
-    const {
-      manifest: { bootstrap, inlineCriticalCss, locale },
-      hooks,
-      assets,
-    } = this;
-
     if (locale !== undefined) {
       platformProviders.push({
         provide: LOCALE_ID,

diff --git a/packages/angular/ssr/test/app-engine_spec.ts b/packages/angular/ssr/test/app-engine_spec.ts
@@ -60,6 +60,7 @@ function createEntryPoint(locale: string) {
         `,
         },
       },
+      locale,
     );
 
     return {
@@ -110,12 +111,14 @@ describe('AngularAppEngine', () => {
         const request = new Request('https://example.com/it/ssr/index.html');
         const response = await appEngine.handle(request);
         expect(await response?.text()).toContain('SSR works IT');
+        expect(response?.headers?.get('Content-Language')).toBe('it');
       });
 
       it('should return a serve prerendered page with correct locale', async () => {
         const request = new Request('https://example.com/it/ssg');
         const response = await appEngine.handle(request);
         expect(await response?.text()).toContain('SSG works IT');
+        expect(response?.headers?.get('Content-Language')).toBe('it');
       });
 
       it('should correctly serve the prerendered content when the URL ends with "index.html" with correct locale', async () => {

diff --git a/packages/angular/ssr/test/testing-utils.ts b/packages/angular/ssr/test/testing-utils.ts
@@ -21,14 +21,18 @@ import { ServerRoute, provideServerRoutesConfig } from '../src/routes/route-conf
  * Angular components and providers for testing purposes.
  *
  * @param routes - An array of route definitions to be used by the Angular Router.
- * @param serverRoutes - An array of ServerRoute definitions to be used for server-side rendering.
- * @param [baseHref='/'] - An optional base href to be used in the HTML template.
+ * @param serverRoutes - An array of server route definitions for server-side rendering.
+ * @param [baseHref='/'] - An optional base href for the HTML template (default is `/`).
+ * @param additionalServerAssets - A record of additional server assets to include,
+ *                                  where the keys are asset paths and the values are asset details.
+ * @param locale - An optional locale to configure for the application during testing.
  */
 export function setAngularAppTestingManifest(
   routes: Routes,
   serverRoutes: ServerRoute[],
   baseHref = '/',
   additionalServerAssets: Record<string, ServerAsset> = {},
+  locale?: string,
 ): void {
   destroyAngularServerApp();
 
@@ -43,6 +47,7 @@ export function setAngularAppTestingManifest(
   setAngularAppManifest({
     inlineCriticalCss: false,
     baseHref,
+    locale,
     assets: {
       ...additionalServerAssets,
       'index.server.html': {