This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2018-04-03
Channels
- # aws (5)
- # beginners (67)
- # boot (30)
- # cider (55)
- # clara (7)
- # cljs-dev (6)
- # cljsjs (6)
- # cljsrn (1)
- # clojure (136)
- # clojure-brasil (2)
- # clojure-dusseldorf (14)
- # clojure-finland (9)
- # clojure-italy (49)
- # clojure-nl (1)
- # clojure-romania (6)
- # clojure-russia (4)
- # clojure-uk (16)
- # clojurescript (136)
- # core-async (1)
- # cursive (21)
- # datomic (64)
- # fulcro (26)
- # hoplon (25)
- # jobs-discuss (53)
- # keechma (3)
- # leiningen (6)
- # luminus (11)
- # lumo (2)
- # off-topic (351)
- # om (1)
- # onyx (11)
- # parinfer (32)
- # portkey (9)
- # re-frame (45)
- # reagent (38)
- # shadow-cljs (60)
- # specter (9)
- # vim (8)
- # yada (22)
It’s not recommended to pass a ratom as an argument down to another component, right?
I pass app-state ratom as first argument to most all of my components (when using vanilla reagent)
nothing wrong with passing around ratoms
don’t atoms carry functions (add-watch callbacks) which cannot be compared properly?
if the ratom itself doesn't change, no rerenders
What are people using for testing reagent components? I come from a JS background, specifically Jest, and while I know that CLJS does not have a tool like Jest, I was hoping to learn how things like snapshots or enzyme are being done in CLJS
Rarely
@pesterhazy is there an understanding of why this is? Or is it just the tooling/ecosystem is just not there yet?
Probably that plus a certain vague idea that unit testing UIs is expensive and brittle (maybe even pointless), paired with a REPL culture (as opposed to testing culture)
Or just plain arrogance, or the fact that Clojurians rarely work in large teams?
@tkjone I think many who do test, test event handlers and helper functions instead of components themselves .. since those can be pure and test runs will be very fast. There is lein-doo and cljs-react-test .. also etaoin that can help with component or integration tests, but it isn't a cljs standard to test components yet
Integration testing (using selenium etc.), IMO the most useful way to test UIs, is a good albeit brittle option and doesn't require digging into React internals.
Personally, I like the clojure proper tools for testing better than clojurescript (better emacs integration etc) .. so I put all of my handlers in .cljc files and run with lein test
@pesterhazy @tkjone To piggie back on pesterhazy, then etaoin is a great choice .. like selenium, but written in clojure (and very active development)
I think JavaScript developers can sometimes go overboard when it comes to testing, but clearly the tools available in pure JS land are superior
Though this superiority is bought at the price of high tooling complexity
Hi all, I'm passing an element through a prop and I'm getting an error I don't understand (I'm using a Material-UI cljs wrapper). This is JS code I'm trying to imitate that demonstrates how the element is passed into the prop (code omitted for brevity):
js
render() {
const actions = [
<FlatButton/>,
<FlatButton/>,
];
return (
<div>
<Dialog
actions={actions}
>
The actions in this window were passed in as an array of React objects.
</Dialog>
</div>
);
}
I tried to translate this code into cljs (irrelevant code omitted, again):
clojure
(defn- new-project-dialog []
(let [actions [:div
[ui/flat-button {:label "Create"
:primary true
:on-click close-dialog}]
[ui/flat-button {:label "Cancel"
:primary false
:on-click close-dialog}]]]
[ui/dialog {:actions (r/as-element actions)}
"test 1 2 3"]))
Note that I had to add the :div
as a first element in the vector, instead of just leaving it as a two-item sequence with both of the elements being components. This produces the correct result, but I'm not exactly sure why I had to add the :div
. I think it must have something to do with how I call r/as-element
on actions
, which admittedly I have just copy pasted without understanding. Is there a more direct way of translating the JS code, or is this something that is unavoidable with reagent?@lgessler I suspect that the actions prop wants a javascript array of elements. so you probably need to run as-element on each of the FlatButtons and then put them in a js array
@lee.justin.m That did the trick--thank you. Modified code for posterity:
(js/Array.
(r/as-element [ui/flat-button])
(r/as-element [ui/flat-button]))
Or
(cljs->js [(r/as-element [ui/flat-button])
(r/as-element [ui/flat-button])])
In both cases, it may be a little less interop’y.AFAIK #js[1 2]
or (array 1 2)
is preferable to clj->js
clj->js
is meant for deeper conversions. I meant to point that out that it isn’t as good for making just a flat js array like this. #js is likely the fastest option. But good point on array
fn too.
Didn't know about the array
function, thanks @pesterhazy
There's also into-array
, which is very useful
clj->js
should be avoided when possible
Wasn't meant as a criticism 🙂
Sorry if it come off that way