From b3879dbf1470ab4f31e676f1f8909cd50d963844 Mon Sep 17 00:00:00 2001
From: Kara Erickson <karakara@google.com>
Date: Fri, 19 Aug 2022 13:04:20 -0700
Subject: [PATCH] fix(common): support density descriptors with 2+ decimals
 (#47197)

This commit fixes a bug where `rawSrcset` in the image
directive would allow density descriptors like `1.5x`
but not like `1.25x`. Now descriptors with 2+ digits
after the decimal point should work.

PR Close #47197
---
 .../src/directives/ng_optimized_image/ng_optimized_image.ts   | 4 ++--
 packages/common/test/directives/ng_optimized_image_spec.ts    | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/common/src/directives/ng_optimized_image/ng_optimized_image.ts b/packages/common/src/directives/ng_optimized_image/ng_optimized_image.ts
index 93f6ceff39ce3..e9bca7074ede4 100644
--- a/packages/common/src/directives/ng_optimized_image/ng_optimized_image.ts
+++ b/packages/common/src/directives/ng_optimized_image/ng_optimized_image.ts
@@ -32,9 +32,9 @@ const VALID_WIDTH_DESCRIPTOR_SRCSET = /^((\s*\d+w\s*(,|$)){1,})$/;
 
 /**
  * RegExpr to determine whether a src in a srcset is using density descriptors.
- * Should match something like: "1x, 2x".
+ * Should match something like: "1x, 2x". Also supports decimals like "1.5x".
  */
-const VALID_DENSITY_DESCRIPTOR_SRCSET = /^((\s*\d(\.\d)?x\s*(,|$)){1,})$/;
+const VALID_DENSITY_DESCRIPTOR_SRCSET = /^((\s*\d(\.\d+)?x\s*(,|$)){1,})$/;
 
 /**
  * Srcset values with a density descriptor higher than this value will actively
diff --git a/packages/common/test/directives/ng_optimized_image_spec.ts b/packages/common/test/directives/ng_optimized_image_spec.ts
index 73bc8f32b3412..429aae3b5a620 100644
--- a/packages/common/test/directives/ng_optimized_image_spec.ts
+++ b/packages/common/test/directives/ng_optimized_image_spec.ts
@@ -966,7 +966,7 @@ describe('Image directive', () => {
         setupTestingModule({imageLoader});
 
         const template = `
-           <img rawSrc="img.png" rawSrcset="1x, 2.5x, 3x" width="100" height="50">
+           <img rawSrc="img.png" rawSrcset="1.75x, 2.5x, 3x" width="100" height="50">
          `;
         const fixture = createTestComponent(template);
         fixture.detectChanges();
@@ -976,7 +976,7 @@ describe('Image directive', () => {
         expect(img.src).toBe(`${IMG_BASE_URL}/img.png`);
         expect(img.srcset)
             .toBe(
-                `${IMG_BASE_URL}/img.png?w=100 1x, ` +
+                `${IMG_BASE_URL}/img.png?w=175 1.75x, ` +
                 `${IMG_BASE_URL}/img.png?w=250 2.5x, ` +
                 `${IMG_BASE_URL}/img.png?w=300 3x`);
       });