Clojurians
#cljs-dev
<
2018-02-26
>

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

dnolen00:02:34

@bhauman yeah now that we have this the watcher support in REPLs seems backwards

dnolen00:02:51

oh well live and learn

bhauman00:02:20

I don't understand

bhauman00:02:34

oh the support that is built into the repl

dnolen00:02:56

@mfikes whoa :slightly_smiling_face:

mfikes00:02:32

I'm working on the REPL based exception that you get when you run that. I suspect it might be the result of the way I replace the script tag completely.

dnolen00:02:21

@mfikes @bhauman I added a div with id app to master, I think it makes what you’re trying to do simpler

bhauman00:02:43

I'm all for it

dnolen00:02:32

I’m lukewarm now on browser REPL working without the compile step, I just can’t see a way to make it work without being messy

bhauman00:02:33

the only way I could think to do it cleanly was to add an output-to when compiling the repl client js

bhauman00:02:43

and then serving an html that points at that

dnolen00:02:53

yes but adding :output-to is yucky, you never have to supply that to REPLs

bhauman00:02:05

hopefully we are talking about the same thing

dnolen00:02:11

internally we can’t really know what it means since it could be supplied by user

dnolen00:02:24

since it’s fine to use some opts in a file for repl + build if you like

dnolen00:02:24

@bhauman yeah we can’t use that

dnolen00:02:33

it’ll lead to very weird stuff

dnolen00:02:48

the client JS has to be in a separate dir so it doesn’t interact

dnolen00:02:56

you can’t have the page load from there

dnolen00:02:06

because user might want to do stuff at the REPL

bhauman00:02:13

ohhhhhhhhhh

dnolen00:02:15

then do things go into a directory that’s not supposed to change

bhauman00:02:18

I finally get it

dnolen00:02:38

yeah, it’s just too messy to make this easy

bhauman00:02:49

I'm good with this

bhauman00:02:10

wait, so clj -m cljs.main -re browser -r

bhauman00:02:19

doesn't even work with an custom index.html

mfikes00:02:30

BTW thanks @dnolen making use of your app addition makes the exception goes away

bhauman00:02:20

@dnolen thanks for taking the time to work on this

bhauman00:02:07

I'll try to kick prepls tires this week

mfikes01:02:16

@dnolen On a positive note, your app addition made this work :slightly_smiling_face: https://twitter.com/mfikes/status/967929140430229505

dnolen01:02:55

Also nevermind I think I have a sensible way to make compile-less browser REPL work

dnolen02:02:52

@bhauman you can start browser REPLs now w/o compiles

dnolen02:02:58

I’m going to just shell out to call open so you don’t even need to open a browser

mfikes02:02:56

Maybe only do that on macOS?

mfikes02:02:06

Or is there a portable way?

dnolen02:02:50

@mfikes well if it fails we just ignore, so it’s not a big deal

dnolen02:02:00

applied to master- I don’t think it gets any easier than this :slightly_smiling_face:

dnolen02:02:43

this is amazing :slightly_smiling_face:

dnolen02:02:56

clj -m cljs.main -re browser -c chambered.core -r after adding your dep just worked, open browser with running example

richiardiandrea02:02:09

On Linux it would be xdg-open :wink:

dnolen03:02:00

Happy to take a patch that fixes this up cross-platform, gotta switch gears for a bit

mfikes03:02:24

I’ll take a stab; I have all the OSs available to test with https://dev.clojure.org/jira/browse/CLJS-2555

dnolen03:02:03

cool thanks

bhauman04:02:48

(clojure.java.browse/browse-url url)

mfikes04:02:38

Yes. I’m actually testing something close to that, but will switch to exactly that instead.

mfikes04:02:01

(.browse (Desktop/getDesktop) (URI. (str "http://" (:host repl-env) ":" (:port repl-env))))

mfikes04:02:57

Oh… interesting. So that namespace uses clojure.java.shell instead of the facility in Java. Well, I’ll just use the clojure.java.browse one, as it lets users re-bind *open-url-script*

mfikes04:02:28

