Fork me on GitHub
#re-frame
<
2022-10-12
>
Hankstenberg09:10:02

Hi everybody, I'm currently writing a re-frame app following https://github.com/danownsthisspace/re-frame-form-example/blob/master/src/animal_form/events.cljs tutorial and I have a problem I just can't wrap my head around. I have an on-change event handler on an input field and even though the event is fired, there is a problem in the event handler: (re-frame/reg-event-db ::update-form (fn [db [_ id val]] (assoc-in db [:form id] val)) After loading the page, the first on-change event somehow triggers initialize-db (something I actually already do in the init function) (defn ^:export init [] (re-frame/dispatch-sync [::events/initialize-db] ... Initialize-db is executed on load, but for some reason it shows under fx/coeffects in 10x after the first on-change-event. This does not happen in the tutorial app. The new value input value is then associated with whatever "db" points at in the handler, but the actual db is not updated. After that, all subsequent value changes are always "one off". The state in the db is always one keystroke behind the actual value. The same code works in the tutorial for me. I went through all involved files, but I can't find anything that would explain this issue. Does anybody have an idea?

1
p-himik09:10:00

How do you check the state of your app-db?

Hankstenberg09:10:12

I'm using 10x. Also updated the description a bit.

p-himik09:10:34

So your code is different from the tutorial, it's just that you think that none of those differences should affect the behavior? If so, are the dependencies' versions also different?

Hankstenberg09:10:44

Yes, my deps have a slightly higher version..

Hankstenberg10:10:39

Ooh.. that actually sounds like an explanation! So it would be the debug library causing the issue? However I just rolled back re-frame 10x to 1.0.2 and cleared all build files and the issue still persists.

Hankstenberg10:10:00

It's also not "just" a 10x issue, if I log the current state of the DB to the console, it's also 1 off.

p-himik10:10:03

No clue, impossible to tell without having an MRE.

Hankstenberg10:10:51

Thanks anyway 🙂

p-himik10:10:25

If you can't figure it out, create a publicly available MRE and I'll take a look.

👍 1
Hankstenberg10:10:34

It seems to be related to the fact that the component together with it's two-way binding (on-change-event and subscription for the value) is called from a parametrized function in another namespace.. if I replace the function call with its return value it works.

p-himik10:10:30

No clue what you mean. :)

Hankstenberg10:10:40

In my markup I'm calling a function for rendering text items like this: (comp/item-text {:label (s/get-label s/schema-user :name)} :name) the function is in another namespace and looks like this: (defn item-text [props id] (let [value (re-frame/subscribe [::subs/form id])] [:div.field {:key id} [:label.label (-> props :label)] [:div.control [:input.input {:value @value :type "text" :placeholder "Text input" :on-change #(re-frame/dispatch [::events/update-form id (-> % .-target .-value)])}]]]) If I replace the function call with the functions' body it works.

Hankstenberg10:10:33

Ah.. wasn't there something something about lazy evaluation...?

p-himik10:10:48

There was but doesn't look like it's the case here. And what you describe is really weird.

Hankstenberg10:10:14

It works now and I'm not quite sure why... Anyway thanks for your time! 🙂

👍 1