Fork me on GitHub
#shadow-cljs
<
2020-04-22
>
Aron04:04:45

what kind of pretty printer is everyone using?

mhuebert08:04:14

random comment to say how happy I am with shadow’s caching/invalidation approach. I had forgotten how often I used to encounter bugs related to partially compiled code, macros not recompiling properly, waiting to recompile everything after ‘clean’, etc, which had faded in my memory (until working again on some old code).

❤️ 12
yenda08:04:00

anyone tried using shadow in nixos? does it need a nixpkg like leiningen or is it just usable as a dep in the package.json of your project?

thheller09:04:35

@yenda it needs java and node/npm

thheller09:04:52

leiningen is needed if you use project.clj, otherwise it works without

yenda09:04:14

does it fetch clojure jar itself when you install it with npm?

thheller09:04:14

it loads the shadow-cljs-jar npm dependency which contains an uberjar to download maven dependencies yes

witek09:04:08

Hello. I have a macro, which I would like to output different code, when in release build. How do I detect the release vs. development build in my macro code?

thheller09:04:34

@witek you can check the :shadow.build/mode key in the macro &env, like this

(core/defmacro defonce
  "defs name to have the root value of init iff the named var has no root value,
  else init is unevaluated"
  [x init]
  (if (= :release (:shadow.build/mode &env))
    ;; release builds will never overwrite a defonce, skip DCE-unfriendly verbose code
    `(def ~x ~init)
    `(when-not (exists? ~x)
       (def ~x ~init))))

🙏 4
orestis11:04:41

Having some trouble loading JS files on my classpath, as per https://shadow-cljs.github.io/docs/UsersGuide.html#classpath-js -

The required JS dependency "/js/react-fitted-image/index" is not available, it was required by "nosco/views/ideabox_copy_select_template.cljs".

Dependency Trace:
	nosco/views/main.cljs
	nosco/views/ideabox_copy_select_template.cljs

orestis11:04:46

However, from the same repl: (io/resource "js/react-fitted-image/index.js") returns a correct file.

orestis11:04:28

Neither ["/js/react-fitted-image/index.js" :as FittedImage] nor ["/js/react-fitted-image/index" :as FittedImage] work.

thheller11:04:47

@orestis it is possible that parsing errors in .js files aren't reported to the proper place. look at the server output, maybe there is something about a parse error

orestis11:04:57

Nothing there -> I also tried with a trivial file (literally just function foo(){ alert("hi"); }) and I get the same error.

thheller11:04:52

hmm it might be the filename? the typical - vs _ as in cljs files? not actually sure.

thheller12:04:17

try "/js/react_fitted_image/index.js" as the name?

orestis12:04:20

Background -> I want to use a stupid little react library and run into a flavor of the stupid babel regenerator runtime stuff. So I decided to just copy the thing in, it’s 100 lines of JS.

thheller12:04:42

does it contain JSX?

orestis12:04:47

["/js/foo.js" :as foo] has the same issue, I thought of the dash vs underdash.

orestis12:04:16

oh yeah, it should contain JSX, good call. But the foo.js file is just a function.

thheller12:04:02

hmm are you sure your classpath is setup correctly? I mean do you get the proper resource when using shadow-cljs clj-repl? no other tool, no nrepl, etc?

orestis12:04:02

