Fork me on GitHub
David Pham06:10:51

@ghaskins Does the text input component works in v5, or did the old v4 trick work? I want to make the migration as well, any hint would be welcomed!

Ben Halton10:10:52

It doesn't work, and the old trick does not work, if by work you mean allows you to edit text without cursor jumping

Ben Halton10:10:41

I ended up crafting my own solution which seems to hang together

David Pham12:10:48

Can you share your solution? :)

Ben Halton16:11:11

hi @neo2551 @ghaskins sorry I haven't been around much in the last week or so have extracted a very rough cut of what I have below

Ben Halton16:11:15

(defn controlled-text-field []
  (let [cursor-position (atom nil)]
     {:component-did-update (fn [this]
                              (let [dom-node (rdom/dom-node this)
                                    input (aget (.getElementsByTagName dom-node "input") 0)]
                                (.setSelectionRange input @cursor-position @cursor-position)))
      (fn []
        [:> TextField
         {:label "controlled text field"
          :type "text"
          :fullWidth true
          :size "small"
           @(re-frame/subscribe [::subs/my-sub])
          (fn [event]
            (reset! cursor-position (-> event .-target .-selectionStart))
             [::events/update-value (-> event .-target .-value)])

Ben Halton16:11:37

it seems to hang together

Ben Halton16:11:53

but I make no real claims for reliability !


Hey, I'm in the midst of migrating a cljs project to shadow-cljs. Everything is working fine, except that I am not able to run tests. The docs suggest that it is enough to add test namespaces with -test prefix but the following configuration does not seem to work when running npx shadow-cljs compile test . The build completes without errors but zero tests are run. Do I need to setup a custom test runner for this?


[cljs.test :refer :all] is not valid in CLJS so I suppose your compilation fails?


otherwise should be fine


[:test] Compiling ...
------ ERROR -------------------------------------------------------------------
 File: /mnt/c/Users/thheller/code/tmp/cljs-test/test/cljs/cljs_test/some_test.cljs:1:1

   1 | (ns cljs-test.some-test
Invalid namespace declaration
-- Syntax error -------------------

  (... ... (:require [cljs.test :refer :all]))

has extra input

-- Relevant specs -------
   (clojure.spec.alpha/? clojure.core/string?)
   (clojure.spec.alpha/? clojure.core/map?)

Detected 1 error

   2 |   (:require [cljs.test :refer :all]))
   3 |
   4 | (deftest some-test
   5 |   (testing "that it is true"



this is what I get


Oh yeah, right, that was actually a change I made in the middle of debugging. The original require was [cljs.test :refer-macros [deftest is testing]] but changing that to [cljs.test :refer [deftest is testing]] fixed the issue, thanks for the help!


@neo2551 I havent tried beyond my simple login form, so far. That form in particular uses React setState for state management, and it seems that the textfields do work fine at least there. I havent tried my larger app that has r/atom based controlled inputs.


@gingerwizard id be interested in learning about your solution, if you are willing to share

Ben Halton12:10:26

happy to, it's something I worked on a bit and seemed OK, but I've been away on holiday and just back so not tested thoroughly. AFK right now but will get a snippet together later