Fork me on GitHub
#shadow-cljs
<
2021-09-29
>
thheller04:09:57

@arohner it is not supposed to find tests in jar files. otherwise it'll also start testing code from libs that accidentally bundled their tests, not all too common but does happen. why does bazel all of the sudden need .jar files? the last time I talked to someone about bazel it needed files and even extracted regular .jar files?

thheller04:09:42

definitely no on the tools.namespace. you can always create a namespace that requires all your tests and use :entries [that.collect-ns] or just :entries [my.foo-test my.bar-test]

thheller04:09:27

or use a script or something to generate that.collect-ns for you. just needs to be (ns that.collect-ns (:require my.foo-test my.bar-test)) etc

Chris McCormick04:09:51

Is there an equivalent of checkouts from lein when using shadow-cljs? My use case is that I am developing a library on my local that I will eventually put into clojars and I have a few projects that are consuming the same library. At the moment I am using symlinks from the src directory but I wonder if there is a better way?

thheller04:09:51

with pure shadow-cljs.edn currently no. deps.edn or lein work as normal

Chris McCormick05:09:19

i can make it work with a deps.edn in the lib and no lein?

thheller05:09:51

if you use deps.edn in your project too sure, just the normal :local/root setup

🙏 1
Franklin12:09:35

hey @thheller I'm having trouble using an npm package

Franklin12:09:41

shared.js:1552 TypeError: Super expression must either be null or a function, not undefined
    at _inherits (control.js:26)
    at eval (control.js:50)
    at Object.shadow$provide.module$node_modules$react_leaflet_control$dist$control (control.js:49)
    at Object.shadow.js.jsRequire (js.js:66)
    at Object.shadow.js.require (js.js:113)
    at eval (quagga.components.dataview.map.view.js:4)
    at eval (<anonymous>)
    at Object.goog.globalEval (shared.js:486)
    at Object.env.evalLoad (shared.js:1549)
    at tabbed-dataview.js:250

Franklin12:09:04

the require looks like this

["react-leaflet-control" :default Control]

Franklin12:09:58

my code looks something like this

