Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
fix(progressbar): display progressbar correctly for invalid 'max' val…
…ues (#3400)

Fixes #3386
Closes #3390
  • Loading branch information
chrstnbrn authored and maxokorokov committed Nov 7, 2019
1 parent d3f44ca commit 9a92667
Show file tree
Hide file tree
Showing 2 changed files with 53 additions and 2 deletions.
42 changes: 42 additions & 0 deletions src/progressbar/progressbar.spec.ts
Expand Up @@ -58,6 +58,48 @@ describe('ngb-progressbar', () => {
expect(progressCmp.getPercentValue()).toBe(20);
});

it('should calculate the percentage (custom max size of null)', () => {
progressCmp.max = null;

progressCmp.value = 25;
expect(progressCmp.getPercentValue()).toBe(25);
});

it('should calculate the percentage (custom max size of undefined)', () => {
progressCmp.max = undefined;

progressCmp.value = 25;
expect(progressCmp.getPercentValue()).toBe(25);
});

it('should calculate the percentage (custom max size of zero)', () => {
progressCmp.max = 0;

progressCmp.value = 25;
expect(progressCmp.getPercentValue()).toBe(25);
});

it('should calculate the percentage (custom negative max size)', () => {
progressCmp.max = -10;

progressCmp.value = 25;
expect(progressCmp.getPercentValue()).toBe(25);
});

it('should calculate the percentage (custom max size of positive infinity)', () => {
progressCmp.max = Number.POSITIVE_INFINITY;

progressCmp.value = 25;
expect(progressCmp.getPercentValue()).toBe(25);
});

it('should calculate the percentage (custom max size of negative infinity)', () => {
progressCmp.max = Number.NEGATIVE_INFINITY;

progressCmp.value = 25;
expect(progressCmp.getPercentValue()).toBe(25);
});

it('should set the value to 0 for negative numbers', () => {
progressCmp.value = -20;
expect(progressCmp.getValue()).toBe(0);
Expand Down
13 changes: 11 additions & 2 deletions src/progressbar/progressbar.ts
@@ -1,5 +1,5 @@
import {Component, Input, ChangeDetectionStrategy} from '@angular/core';
import {getValueInRange} from '../util/util';
import {getValueInRange, isNumber} from '../util/util';
import {NgbProgressbarConfig} from './progressbar-config';

/**
Expand All @@ -19,10 +19,19 @@ import {NgbProgressbarConfig} from './progressbar-config';
`
})
export class NgbProgressbar {
private _max: number;

/**
* The maximal value to be displayed in the progress bar.
*
* Should be a positive number. Will default to 100 otherwise.
*/
@Input() max: number;
@Input()
set max(max: number) {
this._max = !isNumber(max) || max <= 0 ? 100 : max;
}

get max(): number { return this._max; }

/**
* If `true`, the stripes on the progress bar are animated.
Expand Down

0 comments on commit 9a92667

Please sign in to comment.