input bound value leads to cursor jumping on every keystroke

elm / virtual-dom

The foundation of HTML and SVG in Elm.

https://package.elm-lang.org/packages/elm/virtual-dom/latest

BSD 3-Clause "New" or "Revised" License

209 stars 80 forks source link

input bound value leads to cursor jumping on every keystroke #138

Closed littleStudent closed 5 years ago

littleStudent commented 6 years ago

I have a bound input element. So the state property storing the value is bound back to the dom element. On every keystroke this leads to the cursor jumping to the end of the input.

SSCCCE: https://ellie-app.com/3dWX47DKWwPa1 Browser: Safari (macOS & iOS confirmed)

input-cursor-jumping

module Main exposing (main)

import Browser
import Html exposing (Html, input)
import Html.Attributes exposing (value)
import Html.Events exposing (onInput)

type Msg
    = OnInput String

main : Program () String Msg
main =
    Browser.sandbox
        { init = ""
        , view = \str -> input [ onInput OnInput, value str ] []
        , update = \(OnInput str) _ -> str
        }