Fork me on GitHub
#boot
<
2016-11-17
>
pseud13:11:56

When developing a clojurescript library. Let’s pretend for a moment that I don’t want to use the (in boot) excellent checkouts feature — so I’m not going to have some other project with boot-cljs-reload etc from which I’ll inspect & interact with my client library. Instead, I’d really like to extend my build.boot in such a way that I can get a clojurescript repl (+ nrepl for use with cursive/emacs).. Is this possible without going the reload route, serving index.html files and whatnot ? Can I use e.g. phantomjs and get a repl without involving a browser ?

pseud14:11:30

Can I use boot-cljs-repl (https://github.com/adzerk-oss/boot-cljs-repl) in a headless manner ? Following the page’s instructions I’m stuck with a repl which says “waiting for client to connect … Connection is <ws://localhost:61535>”.. There’s no way to use phantomjs or something else to circumvent the need to startup & serve an index file etc etc etc ?

borkdude17:11:24

with boot, how do I get source-maps working?

borkdude17:11:39

we already have source-map set to true

richiardiandrea17:11:06

@borkdude are you including/serving main.out?

borkdude17:11:57

this is our dev task:

(deftask dev []
  (set-env!
   :source-paths #(conj % "src-cljs-dev"))
  (comp
   (start-system)
   (watch)
   (less :source-map true :compression false :inline-javascript true)
   (reload :on-jsload 'dre.app/fig-reload)
   (cljs-repl)
   (cljs
    :source-map true
    :compiler-options {:parallel-build true
                       :preloads '[devtools.preload]})))

borkdude17:11:21

I’ll look into this @richiardiandrea, thanks > Note that the compilation process generates the main.out folder in any of the optimizations settings. For source maps to work you need both main.out and main.js.map in your served folder.

richiardiandrea17:11:10

yes exactly, I think that's my contribution to the wiki, I fell into this as well

borkdude18:11:04

We have this in resources/public/js:

{:require [dre.app]
 :compiler-options {:asset-path "js/app.out"
                    :devcards true}}
Any idea what I’m missing?

borkdude18:11:24

Does anyone have an example project where source maps work?

micha19:11:09

@borkdude source maps work in this demo, for example: https://github.com/hoplon/triclojure-hoplon-2016

micha19:11:20

you can clone it and do boot dev

skrat19:11:59

seems to me like a bug in boot (unhandled nil value)

micha19:11:10

what does your build.boot look like?

skrat19:11:18

@micha it works on linux, but running the same tasks with the same bootfile on windows throws this error

skrat19:11:29

this error output is from my colleague running Windows, unfortunately I don't have one to test it

micha19:11:02

dammit linux

micha19:11:31

cut and paste must be the hardest problem in computer science

micha19:11:04

p/np is child's play compared to cut and paste

borkdude19:11:35

@micha that examples differs from ours because we use a app.cljs.edn file in resources/public.js + asset-path set. Maybe there is another example that looks more like ours?

skrat19:11:53

did you ever used clipboards on linux? with emacs? and gtk? and rxvt?

micha19:11:58

@borkdude hoplon task creates the .cljs.edn file etc

micha19:11:21

yeah i have tons of clipboards in linux

micha19:11:31

i think three, maybe more

micha19:11:48

none of them work in any kind of consistent way

micha19:11:22

@skrat i think the NPE is a bug in the replace-content task in cljsjs

borkdude19:11:36

The application seems to recognize the .map file, because it knows the file name + line, it just shows an empty file however in Chrome, so it can’t resolve the relative path it seems.

skrat19:11:01

@micha seems so, they use in string as regex to match a path, but it bork on Windows, because slash slash

skrat19:11:21

ie. it comes back as nil so yeah

micha19:11:09

yeah this is a deeper problem

micha19:11:32

i don't know how to express filesystem paths in a platform-agnostic way

skrat19:11:46

as lists of course 🙂

micha19:11:58

how do lists work with regexes?

skrat19:11:13

they don't, one has to join with some platform-path-delimiter

skrat19:11:44

it's crazy, 2016 and we'll still replacing slashes with backslashes, nanananaa

micha19:11:54

if at least the regex implementation had a backslash escape char for file separator

borkdude19:11:59

(io/file f1 f2 f3) ;;=> “f1/f2/f3”

micha19:11:10

like ^foo\fbar

micha19:11:27

\f could be / in unix and \ in windows

micha19:11:01

the only thing i can say is that you can dispatch in your build.boot

micha19:11:24

detect which OS it is for example (boot.App/isWindows)

borkdude19:11:59

I added this to our app.cljs:

(let [x 10]
  (js-debugger))
This is what I see in Chrome: https://www.dropbox.com/s/8i1sj3owd9qe9jo/Screenshot%202016-11-17%2020.20.55.png?dl=0

micha19:11:00

i do use the (io/file "asdf" "qwer") way everywhere in boot

micha19:11:11

but the issue is when selecting files by path

micha19:11:16

regex is really handy

micha19:11:23

and you can type a regex at the command line

micha19:11:26

pretty great

micha19:11:40

but then the regex is platform specific

micha19:11:18

@borkdude is the .map file being served from the correct url?

borkdude19:11:34

@micha I can get the map file here: http://localhost:3700/js/app.out/dre/app.js.map, but I’m not sure if that’s the correct URL

skrat19:11:58

would be handy dandy to have a function to transform a path regex into platform agnostic path regex, ie. insert all the /|\\

borkdude19:11:14

@micha I’m not sure what you mean with ‘this’, specifically. We don’t output to target during dev.

micha19:11:54

it's a way to see source maps working

borkdude19:11:31

do you suggest running boot cljs -s -- target in our project?

micha19:11:21

no, you asked earlier if there is an example in which source maps work

micha19:11:29

that was an example

borkdude19:11:59

ah ok, I’ll try that one to see where it serves the source map

micha19:11:09

the .js file should have a url at the bottom

micha19:11:18

where it looks for the map file

micha19:11:24

embedded in a comment

micha19:11:39

thre should be individual js files for each namespace

micha19:11:45

with optimizations :none

micha19:11:52

each one has an associated source map

micha19:11:25

@borkdude this is what i see in chrome when i load the hoplon page

micha19:11:59

see the bottom of the js file

micha19:11:03

the green comment

micha19:11:07

that's the source mapping

micha19:11:14

and see the file i'm looking at

micha19:11:21

it's one of many js files

micha19:11:41

and for each js file there is a corresponding cljs file, and a map

micha19:11:48

so look for two things

micha19:11:50

in the fileset

micha19:11:27

js/app.out/dre/app.js.map and js/app.out/dre/app.cljs

micha19:11:42

if one of those doesn't exist then you won't have source maps

borkdude19:11:50

both work if I request them from localhost:3700/…

micha19:11:14

try removing devcards and all that

micha19:11:22

bisect the problem

borkdude19:11:49

yes, I’ll try to make a small reproducible example

borkdude20:11:29

it resembles our project pretty well

borkdude20:11:35

and it reproduces the issue

micha20:11:21

can you build that?

micha20:11:34

i get an exception, directory src-cljs not found

borkdude20:11:06

ah, it’s because of git, it doesn’t check in empty directories… I’ll add it

borkdude20:11:06

you’ll have to open the debugger and then refresh

micha20:11:50

it seems to work fine

borkdude20:11:15

can you post a screenshot?

micha20:11:10

i'm serving it with python

micha20:11:32

python -m SimpleHTTPServer 9999

micha20:11:54

so maybe something going on with your webserver configuration

micha20:11:21

did you try navigating to the js directory etc

micha20:11:32

i see index.html highlighted there

borkdude20:11:06

it appears empty

micha20:11:08

maybe an issue with your browser?

micha20:11:17

do you have source maps disabled perhaps?

micha20:11:28

it's a checkbox somewhere, they keep moving it around

micha20:11:04

that's the source map i get for app.js

micha20:11:12

works fine on my machine

micha20:11:33

maybe you can compare that to the one you get

borkdude20:11:01

how did you get this one?

micha20:11:15

cat target/public/js/app.out/dre/app.js.map

borkdude20:11:48

{”version":3,"file":"\/Users\/Borkdude\/.boot\/cache\/tmp\/private\/tmp\/app\/1o3\/-ts11q9\/public\/js\/app.out\/dre\/app.js","sources":["app.out\/dre\/app.cljs"],"lineCount":8,"mappings":";AAAA;;AAEA,aAAA,TAAMA;AAAN,AACE,AAAA;;AAAA","names":["x"]}%

micha20:11:06

look at "sources":...

micha20:11:12

looks different than mine

micha20:11:47

definitely looks like it won't work

micha20:11:37

oh interesting

micha20:11:50

i removed :source-map true

micha20:11:56

since that's the default anyway

micha20:11:04

and that fixed it, apparently

micha20:11:10

so remove that 🙂

borkdude20:11:02

yes, that works...

borkdude20:11:00

I’ll try it in our real project now

micha20:11:55

yeah looks like a bug

borkdude20:11:09

I’ll file an issue with boot-cljs and refer to the example project, ok?

micha20:11:48

sure, i'll try to make a patch sometime this evening

borkdude20:11:36

Ah, looks like there was an issue for this already. I’ll just comment there.

micha20:11:56

i also noticed that :source-map false sometimes causes issues too

borkdude20:11:32

Thanks for your time @micha, I appreciate it.

micha20:11:28

sure anytime

naomarik21:11:17

I’ve been using figwheel in boot by setting figwheel’s like :output-dir “figout/main.js" and :output-to “figout/out” and having (boot.pod/add-classpath “figout”) and I can call start-figwheel! from sidecar. this doesn’t pass through boot’s filesystem, but it’s working perfectly for me. Wondering if there’s potential downsides or benefits of adding it to boot’s docs or writing a simple task to do such a thing.. it’s been extremely helpful for me but I had to learn the build system to figure this simple thing out.

naomarik22:11:21

a new saapas project on my computer takes 700ms to reload and a more mature project I have takes over 1.3 seconds, and with figwheel it’s instnat

richiardiandrea22:11:38

@naomarik Oh wow it works fine? I had many many problems with the exact same thing. I would add it to the wiki yes, it can of course be helpful, with a big warning, yesterday I had figwheel client communicating with the boot-reload server, if I have time today (during the Clojure meetup, showing off a bit) I will continue and try to send the figwheel events on every change...hopefully this will be less of a hacky setup

richiardiandrea22:11:26

I'd suggest creating a Figwheel page in https://github.com/adzerk-oss/boot-cljs/wiki with your solution, to which I will then add mine (if @micha agrees)

naomarik22:11:49

ya it works fine for me on a few projects i tried it on. there seems to be a lot of overhead having all the compiled JS get copied through the cache directories so initially i was doing this with a hacked figwheel using (Thread/sleep) right before the send notification, and i had it dumping all the files into a resource path set by boot so the webserver can serve it

naomarik22:11:30

but boot.pod/add-classpath fixes that

naomarik22:11:17

i don't have it in a task atm, just calling it via the repl but i think it would be very trivial to od

naomarik22:11:31

could even have it read in the EDN files that exist and set the figwheel config accordingly

richiardiandrea22:11:23

boot-figwheel has already the configuration and task part, I was hacking on that one for my tests

richiardiandrea22:11:41

but yeah I guess it can be a new task, given the nature of it

naomarik22:11:38

i think the boot-reload doesn't calculate the minimum changesets does it?

juhoteperi22:11:01

boot-reload doesn't have to care about that, because cljs compiler already does

richiardiandrea22:11:56

I am not familiar with that part yet, I will investigate it today because I need to tailor figwheel events, which require changed namespaces/files