Fork me on GitHub
#clojurescript
<
2018-07-12
>
idiomancy00:07:51

I want to pretty print a data structure into a div on my screen so I can check some values I'm playing with in figwheel. The problem is the linebreaks and spacing isn't being preserved.

bhauman00:07:33

use a <pre></pre>

manutter5100:07:51

If pre doesn't work try textarea

manutter5100:07:19

Oh wait, nvm, textarea is the trick for displaying text in a block you can Select All with and not get the entire page... carry on...

idiomancy00:07:40

that's a good trick to remember though

manutter5100:07:35

Yeah, it was real useful in an Electron app I built to generate a weekly email report I had to send in. Just select-all, copy, paste into email, send.

idiomancy00:07:18

nice. I think I'm going to start putting that to work immediately

dpsutton00:07:55

also use :projection in the card

idiomancy00:07:03

[:pre (-> nested-data-structure
              cljs.pprint/pprint
              with-out-str)]

idiomancy00:07:07

something like that?

manutter5100:07:31

Might help to set a monospaced font style too

idiomancy00:07:49

oh damn, that just worked immediately! That's great!

idiomancy00:07:19

thanks, guys!

dpsutton00:07:03

oh i was thinking devcards. my bad 🙂

idiomancy00:07:53

what's the deal with devcards?

idiomancy00:07:23

oh, its a repo. interesting!

dpsutton00:07:21

devcards are amazing!

dpsutton00:07:43

interactive ui developing. keeps your code clean.

clojer01:07:02

As newer versions of Ecmascript become widely adopted what are the implications for Clojurescript, particularly with JS library interop?

clojer01:07:27

If a JS lib is written in ES6 and makes heavy use of generator functions will it be usable from Clojurescript?

john03:07:51

@U0CLQ83LZ It's a bit speculative, but as Google's Closure compiler matures, we'll probably pick up some capabilities automatically. Some newer JS idioms around generators may never be brought into core - some might be. I doubt you'll see cljs.core chasing the latest JS features. Like, if some lib requires that you yield on something, I'm not sure if CLJS will ever integrate JS's async functions directly, so interop with that lib might be non-trivial. But if it's something you really need, you can always use the js* escape hatch. And if Closure eventually supports it, somebody could make a lib for it.

clojer23:07:20

So Clojurescript is basically bound to Google Closure’s capabilities? Do you think that’s healthy in the log run?

john23:07:11

There are clojure-like lisps that run on javascript that aren't tied to GoogClosure. If really didn't like Closure, I might consider using one of those. But since the compiler does such of a good job eliminating dead code, what we don't use doesn't really get in the way...

john23:07:52

As far as health of GoogClosure in the long run, I guess we could fork it if that ever became a problem. It's used pretty heavily inside google though, last I heard.

john23:07:28

and again, GoogClosure doesn't necessarily prevent us from leveraging newer JS features. You just have to call out directly, perhaps using js*. The issue with introducing a new "async-fn" type in CLJS is that it'd probably seem like a significant divergence from Clojure-proper semantics

john23:07:09

It would be preferable to wrap those newer functionalities in more clojure-like idioms, if possible. Otherwise, it'll probably just be left to library authors to wrap newer js features up in interesting libraries.

fabrao03:07:50

Hello all, is there any problem to use dash export name for clojurescript?

fabrao03:07:56

I made a lib from cljsjs process that has the name antd-mobile, I imported it to my project, I´m seeing it in js/window but when I try to use it, it says that Uncaught ReferenceError: antd_mobile is not defined

fabrao03:07:32

what´s wrong?

fabrao04:07:12

(aget js/window "antd-mobile")?

thheller05:07:57

@fabrao antd-mobile is not a valid JS variable name since it treats - as "minus" (ie. antd - mobile). The CLJS compiler by convention converts all dashes to underscores so you'd be much better off just created antd_mobile in your cljsjs package.

pesterhazy07:07:59

The aget call should work though

thheller07:07:58

but js/window is not an array so if anything you should be using (goog.object/get js/window "antd-mobile")

smnplk10:07:58

@thheller Arrays in js are objects. Is there a special reason not to use either when accessing arrays/objects, apart from semantics ?

billyr14:07:04

Is there a resonable (repl-able) way to use cljs in an existing nodejs project? That is, the cljs part would be just a "module".

gleisonsilva14:07:46

Hello guys! Can you help-me? I'm not succeding at changing a value inside an atom.. Given this atom:

(def app-state (r/atom {:available {"Default" [["/a/foo/path/" 1]]}
                        :selected "Default"}))
I'm trying to change the string "/a/foo/path" using swap! and update-in, but I could find the right way...

john14:07:47

did you try this for your vector? [:available "Default" 0 0]

gleisonsilva14:07:49

yes.. i did, but I got this error: "TypeError: f.call is not a funciton

gleisonsilva14:07:17

(swap! app-state update-in [:available "Default" 0 0] "/a/new/path")

