Skip to content

Commit

Permalink
fix(compiler): allow decimals in defer block time values (#52433)
Browse files Browse the repository at this point in the history
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
  • Loading branch information
crisbeto authored and alxhub committed Oct 31, 2023
1 parent 59b6ec6 commit ddd9df6
Show file tree
Hide file tree
Showing 2 changed files with 16 additions and 8 deletions.
4 changes: 2 additions & 2 deletions packages/compiler/src/render3/r3_deferred_triggers.ts
Expand Up @@ -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$/;
Expand Down Expand Up @@ -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);
}
20 changes: 14 additions & 6 deletions packages/compiler/test/render3/r3_template_transform_spec.ts
Expand Up @@ -807,15 +807,23 @@ 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],
['Text', 'hello'],
]);
});

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],
Expand Down Expand Up @@ -883,25 +891,25 @@ 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...'],
]);
});

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...'],
]);
});
Expand Down

0 comments on commit ddd9df6

Please sign in to comment.