Textarea loses caret position on render

[julianjelfs]

Hi, I have a problem with a databound textarea. If I edit text in the middle of the string the cursor will immediately leap to the end. Note that this does not happen if I just use a regular reagent atom to manage the state so I am assuming that it is something that re-frame is doing.

For example the following does not exhibit the problem:

(defn test-text2 []
  (let [text (atom {:text ""})]
    (fn []
      [:div 
       [:div (:text @text)]
      [:textarea {:id "test-text" 
                  :rows 10
                  :value (:text @text)
                  :key "test-text"
                  :on-change #(swap! text assoc :text (.. % -target -value))}]])))

But this code does:

(defn test-text3 []
  (let [text (subscribe [:test])]
    (fn []
      [:div 
       [:div @text]
       [:textarea {:id "test-text" 
                   :rows 10
                   :value @text
                   :key "test-text"
                   :on-change #(dispatch [:test (.. % -target -value)])}]])))

In this case the :test subscription and handler are just roundtriping a simple value to the re-frame state.

Is there something I am doing wrong here? Is this expected behaviour? It's really causing me a problem because I'm having to resort to all sorts of horrible hacks to get round it (and still not really satisfactory). If I could get the second example to work like the first it would be great.

Hope you can help because everything else about re-frame seems fantastic.

Thanks.

[whodidthis]

Try using re-frame.core/dispatch-sync

[julianjelfs]

Fantastic! So simple. Works perfectly. Thank you.

[whodidthis]

Reagent's :default-value instead of :value is another option that could work in your case. With that the input field wouldn't need to be updated.

[mike-thompson-day8]

See also: #39 (comment)

[julianjelfs]

Yes I saw the other thread just after I opened the issue - should have looked more carefully! Thanks for your help all. Really appreciate it.