Fork me on GitHub
Slack Archive

This page is not created by, affiliated with, or supported by Slack Technologies, Inc.

2022-08-31

Channels

#clojurescript
<
2022-08-31
>
mac18:08:13

Is it possible to access the source map during execution? I am trying to build a "better" tap> that automatically includes the source location. A fake js/Error. gives me a js stacktrace from which I can get the js line number of the callsite, but I want to map this back to cljs. I looked at some of the cljs.util functions, but they are java only apparently.

mac18:08:25

@thheller Ah, that's very cool. I actually wanted to use this with shadow-cljs 🙂 Would it be an idea to include this info for all entries in the Inspect tabs?

thheller18:08:39

already is. well, some of the info got lost I guess. still shows the namespace though 😛

mac19:08:08

@thheller OK, I think we are running the latest version, and I see :cljs - :app - :browser for all entries.

thheller19:08:35

well, you need to use ?>? can't change what tap> does

thheller19:08:26

I usually have a require like this [shadow.debug :refer (?> ?-> ?->>)] and just use those instead of tap>

thheller19:08:08

there is also a (shadow.debug/locals) which can be useful at times

mac19:08:25

@thheller Got, but you are right that the line number is missing.

mac19:08:09

@thheller Looks like it will render both line and col if it is there, so it must be missing somehow.

thheller19:08:54

fixed it in 2.20.1

mac19:08:57

@thheller That was quick. Thanks.

thheller19:08:13

there is also (?> the-val :some-label) which is useful if you want a quick label for a thing

mac19:08:34

That seems very useful too, thanks.

Jeongsoo Lee19:08:29

A very newbie question, but what would be an ClojureScript counterpart of the JavaScript statement const { value } = event.target; ? The record accessing and unpacking is the tricky part for me.

chrisetheridge19:08:36

(let [value (.-value (.-target event))])
{ value } is accessing the value property off the target property

Jeongsoo Lee19:08:18

@U0HJ7CX6H Wow, thanks! I'm also new to JavaScript as well 😅

chrisetheridge19:08:53

no problem 🙂 whenever you see const { someName } = someObject; its destructuring the someObject, sort of similar to {:keys [someName]} someObject destructuring in Clojure

✅ 1
Jeongsoo Lee20:08:05

Oh yeah, it makes sense because JS objects are like records, which Clojure maps are also like.

p-himik20:08:39

There's also the .. macro: (let [value (.. event -target -value)] ...).

👀 1
chrisetheridge20:08:58

yes! that works nicely when you want to access a property deep inside an object

chrisetheridge20:08:57

there's also https://github.com/applied-science/js-interop which is incredibly useful when you need to do a lot of accessing of JS objects but i highly suggest working with .-, ., and .. before using the lib if you're still new to Clojure

👀 1
Jeongsoo Lee20:08:49

Wow, I was writing something like (-> event .-target .-value), but .. seems to be cleaner.

Jeongsoo Lee19:08:10

Context: I am translating the following method of a React component: 

handleChange(event) {
    const { value } = event.target;
    this.setState({ value });
  }

erwinrooijakkers20:08:45

is it possible with hiccup to escape a / [ or ] in a CSS class name while using the . syntax? e.g. [:div.foo-md[5/7]] . or should i use :class ["foo-md[5/7]"]?

p-himik20:08:19

Definitely the latter. I would suggest using it even when you don't need to escape anything.

p-himik20:08:34

But also, I'd double check that the characters [, /, and ] are valid in CSS class names.

isak22:08:15

I'm guessing this is tailwind (or similar) usage. To work around / being a problem, we just changed it to underscore in our app. Haven't needed to deal with [ yet, we just stayed on tailwind 2. @U2FRKM4TW: is there a reason to use the less concise version other than the syntax difficulties?

👍 1
p-himik06:09:13

Consistent style (class collections with conditional classes are another thing that makes this shortcut useless), ability to search by proper keywords, ability to easily update your own hiccup programmatically.

👍 1
1
erwinrooijakkers13:09:29

@U08JKUHA9 correct, tailwind has such classes

erwinrooijakkers13:09:16

but interesting idea to remap to underscore

isak14:09:50

Yea we prefer that syntax despite those drawbacks. For [], we'll probably just think of a reasonable replacement, or just always use those specifically via :class

alex21:08:57

Hi there, I'm looking to monkeypatch js/console.error so I can observe some errors that are being produced from library code. I'd like to adapt something like this to cljs: 

var originalConsoleLog = console.log;
console.log = function(text) {
  if (text === "something") { doSomething()}

  originalConsoleLog.apply(console, arguments);
}
The portion I'm not so sure about is 
originalConsoleLog.apply(console, arguments);

p-himik21:08:08

(.apply originalConsoleLog js/console (js-arguments)).

MegaMatt21:08:12

(let [orig js/console.log
      side-effect #(when (#{"something"} %1) (do-something))]
  (set! js/console.log (juxt orig side-effect)))

MegaMatt21:08:03

😄 two options for you

p-himik21:08:24

Your code has a potentially bad side-effect - making js/console.log return a value.

MegaMatt21:08:32

mine does change the signature response of console.log also you may have to do something like 

orig (.bind js/console.log js/console)

alex21:08:34

Thanks to both of you. Will give those a try. Good to know about js-arguments and interesting use of juxt!