search

TheComputerM / svelte-materialify

A Material UI Design Component library for Svelte heavily inspired by vuetify.
https://svelte-materialify.vercel.app
MIT License
622 stars 83 forks source link

Changing both Slider's value and max attributes causes improper update. #226

Closed jggrant closed 3 years ago

jggrant commented 3 years ago

If an update results in changing the Slider component's value and max attributes simultaneously, the new value will not be properly updated.

This seems caused by the reactive call to slider.updateOptions(...) in the Slider component, which causes the new value to be overwritten by the previous one in slider.on('update', ...).

A quick hack to confirm it is done by adding let newValue = value; before the updateOptions call, and add if (newValue !== localValue) slider.set(newValue, false); after the call, which makes the issue go away. However I did not spend more time yet understanding the inner workings, so this might not be the proper way to fix it.

Here is the REPL reproducing this issue: https://svelte.dev/repl/290f909a3f30472db4c9a0e84560169a After clicking the button, the thumb should be located at 0, however it remains at its original value of 10.

Thanks!

Florian-Schoenherr commented 3 years ago

Your exact snippet works with this PR and I added the other options to the reactive update as well. The afterUpdate isn't needed any longer.