Ahh, nice, clojure.java.browse even falls back to the Desktop stuff I was just trying. :slightly_smiling_face:

mfikes04:02:37

Cool. I think it is good to go. It actually opened the browser on Windows as well but failed for an unrelated reason https://gist.github.com/mfikes/b2b137e3c491bf3aaf34eff6b03a686d (I’ll see if I can get a minimal repro for JIRA)

dnolen04:02:51

Nice I wasn’t aware of clojure.java.browse looks like the handiwork of Christophe Grand

mfikes04:02:28

patch attached

mfikes04:02:17

Captured a minimal repro for the issue mentioned a couple of messages back https://dev.clojure.org/jira/browse/CLJS-2556

dnolen04:02:18

thanks, just tried your Bocko gist, this is super cool :slightly_smiling_face:

mfikes04:02:22

Yeah, this git deps stuff, composing with all this other stuff is definitely new territory. We definitely were not able to sling around code like this previously.

alexmiller06:02:35

this kind of stuff is exactly what we were hoping to enable - it’s a lot of fun seeing y’all use it :)

bhauman13:02:11

display an informative message inside the index.html app div

bhauman13:02:20

the browser repl *could* be the default repl, it starts faster than nashorn and is still the most used CLJS environment

bhauman13:02:52

add the clojurescript favicon <link rel="icon" href="https://clojurescript.org/images/cljs-logo-icon-32.png"> to the index.html

bhauman13:02:13

note to self: this is getting very close to bare bones figwheel, the client just needs to know what files to require on change

mfikes13:02:39

I suppose if you made the browser REPL the default, then people could still run non-browser tests if desired (by specifying -re nashorn for example)

mfikes13:02:51

using V8 (via Project Detroit) in the future as the default would also be very compelling (speed, for one)

mfikes14:02:17

Riffing on Bruce's idea of an informative message, for the "compileless" browser REPL, we could slap a logo in there with a little extra code.

mfikes14:02:47

(server/send-and-close conn 200
            (str "document.write('<script>document.body.setAttribute(\"bgcolor\", \"#000000\");</script>');\n"
                 "document.write('<script>document.getElementById(\"app\").innerHTML = \"<canvas id=canvas width=1000 height=1000></canvas>\";</script>');\n"
                 "document.write('<script>ctx = document.getElementById(\"canvas\").getContext(\"2d\");</script>'); ctx.lineWidth = 12;\n"
                 "document.write('<script>ctx.fillStyle = \"#FFFFFF\"; ctx.beginPath(); ctx.arc(300, 150, 100, 0, 2 * Math.PI); ctx.fill();</script>');\n"
                 "document.write('<script>ctx.strokeStyle = \"#96CA4B\"; ctx.beginPath(); ctx.arc(300, 150, 86, 1.57, 4.71); ctx.stroke();</script>');\n"
                 "document.write('<script>ctx.strokeStyle = \"#5F7FBF\"; ctx.beginPath(); ctx.arc(300, 150, 86, 4.71, 1.57); ctx.stroke();</script>');\n"
                 "document.write('<script>ctx.fillRect(294, 55, 12, 190);</script>');\n"
                 "document.write('<script src=\"out/goog/base.js\"></script>');\n"
                 "document.write('<script src=\"out/goog/deps.js\"></script>');\n"
                 "document.write('<script src=\"out/cljs_deps.js\"></script>');\n"
                 "document.write('<script>goog.require(\"clojure.browser.repl.preload\");</script>');\n")
            "text/javascript"
            "UTF-8")

mfikes14:02:01

