diff --git a/.changeset/early-bats-dance.md b/.changeset/early-bats-dance.md new file mode 100644 index 000000000..0dc941647 --- /dev/null +++ b/.changeset/early-bats-dance.md @@ -0,0 +1,5 @@ +--- +'@lion/ui': patch +--- + +fix(progress-indicator): accept 0 as a valid value diff --git a/packages/ui/components/progress-indicator/src/LionProgressIndicator.js b/packages/ui/components/progress-indicator/src/LionProgressIndicator.js index 99f610936..59349781b 100644 --- a/packages/ui/components/progress-indicator/src/LionProgressIndicator.js +++ b/packages/ui/components/progress-indicator/src/LionProgressIndicator.js @@ -150,7 +150,7 @@ export class LionProgressIndicator extends LocalizeMixin(LitElement) { } } else { if (changedProperties.has('value')) { - if (!this.value || typeof this.value !== 'number') { + if ((!this.value && this.value !== 0) || typeof this.value !== 'number') { this.removeAttribute('value'); } else if (this.value < this.min) { this.value = this.min; diff --git a/packages/ui/components/progress-indicator/test/lion-progress-indicator.test.js b/packages/ui/components/progress-indicator/test/lion-progress-indicator.test.js index 9af020bff..7fafe6c3c 100644 --- a/packages/ui/components/progress-indicator/test/lion-progress-indicator.test.js +++ b/packages/ui/components/progress-indicator/test/lion-progress-indicator.test.js @@ -149,7 +149,9 @@ describe('lion-progress-indicator', () => { const el = await fixture( html` `, ); - el.setAttribute('value', ''); + // when the attribute is defined, lit set the property to Number(attributeValue) + // this means, setting the value to an empty string will be valid because Number('') is 0 + el.setAttribute('value', 'invalid-value'); await el.updateComplete; expect(el.indeterminate).to.be.true; await el.updateComplete; @@ -158,6 +160,21 @@ describe('lion-progress-indicator', () => { expect(el.hasAttribute('aria-valuemax')).to.be.false; expect(el.getAttribute('aria-label')).to.equal('Loading'); }); + + it('can update value to 0', async () => { + const el = await fixture( + html` `, + ); + await el.updateComplete; + expect(el.indeterminate).to.be.false; + }); + + // empty string will be converted to 0 by lit because value is declared as number + it('can update value to 0 if the set value is empty string', async () => { + const el = await fixture(html` `); + await el.updateComplete; + expect(el.indeterminate).to.be.false; + }); }); describe('Subclasers', () => {