$ shadow-cljs clj-repl
shadow-cljs - config: /Users/orestis/dev/nosco/gamma/shadow-cljs.edn
shadow-cljs - connected to server
shadow-cljs - REPL - see (help)
To quit, type: :repl/quit
> (require '[ :as io])
nil
> (io/resource "js/foo.js")
#object[.URL 0x240a2e93 "file:/Users/orestis/dev/nosco/gamma/dev-resources/js/foo.js"]
shadow.user=>

orestis12:04:19

> (slurp (io/resource "js/foo.js"))
"var x = 1;\n"

thheller12:04:26

don't put these things into resources ...

thheller12:04:36

resources get filtered out

orestis12:04:52

Oh? I thought the classpath didn’t make any distinction?

thheller12:04:08

unfortunately shadow-cljs has to

thheller12:04:29

there are waaaaaaaaaaaaaay to many libraries out there that contains compiled .js code as well as their sources

thheller12:04:08

even uncompiled sources .. so there might be a cljs/core.cljs file in a .jar that is not clojurescript

orestis12:04:23

Are you literally looking for filenames that contain resources ? 😄

👀 4
orestis12:04:57

Let me just try for that foo.js thing for my curiosity

thheller12:04:06

I've been meaning to remove the classpath indexing shadow-cljs does

thheller12:04:23

but it is so convenient to have sometimes that I don't really want to 😛

Spaceman12:04:15

for some reason my shadow repl isn't allowing me to require anything, although I can still require things in the project files.

Spaceman12:04:30

shadow.user> (require '[tw-cljs.core :refer [tw]]) Execution error (FileNotFoundException) at shadow.user/eval76747 (form-init5445768818949264817.clj:465). Could not locate tw_cljs/core__init.class, tw_cljs/core.clj or tw_cljs/core.cljc on classpath. Please check that namespaces with dashes use underscores in the Clojure file name.

Spaceman12:04:36

Why might this be?

thheller12:04:50

that is not a CLJS REPL. that is a CLJ REPL. you can switch to the CLJS REPL by calling (shadow/repl :the-build-id)

orestis12:04:43

OK, moving the simple foo file outside to some non-resources folder seems to work. Good to know in the future.

orestis12:04:15

BTW where is the guide at? I could make a quick doc PR for this

thheller12:04:25

yeah I should probably lift that restriction somewhat. doesn't really matter if you classpath is clean

thheller12:04:46

should probably just warn about bad .jar files that contain compiled code in bad places

Spaceman14:04:02

how do I run cljs tests in cider?

Spaceman14:04:40

C-c C-t n doesn't work. I get clojure only operation requested in clojurescript buffer

dpsutton14:04:34

ask in #cider for CIDER related things. but the automatic test runner is clj only

Spaceman14:04:45

yeah wrong channel sorry

Spaceman14:04:45

there must be a way to hack cider though? I'm sure the way exists

Spaceman15:04:36

whenever I run (js/alert "foo") in the shadow repl, it breaks the repl. The repl stops working

Spaceman15:04:02

Why is this and why can't I see the output of the (js/alert "foo") in the repl?

haywood15:04:54

btw @thheller that thing I’m working on is recreating next.js’s filesystem routing api, but natively for clojurescript, which has advantages since the source code for a page is data itself so it’s easy to extract a page routes map to configure the router (if you need). I have a basic thing working in our app now, will work on adding more features (what’s missing from next.js)

haywood15:04:56

@pshar10 if you’re in the browser repl that operation blocks everything until the alert is closed

haywood15:04:12

same with (js/confirm "confirm or deny?")

Spaceman15:04:38

so say I'm running tests and I want to compare the behavior of a component. e.g. (is (= #(js/alert "something") (:on-click (nth (my-component) 1)))How would I do that?

Spaceman15:04:06

actually (is (= (js/alert "something") ((:on-click (nth (my-component) 1))))

haywood15:04:22

you should instead assert that the passed on-click handler is called

haywood15:04:37

since that’s essentially what you’re trying to assert, and not that js/alert works

haywood15:04:55

you could test the resulting handler in isolation afterwards

Spaceman15:04:31

would you give an example of what you mean by asserting that the passed on-click handler is called?

haywood15:04:32

are you using any additional libraries for end to end testing

Spaceman15:04:44

no, are there any good ones?

haywood15:04:04

it seems like you’re trying to simulate user actions, and make assertions about the outcomes based on the new elements displayed

Spaceman15:04:39

I'm trying to do test driven development, and trying to test the front-end. I'm not sure if test driven development is useful for doing that.

haywood15:04:00

TDD is a little hard for client side code, but something like https://github.com/bhauman/devcards

haywood15:04:08

is a good translation to the workflow

Spaceman15:04:21

I'm using #workspaces which is similar

haywood15:04:33

for integration style tests against the browser I’ve used enzyme

Spaceman15:04:58

have you used it? does this make development faster?

haywood15:04:53

I have used it, the fact I don’t use it now probably says something

haywood15:04:09

my workflow is get my editor connected to the browser repl, and then just start writing code

haywood15:04:29

like tinkering on the workbench

Spaceman15:04:47

so no test driven development? I thought it helps writing code faster?

haywood15:04:49

you’re essentially testing your code as you go in the repl

haywood15:04:57

yea I dunno never worked for me

haywood15:04:45

wow I hadn’t heard about workspaces thanks for this!

knubie16:04:20

Running into this error on Cordova: WebSocket network error: WebSocket connection failed because it violates HTTP Strict Transport Security. I’m looking into it now, but just posting it here to see if anyone has run into this issue before? It’s preventing the hot reloading.

thheller16:04:02

just relax your CSP? it is configured in your index.html by default and rather strict. just remove it for development?

knubie18:04:45

Yeah that was my first thought, but I don’t have any CSP set in the index.html

knubie18:04:22

I’m thinking it might have to do with cordova-plugin-ionic-webview

thheller19:04:10

this is about as far as I have ever used cordova and it had a CSP meta in the default html https://github.com/thheller/cordova-cljs

thheller19:04:28

don't know more but the error you posted points towards CSP settings

olleromo16:04:28

I'm trying out shadow-cljs for the first time with a new project based on Luminus. When I try to jack-in-cljs I get "Execution error (ExceptionInfo) at shadow.cljs.devtools.server.runtime/get-instance! (runtime.clj:11). missing instance". Is this an easy fix?

thheller17:04:19

do you have shadow-cljs running?

thheller17:04:22

I do not support the way luminus has integrated shadow-cljs via lein-shadow. so you are going to have to ask the authors how this is meant to work.

thheller17:04:30

if you have it running then you might just not be connected to it properly

thheller17:04:42

but instead conencted to the luminus server nrepl

olleromo17:04:30

Ah - ok. I'll look into that. Thanks 😊

Spaceman17:04:56

How can I add a js file in my shadow build process? It's a postcss.config.js file in my root directory and I want to build my shadow app with the postcss

thheller17:04:58

you run postcss separately

thheller17:04:31

neither lein nor shadow-cljs need to know where your .css files come from. they just need to be somewhere.

diego.videco17:04:19

Hello, I've got a js file that I want to import into my app. The file starts like this:

var CodeMirror = require('codemirror/lib/codemirror')
require('codemirror/mode/javascript/javascript')
require('codemirror/addon/hint/javascript-hint')
require('codemirror/addon/hint/show-hint')
require('codemirror/addon/selection/mark-selection')
require('codemirror/addon/comment/comment')



console.log("cm",CodeMirror)
The problem is that CodeMirror is undefined. How can I import it?

thheller17:04:49

whats the point of that js file? why not do it directly on CLJS?

diego.videco17:04:37

I took it from another repo, I don't want to rewrite all the files

thheller17:04:46

can't say why it is nil, works fine for me.

diego.videco17:04:59

My calling code looks a bit like this:

thheller17:04:02

I'm assuming that you mean this console.log("cm",CodeMirror) logs CodeMirror as being undefined?

diego.videco17:04:38

yes, and also the code that follows throws an error because of that

diego.videco17:04:03

(ns algoradio.core
  (:require
   [algoradio.state :refer [app-state]]
   [cljs.user :refer [spy]]
   [algoradio.archive :as archive]
   [reagent.core :as reagent]
   [algoradio.freesound :as freesound]
   [algoradio.player :as player]
   ["/hydra_editor/dist/index" :as h]))
;; more code
(comment (h/init (clj->js {:editorContainerId "editor-container"})))

diego.videco17:04:38

yes, and also the code that follows throws an error because of that

diego.videco17:04:20

I just found a quick and painless solution, that was building a bundle with parcel, but I wonder I am doing something wrong

thheller17:04:54

don't know what you mean by building with parcel

thheller18:04:14

doesn't seem like a good idea to me

diego.videco18:04:20

there's a bundle builder for js called parcel (kind of like webpack)

thheller18:04:26

I know parcel

thheller18:04:36

I don't know what you are using it for

thheller18:04:46

it is sort of like using parcel AND webpack in the same project

thheller18:04:06

that doesn't seem like a thing you'd do?

diego.videco18:04:09

yeah, it's not good

diego.videco18:04:54

Could you please try this @thheller

const CodeMirror = require('codemirror/lib/codemirror')
console.log("cm2", CodeMirror)

export default {}

diego.videco18:04:14

I found that adding the export default caused the failure on my side

diego.videco18:04:07

in fact any use of export seems to provoke it

Spaceman18:04:29

How do I use reframe in the repl? In my project files subscribe and dispatch works, but in the connected shadow-cljs repl, the dispatches and the subscribes are all returning nil

Spaceman18:04:37

also the subscribe isn't working in my test file

thheller19:04:42

@diego.vid.eco do not mix require with export. either use require with exports.foo or import and export foo. don't use commons and ESM in one file.

diego.videco19:04:07

This doesn't work for me either

import CodeMirror from 'codemirror/lib/codemirror'
//const CodeMirror = require ('codemirror/lib/codemirror')
console.log("cm2", CodeMirror)

thheller19:04:14

import * as CodeMirror from ...

diego.videco21:04:31

BTW I am really enjoying working with shadow. Awesome work!

thheller19:04:33

you are likely better off with require

👍 4
Spaceman19:04:22

How do I use reframe in the repl? In my project files subscribe and dispatch works, but in the connected shadow-cljs repl, the dispatches and the subscribes are all returning nil also the subscribe isn't working in my test file. Anybody?

fricze10:04:18

share your code on Github, or somewhere similar and post on #clojurescript

fricze10:04:39

it should just work, so you probably have some problem with your code

thheller19:04:24

@pshar10 please don't spam the same question repeatedly. I don't use re-frame and don't know.