john14:07:33

ah, you have to pass in a function, rather than the new path

john14:07:38

The function takes the old path

john14:07:12

if you just want to replace it you can pass in (constantly "/a/new/path") or #(do "/a/new/path")

jjttjj14:07:28

@gleisonsilva depending on what you're doing, assoc-in is probably just what you want

(swap! app-state assoc-in [:available "Default" 0 0] "/a/new/path")

👍 8
lilactown20:07:22

how do people feel about using macros to do side effects, e.g. load files, make network requests, at compile time?

dnolen20:07:08

generally not a good idea - but it can be useful

lilactown20:07:21

I'm thinking about things like loading a .edn file into .cljs file, or validating a query against a schema

lilactown20:07:26

neat. I think I might do something like that for our graphql queries 🙂

hlolli20:07:27

I'm takeing the dust off re-frame after a long time, but this is more of an async/await question. Which I probably need when useing fetch like this

(rf/reg-event-db
 :home-fetch-slides
 (fn [db _]
   (let [res (-> (js/fetch (str ENDPOINT "/home") #js {:method "POST"})
                 (.then (fn [resp] (.json resp)))
                 (.then (fn [json] (parse-transit json))))]
     db)))
I'd need res to be a value, to evenutally merge it into db. Was there any support for async/await yet? Or am I missing some alternative solution when handling promises like that.

dnolen20:07:33

no support for async/await and none planned - coverting a promise into a channel is a couple of lines at most

lilactown20:07:44

@hlolli for re-frame specifically I think you want to look into effects

hlolli20:07:58

I guess the whole callback needs to be under a go macro then? I can try, but I feel like the return value will end up being core.async data.

manutter5120:07:13

I don’t use callbacks in re-frame

lilactown20:07:18

async/await is not really relevant to this situation. the problem is that reg-event-db expects a synchronous value

lilactown20:07:37

the new db value

manutter5120:07:46

One effect handler dispatches the async call, and when the request comes back it just fires another event

hlolli20:07:51

yes, I know of http-fx. I've been in typescript last 6 months, and the fetch workflow somehow got trained into me.

dnolen21:07:19

if that’s true about re-frame then I would probably assume this is fighting the API

manutter5121:07:37

really? how so?

hlolli21:07:51

I like core.async, so I'll give it a try, maybe I'm overthinking and it will work fine.

dnolen21:07:55

the problem is that 'reg-event-db' expects a synchronous value

👍 4
dnolen21:07:15

is what I was referring to

dnolen21:07:27

but I don’t know - I’m just assuming I don’t use re-frame

hlolli21:07:09

and this is also the way redux-thunk works, really good ideas there that cljs could borrow from.

manutter5121:07:29

Yeah, I wouldn’t call that a problem per-se, the http-fx library handles the callback stuff by dispatching an event

manutter5121:07:10

so maybe from reg-event-db’s perspective it’s getting a synchronous event, but the event itself was dispatched when the ajax call returned

dnolen21:07:13

like I said I don’t know much about these libs - but putting an async call inside the state stuff like that seems code-smelly to me

☝️ 4
lilactown21:07:41

@hlolli using core.async or async/await is neither here nor there - you won't be able to use it with reg-event-db. you'll need to use effects, and at that point you're recreating http-fx

dnolen21:07:32

push the async stuff to the edge and life will almost always be better

manutter5121:07:23

I don’t think it’s inside the state stuff — the effect dispatches the client -> server request, and then it’s done (as far as effect handling is concerned). There’s a mechanism under the hood that dispatches a new event when the response comes back, and the event handler does the actual state update.

hlolli21:07:14

@lilactown yes, I like experimenting. I guess I'll end up useing that. But the "not so good" about it, is that it's kinda anti-flow having cljs-ajax, XmlHttpRequest goog/ or js/ kind, and all sorts of http request interfaces. I feel like fetch is going to take over the js world, and it's pretty simple to use.

manutter5121:07:52

anyway, gotta run, which sux because I’m just getting interested in this convo

lilactown21:07:39

you can probably recreate it with fetch then ¯\(ツ)

hlolli21:07:20

yes! haha, I would like to see re-frame-thunk middleware somewhere a la https://github.com/reduxjs/redux-thunk

dnolen21:07:30

I tend to agree - it’s not really giving you anything over higher level libs esp. those that manage JSON or Transit for you

lilactown21:07:03

I think that thunks and re-frame effects are pretty similar

lilactown21:07:37

the difference is that thunks are written imperatively, with callbacks, whereas effects are written declaratively with data

hlolli21:07:36

yup, spot on, need to get coffee. Thunks are side-effect based, providing dispatch as callback parameter. And that can get smelly.

Garrett Hopper22:07:11

@gleisonsilva If you're using constantly or the #(do $result), assoc-in is probably what you're looking for.

Garrett Hopper22:07:43

Whoops. I just got connection back. Disregard. 🙂