Fork me on GitHub
#hoplon
<
2016-04-27
>
flyboarder01:04:02

Hello everyone, i have a thing for you all to play with

flyboarder01:04:00

@onetom: i think you may find this useful

thedavidmeister12:04:46

@micha: hey, did you manage to make any progress on https://github.com/hoplon/hoplon/pull/129?

dm312:04:36

@thedavidmeister: I think that happens because when loop-tpl recalculates the DOM elements it needs to show, the do! :value on the element that is unchanged never gets triggered. The new value of the input is in the mutable DOM state, not in any other cell

dm312:04:52

I'm not exactly sure why the value of the element that gets removed is changed back

dm312:04:00

my guess it's somehow related to the fact that it's removed from DOM

thedavidmeister12:04:39

@dm3 it’s weird that the behaviour is different based on whether the value as a string is the same or different

thedavidmeister12:04:54

@dm3: i would have expected that different cell = trigger do!

thedavidmeister12:04:02

like, using identical? or something

dm312:04:16

well, it does trigger on the element which is added back to DOM

thedavidmeister12:04:57

what do you mean “added back”?

dm313:04:53

when the cell that loop-tpl operates on changes

dm313:04:07

it looks at the difference in the number of elements previously and after the change

dm313:04:18

if the number increased - it creates more elements and adds the to the DOM

dm313:04:29

if decreased - removes elements from DOM and puts them onto the waiting list

dm313:04:57

when an element is removed from DOM (e.g. in your example when state-2 is triggered)

dm313:04:11

the cell that pointed to the second input will get updated with value nil

dm313:04:22

so the update propagates to the second input (that got removed)

dm313:04:37

then when you click state-1 again - the cell updates with value "a"

dm313:04:52

the first input never gets updated

dm313:04:02

actually, this is not related to loop-tpl or DOM at all simple_smile

dm313:04:15

that's just how the values propagate between cells in Javelin

dm313:04:03

it seems that you can't just let user update the input without actually propagating these changes into some cells

dm313:04:22

as then DOM state and your cells get out of sync

thedavidmeister13:04:43

did i not do that in my example?

dm313:04:09

in the example input doesn't update anything

thedavidmeister13:04:38

+    (div
 +      :id "input-list"
 +      (let [values (cell {})
 +            values+final (cell= (into values {:new nil}))
 +            on-input! (fn [id v] (reset! values (->>
 +                                                  ; Update values.
 +                                                  (merge @values {id v})
 +                                                  ; Filter empty strings.
 +                                                  (remove #(let [[_ v] %] (= "" v)))
 +                                                  ; Ensure we have a map.
 +                                                  (into {}))))]
 +        (loop-tpl :bindings [[k v] values+final]
 +          (let [id (cell= (if (= :new k) (gensym) k))]
 +            (input
 +              :value v
 +              :id id
 +              :input #(on-input! @id @%))))))

thedavidmeister13:04:45

what would i change here?

thedavidmeister13:04:00

i thought :input is changing values

dm313:04:04

I was using the one you had in the comments

thedavidmeister13:04:13

ah, i added two examples

thedavidmeister13:04:31

with a set of tests for each

thedavidmeister13:04:37

+(defn- add-remove-inputs!
 +  [t]
 +  (let [inputs #(elements "#input-list input")
 +        nth-input #(nth (inputs) %)
 +        [one two three] t]
 +    (send-keys (nth-input 0) one)
 +    (send-keys (nth-input 1) two)
 +    (send-keys (nth-input 2) three)
 +    (is (= 4 (count (inputs))))
 +    (send-keys (nth-input 0) "\b")
 +    (is (= 3 (count (inputs))))
 +    (is (= two (value (nth-input 0))))
 +    (is (= three (value (nth-input 1))))
 +    (is (= "" (value (nth-input 2))))))

thedavidmeister13:04:33

so, i gave an example which represents what is actually tripping me up in my project

thedavidmeister13:04:42

but simplified a bunch

thedavidmeister13:04:17

and then a separate example showing that simply toggling between two states after the user inputs something is enough to show the same behaviour

dm313:04:30

yeah, this is more interesting

thedavidmeister13:04:21

+(deftest add-remove-inputs-diff
 +  (add-remove-inputs! ["a" "b" "c"]))
 +
 +(deftest add-remove-inputs-same
 +  (add-remove-inputs! (let [t "a"] [t t t])))

thedavidmeister13:04:36

the diff example passes, but same fails

thedavidmeister13:04:52

that’s the main thing that convinced me this is probably a bug somewhere

dm313:04:30

it's interesting

dm313:04:54

how the value propagation fails because it compares identical values

thedavidmeister14:04:48

yeah, but the cells are different cells

thedavidmeister14:04:33

so my only guess is that “somewhere” two different cells with the same value are treated as identical

thedavidmeister14:04:42

so like… = vs identical?

dm314:04:08

can't say I really understand why this happens yet

thedavidmeister14:04:04

mhmm, i need a hand figuring it out

flyboarder21:04:08

@micha: Im running into the issue again where hoplon task does not see checkout files

flyboarder21:04:42

nope my bad hl lib was adding files are source not resource