Unable to modify slider input field when "listen" is called

[Carpetfizz]

Consider the following section of code

const gui = new dat.GUI();
const params = {
	x: 0
}
gui.add(params, 'x', -1, 1, 0.1).listen();

As expected, I am able to change the value of x by manipulating the slider. However, when I try to enter some text into the box next to the slider, I am unable to type anything.

However, if listen is removed, I am able to use both the slider and the custom input field. Obviously, I lose the ability to bind changes to params.x to the slider since .listen() is not being called.

Is this expected behavior, or is it a bug? If it is expected behavior, how do I achieve a two-way binding between my params data model and the corresponding GUI control while maintaining the ability to enter a value in the text field?

JSFiddle for convenience.

Thank you for reading.

[awelles]

The bug is in NumberControllerBox, as a simple NumberControllerBox by itself shows this behavior when .listen() is activated.

JSFiddle

Possible fix:
Suspend updateDisplay() temporarily onfocus, then unsuspend onblur.
See 8bada94

[MichaelPaulukonis]

^ THIS!!!