[:<>
     [:> TileLayer {:url "https://{s}.}]
     [:> ZoomControl {:position "bottomleft"}]
     [:> Control [:button "click me"]]
     [:> FeatureGroup
      (map
        (fn [position] [:> Marker
                        {:position position,
                         :key position,
                         :eventHandlers {:click (fn [e]
                                                  (js/console.log
                                                    (-> e
                                                        .-target
                                                        .-_latlng)))}}])
        geopoint-positions)]]

Franklin13:09:41

I'm starting to think it's something that's wrong with the package that's the cause for this; maybe it's not compatible with shadow-cljs?

Sainadh14:09:59

@USWTQB9RU I think the components TileLayer, ZoomControl etc need to be inside a Map component. For Example: This worked for me

(ns example.views
  (:require
   ["react-leaflet-control" :default Control]
   ["react-leaflet" :refer [Map TileLayer ZoomControl]]

(defn main-panel [style]
  [:div {:style style}
    [:> Map {:center [51.3 0.7] :zoom 10}
     [:> ZoomControl {:position "topright"}]
     [:> TileLayer {:url "http://{s}."
                    :maxZoom 18}]
     [:> Control {:position "topleft"}
       [:button "click me"]
       "Reset View"]]])
this is from https://www.npmjs.com/package/react-leaflet-control I ported the example to cljs

Franklin14:09:08

thanks @U02806HQX1C 🙂 . I actually did put them them inside a MapContainer component that wraps the component I pasted up here ☝️ . On the other hand, I later also found a workaround where I don't need to use this library. but I still am curious as to why I get the above error

Sainadh15:09:19

Cool. I got similar error when I used the Control component in isolation. So, I thought that might be the issue.

Sainadh14:09:34

Hi @thheller I am playing with the excellent rn-rf-shadow React Native project and facing issues with live reload The project structure is as below

;; app.cljs

(ns 
  (:require [example.events]
            [example.subs]
            [expo.root :as expo-root]
            ["react-native" :refer [View]]
            [example.screens.home :refer [home-screen]]))
  
(defn root []
  [:> View
   [home-screen]])

(defn start
  {:dev/after-load true}
  []
  (expo-root/render-root (r/as-element [root])))

 ...
;; screens/home.cljs
(ns example.screens.home
  (:require ["react-native" :refer [SafeAreaView Text]]
            [example.components.image :refer [image]]))            

(def clojure-image (js/require "../assets/images/clojure.png"))

(defn home-screen []
  [:> SafeAreaView
    [:> Text "Hello World"]
    [image clojure-image]
;; components/image.cljs
(ns example.components.image
  (:require ["react-native" :refer [Image View]]))

(defn image [user-image]
  [:> View {:style {:height 46
                    :width 46}
    [:> Image {:source user-image
               :style {:height 40
                       :width 40}}]])
Live reloading for any change I make in home.cljs or app.cljs is working perfectly fine. But isn’t working for changes in image.cljs I will have to do some dummy change in home.cljs everytime for the live reload to work. I see that this was already asked here https://github.com/thheller/shadow-cljs/issues/544, but the specified solution only works for children (imported) in app.cljs I tried ^:dev/always to app namespace like so (ns ^:dev/always ) and that doesn’t seem to work either. Is there any solution for this. Am I missing something ?

thheller15:09:35

no clue what expo.root is so can't say

Sainadh15:09:11

I’ve used [shadow.expo :as expo] from your reagent-expo example and the behaviour is same.

(ns 
  (:require [shadow.expo :as expo]
            [re-frame.core :as rf]
            ["react-native" :refer [View]]
            [reagent.core :as r]
            [example.screens.home :refer [home-screen]]))
  
(defn root []
  [:> View
   [home-screen]])

(defn start
  {:dev/after-load true}
  []
  (expo/render-root (r/as-element [root])))

(defn init []
  (rf/dispatch-sync [:initialize-db])
  (start))

Sainadh15:09:38

Seems like an extension of this issue https://github.com/thheller/shadow-cljs/issues/544#issuecomment-521662073 Adding {:dev/after-load true} as suggested in the issue

;; app.cljs

(defn start
  {:dev/after-load true}
  []
  (expo/render-root (r/as-element [root {:x (js/Date.now)}]))) 
Only works for changes in imports (children) of app.cljs But don’t work for grandchildren. Strange that this doesn’t happen for web development and only for react-native

thheller15:09:13

well did you try the suggestion with using an extra variable?

thheller15:09:30

react or reagent stop rendering if they encounter a component that hasn't changed

thheller15:09:46

you can set :devtools {:reload-strategy :full} in your build config to reload many more files than it usually would

thheller16:09:04

slower overall but might fix you issue

thheller16:09:17

but the issue is not with shadow-cljs. it is reagent/react deciding to stop to render

thheller16:09:55

ie. when you only edit image.cljs then [root] didn't change. so reagent/react decide they can stop rendering completely and never get to the actual image which actually changed

Sainadh16:09:21

> well did you try the suggestion with using an extra variable? You mean adding {:dev/after-load true} Yes I’ve tried this. Same behaviour.

Sainadh16:09:43

> you can set `:devtools {:reload-strategy :full}` in your build config to reload many more files than it usually would This worked… 🙏

thheller16:09:19

I meant this [root {:x (js/Date.now)}]

thheller16:09:46

the :dev/after-load just tells shadow-cljs which function to call after its done reloading code. you need that regardless

thheller16:09:04

the :x would be the "hack" to force reagent/react to actually render the component and not skip it

Sainadh16:09:12

> I meant this `[root {:x (js/Date.now)}]` Oh right. My bad, sorry :face_palm: This worked.

Sainadh16:09:32

without the full reload strategy.

Sainadh16:09:01

Thanks for your prompt response and for Shadow as well. 🙌

Tiago Dall'Oca14:09:06

➜  malli-ts git:(master) ✗ node 
Welcome to Node.js v14.17.6.
Type ".help" for more information.
> let malli_ts = require('malli_ts.ts')
Uncaught TypeError: Cannot read property 'Error' of undefined
    at Object.<anonymous> (/home/tiago/Documents/side-projects/malli-ts/node_modules/goog.debug.error.js:38:29)
    at Module._compile (internal/modules/cjs/loader.js:1072:14)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1101:10)
    at Module.load (internal/modules/cjs/loader.js:937:32)
    at Function.Module._load (internal/modules/cjs/loader.js:778:12)
    at Module.require (internal/modules/cjs/loader.js:961:19)
    at require (internal/modules/cjs/helpers.js:92:18)

Tiago Dall'Oca14:09:12

The build config I'm using:

{:target :npm-module
 :output-dir "node_modules/"
 :entries [malli-ts.ts]}

Tiago Dall'Oca14:09:00

It is compiling successfully but failing to import the module 😕

winsome15:09:31

I just spent some time tangling with cljs->node, you might try wrapping the output from the compiler in this UMD wrapper: https://groups.google.com/g/clojurescript/c/vNTGZht1XhE

thheller15:09:40

@U4U6BDQTE which shadow-cljs version? this should be fixed in the latest?

thheller15:09:10

@U028BUU1P3R that code is ancient history and not relevant anymore

winsome15:09:52

good to know 🙏

thheller15:09:09

FWIW prefer using :node-library over :npm-module when you can

Tiago Dall'Oca15:09:39

I did switch to :node-library and it's working fine 🙂

Ryan Jerue22:09:23

If I have npm modules that I am using via npm link is there any way to get shadow to hot reload them as the bundle for that linked package is updated?

thheller05:09:14

shadow only watches package.json files for changes, so if you touch package.json it should update

Ryan Jerue15:09:57

This worked, thank you so much! 🎉