Chrome Update 57 or 58

[Chad Bozeman]

I have a number field data bound to a computed function. As that field value changes, the calculation updates and the output works like a champ. However in Chrome 57 or 58 the up/down arrows on number fields suddenly stopped working. It still works but the computed observables don't update until I move the mouse.off of the up/down arrow.

Anyone else experiencing this? I can't seem to find a workaround.

[Michael Best]

sample code?

[Chad Bozeman]

Let me apologize in advance for this Fiddle. This is built in MVC and the mappings are so numerous that I've tried to water it down to a workable example. I have no idea how to make Fiddle work with the way we execute our scripts so I'm having trouble getting a Fiddle to even work correctly. But this will at least show you the code even though I've missed something somewhere in setting up the Fiddle. We're using KO 3.4.2 and jQuery 3.2.1.

https://jsfiddle.net/j0Lvab30/

[Chad Bozeman]

Actually I just took KO's Hello World example and modified it to do the same thing. They're not using a computed function, but the result is the same. Using the arrow keys on Chrome does not update the bindings until the mouse moves off of the arrow.

http://jsfiddle.net/LkqTU/37881/

[Andrew Vickers]

Chrome is weird about the events it triggers in this case.  Using the 'event' binding will resolve this, but make the html ugly.

<p>Last name: <input type='number' data-bind='value: lastName, event: { input: doInput }' /></p>

ViewModel =
...

this.lastName = ko.observable(last);

    

this.doInput = function(o,e) {

      this.lastName(e.srcElement.value);

    }

Cheers

[Michael Best]

The proper way to handle the input event is valueUpdate:

value: lastName, valueUpdate: "input"

You can also use the textInput binding.

But this seems like a bug in Chrome.