Fork me on GitHub
#clojurescript
<
2020-03-26
>
hkrishnan200504:03:53

react-datepicker - I am trying to use this component in my cljs with reagent. Could someone give me some hit regarding how to use it: Here is the code I have . I see the picker, but when I select the date, the input is not getting populated with the value. I am sure I am missing something..

(let [control-value  (reagent/atom {})]
[:> DatePicker {
                :selected   (:start-date control-value)
                :on-change #(doall
                              (println (str "xxxxxxxx->" %))
                              (reset! control-value  {:start-date %})
                              )
                }])

This is the react code from the React Datepicker site:
() => {
  const [startDate, setStartDate] = useState(new Date());
  return (
    <DatePicker 
selected={startDate} 
onChange={date => setStartDate(date)} />
  );
};

Any hint is much appreciated.  Thanks>

souenzzo11:03:03

use do doall is trying to realize a list that do not exists and throwing

hkrishnan200517:03:42

Thank you. There is no error now. I can see the date value too on the log. But it is not getting populated on the editbox. Moreover, I see the following warning: Reactive deref not supported in lazy seq, it should be wrapped in doall:

tatut08:03:46

ran into a weird advanced compilation problem, a multimethod name is mangled as XR and it doesn't work in chrome but works in other browsers

tatut08:03:20

chrome has an XR name in the global scope (some augmented reality stuff, it seems) so the

"undefined" === typeof XR
works differently

tatut08:03:05

is there a way to blacklist names?

p-himik08:03:21

Do you use the latest CLJS version? IIRC that particular name was added to the name of exceptions in GCC somewhat recently.

p-himik08:03:58

Even if CLJS by itself didn't upgrade GCC to the required version. I think shadow-cljs has the fix (because it uses a newer GCC version).

tatut08:03:17

I'll try that, thanks

tatut08:03:19

the new version

tatut08:03:42

otherwise I think I can add an extern that lies about having an XR so no names will be munged to have that

olivergeorge08:03:56

Maybe this compiler option will help... :output-wrapper Wrap the Javascript output to avoid clobbering globals. There are four possible value types....

tatut08:03:33

I don't think wrapping helps this case as globals are visible inside the function wrapper

p-himik08:03:47

You're not using shadow-cljs, right?

tatut08:03:17

figwheel-main

tatut08:03:35

but I guess the function wrapper could delete XR in the beginning and it would work

tatut08:03:45

the extern lie seems to work as well

tatut08:03:53

just have var XR = {}; externs js file

p-himik08:03:31

Yeah, XR was added to the GCC list of reserved vars 11 months ago.

tatut09:03:27

still scary that things are added to global scope that break... I'm guessing there are closure apps (and others) that haven't been updated in 11 months

p-himik09:03:32

Yep, the browser world is "fun".

roman01la14:03:31

you can use window.XR I think, unless that XR multimethod is available globally as well

roman01la14:03:43

btw, it's not the first time I see this issue posted here

roman01la14:03:10

window.XR + output wrapper should help

tatut16:03:38

the script failed to load in chrome, because it checks if XR is undefined and it is not in chrome

tatut16:03:47

then it tried to call a method on XR which doesn't exist

borkdude13:03:27

We have a webapp which uses SSE. Sometimes people open up multiple instances of the app in various tabs which often fails the SSE connection to malfunction (because of too many concurrent requests to the same server from the browser). I'm looking into a way how to get one shared SSE connection for multiple tabs. It looks like there is something called SharedWebworker, but this is already deprecated in Webkit. Any other ideas/solutions?

thheller13:03:09

just use normal websockets? don't think they run into the connection limits?

borkdude13:03:18

I guess so. It was nice that we got SSE basically for free in yada, websockets was a bit more painful

dominicm14:03:16

SSE is also better in the client with things like last event id and automatic reconnection. Be aware you'll need to do those yourself.

borkdude15:03:30

thanks for the heads up

ben.hammond22:03:17

I would like to poke some (.log js/console into someone else's function. I seem to remember that I can do something like • take a def of the current function in its current namespace • create new defn which does what I want, in my namespace • call (set! 'old-ns/old-fn new-debugging-fn) but I get the err

34 | (set! 'xf/dispatch dispatch-dec)
-------^------------------------------------------------------------------------
Error in phase :compilation
set! target must be a field or a symbol naming a var
what am I doing wrong here?

ben.hammond22:03:25

oh I think

(set! xf/dispatch dispatch-dec)
is working:face_palm:

bfabry22:03:55

I thought set! was just for thread local vars

bfabry22:03:03

alter-var-root works

ser=> (alter-var-root #'concat (fn [orig] (fn [& args] (prn "hi") (apply orig args))))
#object[user$eval158$fn__159$fn__160 0xc3177d5 "[email protected]"]
user=> (concat [1] [2])
"hi"
(1 2)

ben.hammond23:03:51

set! did work for me though

tkjone16:03:14

So this is really cool.

bfabry16:03:30

it can be very helpful, I'd recommend you only alter the root for debug purposes though

tkjone16:03:42

Great tool to have in the debugging tool kit