From 90d6939ac44bf9bb23fe9d04416a47d1c18165e9 Mon Sep 17 00:00:00 2001
From: Alan Agius <alanagius@google.com>
Date: Tue, 16 May 2023 09:17:13 +0000
Subject: [PATCH] fix(@nguniversal/common): correctly handle multiple lazy CSS
 files

This commit fixes an issue with the regexp that caused incorrect output.

Closes #3128

(cherry picked from commit b603f35e583c88a83c65dfb16ad8ee23acc49cf9)
---
 integration/express-engine-ivy/angular.json            | 9 ++++++++-
 integration/express-engine-ivy/e2e/src/app.e2e-spec.ts | 8 ++++++--
 integration/express-engine-ivy/src/styles-extra.css    | 4 ++++
 modules/common/engine/src/engine.ts                    | 2 +-
 4 files changed, 19 insertions(+), 4 deletions(-)
 create mode 100644 integration/express-engine-ivy/src/styles-extra.css

diff --git a/integration/express-engine-ivy/angular.json b/integration/express-engine-ivy/angular.json
index b5ed30c1a..3eb5b0a9b 100644
--- a/integration/express-engine-ivy/angular.json
+++ b/integration/express-engine-ivy/angular.json
@@ -48,7 +48,14 @@
             "tsConfig": "tsconfig.app.json",
             "aot": true,
             "assets": ["src/favicon.ico", "src/assets"],
-            "styles": ["src/styles.css"],
+            "styles": [
+              "src/styles.css",
+              {
+                "input": "src/styles-extra.css",
+                "inject": true,
+                "bundleName": "extra"
+              }
+            ],
             "scripts": []
           },
           "configurations": {
diff --git a/integration/express-engine-ivy/e2e/src/app.e2e-spec.ts b/integration/express-engine-ivy/e2e/src/app.e2e-spec.ts
index 68d51c657..59de332ca 100644
--- a/integration/express-engine-ivy/e2e/src/app.e2e-spec.ts
+++ b/integration/express-engine-ivy/e2e/src/app.e2e-spec.ts
@@ -61,8 +61,12 @@ describe('Hello world E2E Tests', () => {
     await browser.driver.get(browser.baseUrl);
 
     // Test the contents from the server.
-    const styleTag = browser.driver.findElement(by.css('link[rel="stylesheet"]'));
-    expect(styleTag.getAttribute('media')).toMatch('all');
+    const linkTags = await browser.driver.findElements(by.css('link[rel="stylesheet"]'));
+    expect(linkTags.length).toBe(2);
+
+    for (const linkTag of linkTags) {
+      expect(linkTag.getAttribute('media')).toMatch('all');
+    }
 
     // Make sure there were no client side errors.
     verifyNoBrowserErrors();
diff --git a/integration/express-engine-ivy/src/styles-extra.css b/integration/express-engine-ivy/src/styles-extra.css
new file mode 100644
index 000000000..d529eff6a
--- /dev/null
+++ b/integration/express-engine-ivy/src/styles-extra.css
@@ -0,0 +1,4 @@
+/* You can add global styles to this file, and also import other style files */
+.foo {
+  background-color: blue;
+}
diff --git a/modules/common/engine/src/engine.ts b/modules/common/engine/src/engine.ts
index 4d784c321..7cfd8558d 100644
--- a/modules/common/engine/src/engine.ts
+++ b/modules/common/engine/src/engine.ts
@@ -102,7 +102,7 @@ export class CommonEngine {
           document: inlineCriticalCss
             ? // Workaround for https://github.com/GoogleChromeLabs/critters/issues/64
               doc.replace(
-                / media="print" onload="this\.media='.+'"(?: ngCspMedia=".+")?><noscript><link .+?><\/noscript>/g,
+                / media="print" onload="this\.media='.+?'"(?: ngCspMedia=".+")?><noscript><link .+?><\/noscript>/g,
                 '>',
               )
             : doc,