From ddd9df68bb2e907dd820f239aaf819425cb95df8 Mon Sep 17 00:00:00 2001
From: Kristiyan Kostadinov <crisbeto@abv.bg>
Date: Thu, 26 Oct 2023 10:29:38 +0200
Subject: [PATCH] fix(compiler): allow decimals in defer block time values
 (#52433)

Fixes that our regex for parsing time values in defer blocks didn't allow for decimals. This isn't relevant for times in milliseconds, but it can be convenient to write something like `on timer(1.5s)`.

PR Close #52433
---
 .../src/render3/r3_deferred_triggers.ts       |  4 ++--
 .../render3/r3_template_transform_spec.ts     | 20 +++++++++++++------
 2 files changed, 16 insertions(+), 8 deletions(-)

diff --git a/packages/compiler/src/render3/r3_deferred_triggers.ts b/packages/compiler/src/render3/r3_deferred_triggers.ts
index fb28325ccb8..8917e412880 100644
--- a/packages/compiler/src/render3/r3_deferred_triggers.ts
+++ b/packages/compiler/src/render3/r3_deferred_triggers.ts
@@ -15,7 +15,7 @@ import {BindingParser} from '../template_parser/binding_parser';
 import * as t from './r3_ast';
 
 /** Pattern for a timing value in a trigger. */
-const TIME_PATTERN = /^\d+(ms|s)?$/;
+const TIME_PATTERN = /^\d+\.?\d*(ms|s)?$/;
 
 /** Pattern for a separator between keywords in a trigger expression. */
 const SEPARATOR_PATTERN = /^\s$/;
@@ -440,5 +440,5 @@ export function parseDeferredTime(value: string): number|null {
   }
 
   const [time, units] = match;
-  return parseInt(time) * (units === 's' ? 1000 : 1);
+  return parseFloat(time) * (units === 's' ? 1000 : 1);
 }
diff --git a/packages/compiler/test/render3/r3_template_transform_spec.ts b/packages/compiler/test/render3/r3_template_transform_spec.ts
index 0c17a70cf11..ce7265a49e6 100644
--- a/packages/compiler/test/render3/r3_template_transform_spec.ts
+++ b/packages/compiler/test/render3/r3_template_transform_spec.ts
@@ -807,7 +807,7 @@ describe('R3 template transform', () => {
       ]);
     });
 
-    it('should parse a deferred block with a timeout set in seconds', () => {
+    it('should parse a deferred block with a timer set in seconds', () => {
       expectFromHtml('@defer (on timer(10s)){hello}').toEqual([
         ['DeferredBlock'],
         ['TimerDeferredTrigger', 10000],
@@ -815,7 +815,15 @@ describe('R3 template transform', () => {
       ]);
     });
 
-    it('should parse a deferred block with a timeout that has no units', () => {
+    it('should parse a deferred block with a timer with a decimal point', () => {
+      expectFromHtml('@defer (on timer(1.5s)){hello}').toEqual([
+        ['DeferredBlock'],
+        ['TimerDeferredTrigger', 1500],
+        ['Text', 'hello'],
+      ]);
+    });
+
+    it('should parse a deferred block with a timer that has no units', () => {
       expectFromHtml('@defer (on timer(100)){hello}').toEqual([
         ['DeferredBlock'],
         ['TimerDeferredTrigger', 100],
@@ -883,12 +891,12 @@ describe('R3 template transform', () => {
     it('should parse a loading block with parameters', () => {
       expectFromHtml(
           '@defer{<calendar-cmp [date]="current"/>}' +
-          '@loading (after 100ms; minimum 1s){Loading...}')
+          '@loading (after 100ms; minimum 1.5s){Loading...}')
           .toEqual([
             ['DeferredBlock'],
             ['Element', 'calendar-cmp'],
             ['BoundAttribute', 0, 'date', 'current'],
-            ['DeferredBlockLoading', 'after 100ms', 'minimum 1000ms'],
+            ['DeferredBlockLoading', 'after 100ms', 'minimum 1500ms'],
             ['Text', 'Loading...'],
           ]);
     });
@@ -896,12 +904,12 @@ describe('R3 template transform', () => {
     it('should parse a placeholder block with parameters', () => {
       expectFromHtml(
           '@defer {<calendar-cmp [date]="current"/>}' +
-          '@placeholder (minimum 1s){Placeholder...}')
+          '@placeholder (minimum 1.5s){Placeholder...}')
           .toEqual([
             ['DeferredBlock'],
             ['Element', 'calendar-cmp'],
             ['BoundAttribute', 0, 'date', 'current'],
-            ['DeferredBlockPlaceholder', 'minimum 1000ms'],
+            ['DeferredBlockPlaceholder', 'minimum 1500ms'],
             ['Text', 'Placeholder...'],
           ]);
     });