<textarea> resets caret position in MS Edge

[fsoikin]

Issue: In Microsoft Edge, a <textarea> element whose content is bound to model in some way doesn't keep caret position between model updates.

Works fine in Chrome and FireFox. I can't be sure that the issue is with Fable.Arch and not with VirtualDom or with MS Edge. But since both VirtualDom and Edge are widely used, I think I can reasonable expect bugs like this to get fixed quickly.

App code:

open Fable.Core.JsInterop
open Fable.Arch
open Fable.Arch.Html
open Fable.Arch.App

let initModel = ""

let view model =
    div []
        [ textarea [onKeyup (fun e -> unbox<string> e?target?value)] [text model]
          span [] [text model] ]

let update model msg = msg, []

createApp initModel view update Virtualdom.createRender
|> withStartNodeSelector "#root"
|> start
|> ignore

Behavior in Chrome: (normal)

Behavior in MS Edge: (buggy)

[MangelMaxime]

Hello @fsoikin , the behavior your are experimenting is due to Edge when you set the textContent value Edge reset your cursor position.

By using the property value the update is working as expected.

open Fable.Core.JsInterop
open Fable.Arch
open Fable.Arch.Html
open Fable.Arch.App

let initModel = ""

let view model =
    div []
        [ textarea [onKeyup (fun e -> unbox<string> e?target?value)
          property "value" model
        ] []
          span [] [text model] ]

let update model msg = msg, []

createApp initModel view update Virtualdom.createRender
|> withStartNodeSelector "#root"
|> start
|> ignore

[fsoikin]

Using property "value" instead of content does help the "resetting caret" behavior, but now the whole app kinda "skips" keystrokes sometimes - i.e. some keystrokes just don't get reflected either in the <textarea> or in the <span>, as if they never happened (if this description is not clear I can probably produce another animated gif for you).

What's worse, this keystroke skipping happens in Chrome, FireFox, and Edge (haven't checked any other browsers).

My intuition tells me that this looks like some race condition somewhere, but I haven't debugged.

[MangelMaxime]

I will need to take a dipper look so. Sorry for the inconvenience