Character duplication bug on iOS devices in Elm 0.19

[jmbockhorst]

I found a bug of characters duplicating on iOS devices when using Input.Extra.text. I did a good amount of exploration into the issue and here are my findings.

Using both onInput and onKeyDown events is what's causing the problem, and it seems like this isn't a good thing to do in general.

On most devices, here is what happens in the elm code:

keydown event fired
requestAnimationFrame(drawCallback)
input event fired with "a" (before the browser renders a frame, so nothing drawn yet)
stopPropagation is false - draw immediately
input.value = "a"

On iOS devices, requestAnimationFrame happens a lot faster, so it draws twice:

keydown event fired
requestAnimationFrame(drawCallback)
drawing
input.value = "a"

input event fired with the "aa" (this is the problem here, but no idea why it appends an extra "a")
stopPropagation is false - draw immediately
input.value = "aa"

I was able to reproduce this outside of this package using a simple input with both onInput and onKeyDown. If the onKeyDown event prevented default on valid input, then it would work, but I'm not sure the other reasoning behind that decision.

I also just realized that this problem was introduced with Elm 0.19 (the live demo is still 0.18), so we may to need to open an issue at https://github.com/elm/browser/issues.

@abadi199