diff --git a/packages/slider/src/Slider.ts b/packages/slider/src/Slider.ts
index a5dfa431cc..e11f2aeccb 100644
--- a/packages/slider/src/Slider.ts
+++ b/packages/slider/src/Slider.ts
@@ -37,26 +37,7 @@ export class Slider extends Focusable {
public type = '';
@property({ type: Number, reflect: true })
- public get value(): number {
- return this._value;
- }
-
- public set value(value: number) {
- const oldValue = this.value;
- if (this.input) {
- this.input.value = String(value);
- }
- const newValue = this.input ? parseFloat(this.input.value) : value;
-
- if (newValue === oldValue) {
- return;
- }
-
- this._value = newValue;
- this.requestUpdate('value', oldValue);
- }
-
- private _value = 10;
+ public value = 10;
@property({ type: String })
public set variant(variant: string) {
@@ -145,7 +126,11 @@ export class Slider extends Focusable {
protected updated(changedProperties: PropertyValues): void {
if (changedProperties.has('value')) {
- this.dispatchInputEvent();
+ if (this.value === this.input.valueAsNumber) {
+ this.dispatchInputEvent();
+ } else {
+ this.value = this.input.valueAsNumber;
+ }
}
}
@@ -261,10 +246,10 @@ export class Slider extends Focusable {
{
expect(input.getAttribute('aria-valuetext')).to.equal('50');
});
+ it('accepts min/max/value in the same timing', async () => {
+ const el = await fixture(
+ html`
+
+ `
+ );
+
+ await elementUpdated(el);
+
+ expect(el.value).to.equal(10);
+
+ el.min = 0;
+ el.max = 200;
+ el.value = 200;
+
+ await elementUpdated(el);
+
+ expect(el.value).to.equal(200);
+
+ el.value = 500;
+ el.min = 0;
+ el.max = 500;
+
+ await elementUpdated(el);
+
+ expect(el.value).to.equal(500);
+
+ el.value = -100;
+ el.min = -100;
+ el.max = 500;
+
+ await elementUpdated(el);
+
+ expect(el.value).to.equal(-100);
+ });
});