ManuelDeLeon / viewmodel

MVVM for Meteor
https://viewmodel.org
MIT License
205 stars 23 forks source link

Throttle prevents clearing values #262

Closed arggh closed 8 years ago

arggh commented 8 years ago

If I have an input that's being throttled and try to clear it after typing, the last value is brought back after clearing.

Reproduction: https://github.com/arggh/vm-throttle-input

I thought this type of issue was recently fixed, but I'm on manuel:viewmodel@4.1.7

arggh commented 8 years ago

I tried this again with Meteor 1.4.1.1 and ViewModel 6.0.0, issue is still valid based on the reproduction linked above.

ManuelDeLeon commented 8 years ago

This one is weird, the input's change event seems to trigger when you click the button (before the click event happens). I'm looking into it.

ManuelDeLeon commented 8 years ago

Pick up 6.1.1, it will mask the problem. Here's what was happening: you typed on the input, the focus stayed on the input, when you went to click the button the input lost focus and the change event happened, that change event would delay setting the value of the input, the click would clear the input, then the delayed update would kick in.

I say it masks the problem because you can still run into it if your delay is high enough. You can update the input, which delays the update, then click a button to reset the property, and later on the delayed update would kick in.

As far as I know you can't get around it. You're telling it "set the value to X in 1 sec" then immediately "set the value to Y now". It will set the value to Y (reset the prop) and in one sec set it to X (whatever you typed).

arggh commented 8 years ago

Fixed the problem everywhere in my app, thanks for looking into it 👍

arggh commented 8 years ago

@ManuelDeLeon A heads up: this seems to have changed something else too. Dropdowns created with Semantic-UI (which I know there's many in the docs) no longer work as before. Changed values don't get picked up by ViewModel.

Template:

<select {{b "ref: selectEl, value: x"}} class="ui selection dropdown">
     {{#each options}}
         <option value="{{this}}">{{this}}</option>
     {{/each}}
</select>

ViewModel:

x: null,
onRendered() {
   this.selectEl.dropdown();
}

If you omit the .dropdown() call, it will work as usual.

ManuelDeLeon commented 8 years ago

Fixed. select elements now use the change event again.

arggh commented 8 years ago

@ManuelDeLeon Semantic-UI dropdowns, as instructed in their docs, are still broken. I created an issue with a reproduction here: https://github.com/ManuelDeLeon/viewmodel/issues/276