From a28615d7dd3f6503f257756058fe182ce6f6b052 Mon Sep 17 00:00:00 2001
From: Alan Agius <alanagius@google.com>
Date: Mon, 29 Jul 2024 08:06:05 +0000
Subject: [PATCH] fix(@angular/build): add CSP `nonce` attribute to script tags
 when inline critical CSS is disabled

Prior to this change when inline critical CSS is disabled CSP `nonce` was not added to script tags.

Closes #28102

(cherry picked from commit 636cb6932425b838ccd14ae6ce8b51663e6ded47)
---
 .../tests/behavior/csp-nonce_spec.ts          | 35 +++++++++++++++++++
 .../utils/index-file/index-html-generator.ts  |  2 ++
 2 files changed, 37 insertions(+)
 create mode 100644 packages/angular/build/src/builders/application/tests/behavior/csp-nonce_spec.ts

diff --git a/packages/angular/build/src/builders/application/tests/behavior/csp-nonce_spec.ts b/packages/angular/build/src/builders/application/tests/behavior/csp-nonce_spec.ts
new file mode 100644
index 000000000000..eaeff9d1249c
--- /dev/null
+++ b/packages/angular/build/src/builders/application/tests/behavior/csp-nonce_spec.ts
@@ -0,0 +1,35 @@
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.dev/license
+ */
+
+import { buildApplication } from '../../index';
+import { APPLICATION_BUILDER_INFO, BASE_OPTIONS, describeBuilder } from '../setup';
+
+describeBuilder(buildApplication, APPLICATION_BUILDER_INFO, (harness) => {
+  describe('Behavior: "CSP Nonce"', () => {
+    it('should add CSP nonce to scripts when optimization is disabled', async () => {
+      await harness.modifyFile('src/index.html', (content) =>
+        content.replace(/<app-root/g, '<app-root ngCspNonce="{% nonce %}" '),
+      );
+
+      harness.useTarget('build', {
+        ...BASE_OPTIONS,
+        polyfills: [],
+        optimization: false,
+      });
+
+      const { result } = await harness.executeOnce();
+      expect(result?.success).toBeTrue();
+
+      const indexFileContent = harness.expectFile('dist/browser/index.html').content;
+      indexFileContent.toContain(
+        '<script src="main.js" type="module" nonce="{% nonce %}"></script>',
+      );
+      indexFileContent.toContain('<app-root ngcspnonce="{% nonce %}"');
+    });
+  });
+});
diff --git a/packages/angular/build/src/utils/index-file/index-html-generator.ts b/packages/angular/build/src/utils/index-file/index-html-generator.ts
index b0303e4ae41c..bf40e2e7acac 100644
--- a/packages/angular/build/src/utils/index-file/index-html-generator.ts
+++ b/packages/angular/build/src/utils/index-file/index-html-generator.ts
@@ -78,6 +78,8 @@ export class IndexHtmlGenerator {
       this.csrPlugins.push(inlineCriticalCssPlugin(this));
     }
 
+    this.csrPlugins.push(addNoncePlugin());
+
     // SSR plugins
     if (options.generateDedicatedSSRContent) {
       this.ssrPlugins.push(addEventDispatchContractPlugin(), addNoncePlugin());