(That's produced by the 7 extra lines inserted above the normal code to load the Closure stuff and the browser REPL preload code.)

dnolen14:02:08

@mfikes while it’s nice to use some Canvas, we could probably just drop the logo there :slightly_smiling_face: I think there’s one in SVG floating around right?

dnolen14:02:38

Having browser REPL be the default is a good idea

mfikes14:02:06

I'll put together a patch that uses the real logo—we can then decide if we actually want it in the end.

dnolen14:02:09

I added these as issues

dnolen15:02:57

Oh yeah we can also AOT compile the browser REPL client JS file - https://dev.clojure.org/jira/browse/CLJS-2561

bhauman15:02:38

@mfikes probably easier to just use an image tag that references a hosted image

bhauman15:02:06

also in terms of the contents of the message

bhauman15:02:29

I might be nice to mention that the provided index.html is overridable

dnolen15:02:41

I don’t see a reason to not prefer SVG in this case, it can scale

bhauman15:02:18

and that it is provided by the browser repl

dnolen15:02:24

@bhauman no opinons on the copy, got any suggestions?

mfikes15:02:24

I don't know if I have access to see the images list in the clojurescript site. That png is https://clojurescript.org/images/cljs-logo-icon-256.png

bhauman15:02:27

a hosted svg would work

bhauman15:02:04

@dnolen I will work on some copy

dnolen15:02:26

@mfikes honestly I would just get the SVG from that repo and copy it into the ClojureScript JAR - we can serve it locally, ditto for the favicon

mfikes15:02:16

Thinking about how this might work if ClojureScript is a git dep... perhaps it can be a resource...

mfikes15:02:38

Ill give it a shot to see if I can get it to work

dnolen15:02:39

@mfikes yes a resource

dnolen15:02:57

I can manage the build / deploy side, just put things in the right place for now and tweak the server

dnolen15:02:39

@bhauman @mfikes thanks!

bhauman15:02:28

something along those lines

bhauman15:02:40

needs some tweaks

bhauman15:02:01

but I have to go

mfikes15:02:46

Thanks. I'll try incorporating that copy into the same patch used for the logo

bhauman15:02:03

Thanks @mfikes!!!

bhauman15:02:07

BTW mfikes if you can't get the resource you can fall back to the hosted images

bhauman15:02:15

now I really have to go

mfikes17:02:44

I didn't worry too much about styling, but the patch for the logo and copy is now attached. It looks like the following

dnolen17:02:14

Nice, I can tweak the styles, I might just copy a few things from the site

mfikes17:02:26

There is a vexing bug where the logo doesn't appear the first time you start it up. Maybe the solution will come to us if we ponder it a bit.

dnolen17:02:46

huh, I can take a look at that too

mfikes17:02:28

Yeah, it is strange. The logo is indeed copied and if you get the image address from your browser and then open it in another browser it works. I've tried adding a sleep after the code that copies the files to try to avoid any such race, but that doesn't do it either. Hrm.

mfikes17:02:52

It also works if you refresh your browser.

dnolen17:02:27

@mfikes I cleaned up the svg / png handling a bit, I don’t think there should be races now - I just avoid the filesystem

mfikes17:02:40

Nice! That better

dnolen18:02:54

with very basic styling, that’s all I’m planning on doing for now

mfikes18:02:29

Looks great!

dnolen18:02:19

clj -m cljs.main -r

mfikes18:02:23

Confirmed that the race is gone now. :slightly_smiling_face:

mfikes18:02:31

Stupid slow filesystem :slightly_smiling_face:

dnolen18:02:41

this is pretty slick :slightly_smiling_face:

mfikes18:02:55

I'm updating the chambered and bocko-canvas demos to ensure they work with this latest stuff.

dnolen18:02:13

@potetm can we get a rebased patch for this https://dev.clojure.org/jira/browse/CLJS-2167? Sorry for the long delay but now’s a good time to spruce up Browser REPL :slightly_smiling_face:

dnolen18:02:19

I’m fine w/ disabling :optimizations that’s only for the client JS there’ no reason for the user to control that

dnolen18:02:31

in fact we’re going to AOT it so we won’t even bother

dnolen18:02:06

I updated your JIRA privileges

potetm18:02:19

@dnolen for sure! hopefully can get to it this afternoon; tomorrow morning at the lastest.

dnolen18:02:40

@potetm no rush, thanks much

bhauman18:02:51

@dnolen @mfikes awesome!

bhauman18:02:42

I'm looking at the patch now

bhauman18:02:14

@dnolen can we move the style into the app div?

bhauman18:02:43

that way, when it gets overridden, its gone

mfikes18:02:48

That would be nice. (If you do that, can you style the whole body from within the app div?)

bhauman18:02:00

no but you can make the app div the size of body

bhauman18:02:15

well actually it would be a div inside the app div

dnolen18:02:20

@bhauman I don’t know what you mean by overriden?

bhauman18:02:47

if you mount app the contents are removed

potetm18:02:49

There’s one more thing about the browser repl that’s on my todo list, I’m curious if someone already got to it: I think I know why the browser “misses” sometimes. IIRC The child-parent connection just uses a setTimeout before establishing a connection. There’s a pattern for send/ack outlined in Closure: The Definitive Guide that might fix that issue.

bhauman18:02:48

and you can go to town with your react app without having to override default styles

bhauman18:02:09

you would have to remove default margin on body

mfikes18:02:44

An consequence of what @bhauman is referring to is that chambered looks like the following

bhauman18:02:00

yeah this is fixable

mfikes18:02:02

All chambered is doing is

(set! (.-innerHTML (.getElementById js/document "app"))
      "<canvas id=\"game\" width=\"424\" height=\"240\"></canvas>")

bhauman18:02:17

@mfikes actually if you move the style tag inside the app that should work for you I think

dnolen18:02:31

@bhauman done

dnolen18:02:20

@potetm that would be sweet to fix that

potetm18:02:18

@dnolen Cool. I’m hopping on a plane this evening. I should have some time to take a look at it while I travel.

mfikes18:02:09

Sweet. chambered is updated and it behaves properly (you see the expected brief flash of the default page, which gets replaced). chambered no longer requires -re browser as well, so simpler to start:

clj -Sdeps '{:deps {github-mfikes/chambered {:git/url "" :sha "3cbb5fef025ac5da39098e06429043216a6e97b9"}}}' -m cljs.main -c chambered.core -r

bhauman18:02:28

hubba hubba

bhauman18:02:23

@mfikes I don't know about shutting down the agents

mfikes18:02:41

Oh, wait, I guess you need an explicitly add -re browser to have it automatically start the browser.

mfikes18:02:01

Right, that's a bad patch if the JVM is still running something else.

bhauman18:02:22

yeah, you could do it at the end of main

mfikes18:02:50

Ahh, OK. Will try that instead.

mfikes18:02:08

Is the intent with the default REPL being browser that you don't need to specify -re browser? (Thinking about the fact that we lose auto-browser behavior.)

dnolen18:02:46

@mfikes yes

bhauman18:02:07

hmmm we shouldn't loose the default index html in that case

bhauman18:02:16

trying out the new stuff

mfikes18:02:43

See if omitting -re browser make it so the browser doesn't open localhost:9000 for you

bhauman18:02:10

you got it

dnolen18:02:50

@mfikes it works over here, but not if you have multiple one’s running because the address won’t bind

dnolen19:02:06

that’s why I prioritized tim’s ticket - to fix that

mfikes19:02:08

OK, yeah, my box might be in a bad state.

mfikes19:02:19

I'll log out and back in to be sure...

bhauman19:02:08

@mfikes works here :slightly_smiling_face:

bhauman19:02:52

I was initially in a directory that had a deps file in it, and it launched a nashorn repl, so that was confusing

mfikes19:02:07

Well, clj -m cljs.main in the ClojureScript directory starts the browser. but in the chambered example, copied here:

clj -Sdeps '{:deps {github-mfikes/chambered {:git/url "" :sha "3cbb5fef025ac5da39098e06429043216a6e97b9"}}}' -m cljs.main -c chambered.core -r
you seem to need to explicitly add -re browser

bhauman19:02:37

it launched the browser for me

bhauman19:02:53

I used that exact command

bhauman19:02:25

I just did it again and it worked

dnolen19:02:40

@mfikes is that a deps problem?

mfikes19:02:49

Sorted: I had a local deps.edn overriding my ClojureScript dep and not taking the one from from the project

bhauman19:02:02

that's what happened to me

mfikes19:02:04

Makes sense

mfikes19:02:19

I need to learn what a "top" dep is and get this straight in my head

bhauman19:02:19

While we are on the issue of the server, now that CORS is a well supported thing. We could have a simpler repl connection that is supported by simple HTTP polling. No mess no fuss. No iframes, and very robust connection.

bhauman19:02:36

It would work everywhere all the time.

bhauman19:02:23

multiple connections would not cause race conditions

potetm19:02:53

I’d be for that

potetm19:02:44

though it’s a bit bigger than tweaking initialization

potetm19:02:58

depending on when we’re looking to carve a release, I might be up for making the init tweak then swinging back around with a full rewrite

dnolen19:02:21

open to that, but not for the next release

dnolen19:02:15

heh AOT caching client makes bREPL much, much faster to start :slightly_smiling_face:

bhauman19:02:06

but does it connect?

dnolen19:02:25

client js doesn’t hard code hort/port

mfikes19:02:37

Moving (shutdown-agents) to the end of cljs.main/-main fixes things, while not messing with js/setTimeout calls in flight, but seems like something else might go wrong. Anyway here is the potential patch for https://dev.clojure.org/jira/browse/CLJS-2562 https://github.com/mfikes/clojurescript/commit/a02bf1150fc069723ccd094a5151e2e91f2f3f1d

dnolen19:02:18

looks ok to me

dnolen19:02:27

give master a try by building, then bumping your deps.edn adding :classifier "aot"

mfikes19:02:34

Feels like the only way to find out is to try it for a while

dnolen19:02:01

cljs -m cljs.main -r is very quick

bhauman19:02:24

well these improvements are exciting, I can't pull myself away, I'm more rapt by this than by the Olympics

bhauman19:02:45

of course the Olympics are over so that helps

mfikes19:02:38

Wow, java -jar cljs.jar hauls ass

mfikes19:02:00

I wonder @dnolen, Safari seems to exhibit that behavior where it needs a refresh to work, when it is populating a fresh out directory—perhaps it is similar to the thing you just fixed with the png and svg, but for the script files being written to the filesystem and a race with Safari occuring.

dnolen19:02:46

hrm I can’t repro that here on this machine

mfikes19:02:18

It seems pretty deterministic for me. java -jar cljs.jar fails if out is not there, but it works if it is already there

dnolen19:02:18

perhaps we need the fix that @potetm is talking about

dnolen19:02:45

@mfikes just deleted out, it works via clj

dnolen19:02:49

trying the uberjar now

dnolen19:02:13

I will say - the uberjar is not long for this world

dnolen19:02:26

since clj is way better all around

mfikes19:02:34

Hah. I'm hoping for a cljs variant of clj some day :slightly_smiling_face:

dnolen19:02:21

@mfikes uberjar worked for me too, no refresh

dnolen19:02:32

not true one second

mfikes19:02:34

Hmm. Perhaps you have a faster filesystem.

dnolen19:02:00

inconsistent behavior here

dnolen19:02:19

so I think we just need to harden the browser REPL logic on the client

dnolen19:02:49

but this is really cool :slightly_smiling_face:

dnolen19:02:58

like 1-2 seconds to get a REPL

mfikes19:02:24

Yeah. It really feels like some of the (valid) complaints that people have might be addressed by this release.

bhauman19:02:30

and not to mention (cljs.repl/repl (cljs.repl.browser/repl-env)) works fantasticly

bhauman19:02:35

but the chambered example failed to connect the repl every time, even after I killed the browser

mfikes19:02:04

I think chambered is a problem child in that it goes into a tight loop.

mfikes19:02:16

The bocko stuff connects on the other hand

bhauman19:02:16

yeah that makes sense

mfikes19:02:33

Ah hah! Here is what the Safari JavaScript console shows if you start up without a populated "out"

mfikes19:02:22

@bhauman chambered connects the 2nd time you execute that command. In other words, when you have a populated "out"

bhauman19:02:43

not for me :slightly_smiling_face:

bhauman19:02:17

the tight loop must bog it down

mfikes19:02:09

FWIW, Bocko stuff updated and works fine with latest :sha (https://gist.github.com/mfikes/e00202b2de7cc2352fedcf92b1fe60dc)

dnolen20:02:10

yeah chambered goes into a loop and gives little control to the browser, so not a great example of REPL integration

mfikes20:02:08

@dnolen To save you some time in case you encounter it: jbake (the tool for clojurescript site) doesn't seem to work with Java 9; it is fine with Java 8. If you use Java 9 the failure will look like

$ jbake
JBake v2.5.0-SNAPSHOT (2015-11-04 14:58:30PM) []

An unexpected error occurred: null

dnolen20:02:20

k cool thanks

mfikes20:02:28

Cool. Will give it a try

mfikes20:02:48

Drafted this reference page :slightly_smiling_face:

dnolen20:02:49

:grinning:

john20:02:44

y'all.... this is ridiculously awesome!

john21:02:30

@dnolen @mfikes @bhauman thank you so much for bringing all this together!

john22:02:01

I'm getting spec errors about cljs.source-map.base64-vlq though

john22:02:06

Was an issue with a dep, nevermind

richiardiandrea22:02:36

Hello folks, is this correct with the new REPL namespaces? because it throws for me. I can open an issue of course, just wanted to be sure

clojure -J-Dclojure.server.repl='{:port 5044 :accept cljs.server.node/repl}' -A:cljs-canary 

bhauman22:02:36

that's not supposed to work yet

bhauman22:02:47

you need a repl-env

bhauman22:02:06

nope I'm wrong

richiardiandrea22:02:49

trying the -re thing now

bhauman22:02:07

thats new functionality

dnolen22:02:16

@richiardiandrea throws how?

bhauman22:02:18

I hadn't seen it yet

richiardiandrea22:02:46

a sec, pasting to a file

richiardiandrea22:02:14

I connect to it with nc localhost 5555

dnolen22:02:38

@richiardiandrea you need Clojure 1.10.0-alpha4

richiardiandrea22:02:53

oh, gotcha thanks!

richiardiandrea23:02:15

It works! Not for now now, but it would be awesome if a -o would accept a path to an already present cljsc_opts.edn file containing compiler options

richiardiandrea23:02:43

or a way to use my own compiler options for the repl ... it does not seem to see my npm deps

dnolen23:02:29

@richiardiandrea it’s really not possible to get that much configuration out of this

dnolen23:02:53

make your own repl accept fn that does the configuration you want

dnolen23:02:27

what’s there is just the basics so people can experiment with pREPL integrations

dnolen23:02:10

I added -rf and -cf for setting config for REPLs & build directly via EDN string

dnolen23:02:22

check master, if you have better flag names I’m listening

richiardiandrea23:02:34

ok lemme try that

richiardiandrea23:02:15

@dnolen is -cf on master now? the last commit I see is allow setting browser host/post via cljs.main

bhauman23:02:20

good stuff

richiardiandrea23:02:07

yep having options from the command line is awesome, as I was saying earlier, having deps.edn plues cljsc_opts.edn in the project is definitely cool...plus I have a serverless-lumo.edn for lumo...each conf file is decoupled from the other

richiardiandrea23:02:47

thank you folks for the work you put in last week/weekend, I was reading along :smile:

dnolen23:02:02

@bhauman I just added minimal error handling, it should make the more cryptic cases more clear

dnolen23:02:16

nearly all the bad stuff is from falling into the main case, so we check everything there now

bhauman23:02:01

@dnolen great! my common problem was just adding -w without a path

mfikes23:02:01

I'll attempt to keep the content in the cljs.main reference PR up to date between now and release https://github.com/clojure/clojurescript-site/pull/173

dnolen23:02:47

@bhauman k added checking for -w

dnolen23:02:41

@potetm I went ahead and fixed the bind address case, it needed a couple of tweaks anyway

richiardiandrea23:02:44

ok well, -cf seems not to complain but the the require of something from :npm-deps is not working yet...anyways thanks that is what I was hoping for, will try to dig when I have more time