The encoding error message could be a lot better.

(I pretty-printed the env to figure out what was going on — I think it was multiple MBs long, and took about 15 seconds to load into the browser console. 😆 That’s when I knew I must be putting garbage into the serializer. 🙂

So I'm not sure how you got the error message you got. The line you refer to has new error message stuff on it. I think perhaps you're using an older version of Fulcro itself that doesn't have the imporved error messages?

could you verify that? I'm interested in this being easier to understand.

I’m with @U0522TWDA right now — we reproduced the problem with Fulcro 3.5.0-RC3. The error message appears to be the same with 3.5.2. Thinking this through, it’d be great had the error message suggested that during a transact! (maybe it’s name), the data could not be serialized, and it is of the type “Component”. Or something like that. Thanks!

But what is the actual content of the error message @U6VPZS1EK? You only showed your print of props

I think it refers to a URL, which I've updated in the online book to better explain what is going on. You're right that in debug mode I could warn if the content of a mutation's parameters is not serializable. The problem with that is if it is ONLY a local mutation, you can "get away" with doing that, so it'd have to be deeper in the bowels, which might be harder....I'd have to think about it

@U6VPZS1EK @U0522TWDA I've added a new error message to transact! when in dev mode...try it out via GIT SHA version: 274db2654a8e646ccfadd1d4bf7d9aac6d9f7add

(try doing a

(transact! this `[(some-sym {:param (fn [] 52)})])

doesn't matter if the mutation is defined if you quote it, it should still show the warning

Just a stab: I'm guessing there is a version problem in your deps. It sounds like the function mem/->nippy-buffer was expected to be there, but was not. Look at what crux.clj aliases to mem, and then figure out which dependency that is and make sure you have the right version.

That was just pointing to https://github.com/juxt/crux/blob/master/crux-core/src/crux/memory.clj#L4, so I explicitly added:

pro.juxt.crux/crux-core {:mvn/version "1.17.1"}
               pro.juxt.crux/crux-lmdb {:mvn/version "1.17.1"}
               com.taoensso/nippy      {:mvn/version "3.1.1"}

[2021-07-29 12:17:07.334 - WARNING] :shadow.cljs.devtools.server.nrepl-impl/init-ns-ex - {:init-ns sheluchin.user}
Note: The following stack trace applies to the reader or compiler, your code was not executed.
CompilerException Syntax error compiling at (clojure/tools/namespace/file.clj:39:26). #:clojure.error{:phase :compile-syntax-check, :line 39
, :column 26, :source "clojure/tools/namespace/file.clj"}
        clojure.lang.Compiler.analyze (Compiler.java:6808)
        clojure.lang.Compiler.analyze (Compiler.java:6745)
        clojure.lang.Compiler$InvokeExpr.parse (Compiler.java:3820)
        clojure.lang.Compiler.analyzeSeq (Compiler.java:7109)
        clojure.lang.Compiler.analyze (Compiler.java:6789)
        clojure.lang.Compiler.access$300 (Compiler.java:38)
        clojure.lang.Compiler$LetExpr$Parser.parse (Compiler.java:6384)
        clojure.lang.Compiler.analyzeSeq (Compiler.java:7107)
        clojure.lang.Compiler.analyze (Compiler.java:6789)
        clojure.lang.Compiler.analyzeSeq (Compiler.java:7095)
        clojure.lang.Compiler.analyze (Compiler.java:6789)
        clojure.lang.Compiler.analyze (Compiler.java:6745)
Caused by:
RuntimeException No such var: parse/deps-from-ns-decl
        clojure.lang.Util.runtimeException (Util.java:221)
        clojure.lang.Compiler.resolveIn (Compiler.java:7388)
        clojure.lang.Compiler.resolve (Compiler.java:7358)
        clojure.lang.Compiler.analyzeSymbol (Compiler.java:7319)
        clojure.lang.Compiler.analyze (Compiler.java:6768)
        clojure.lang.Compiler.analyze (Compiler.java:6745)
[2021-07-29 12:17:07.421 - WARNING] :shadow.cljs.devtools.server.nrepl-impl/init-ns-ex - {:init-ns sheluchin.user}
Note: The following stack trace applies to the reader or compiler, your code was not executed.
CompilerException Syntax error compiling at (sheluchin/user.clj:1:1). #:clojure.error{:phase :compile-syntax-check, :line 1, :column 1, :sou
rce "sheluchin/user.clj"}
        clojure.lang.Compiler.load (Compiler.java:7648)
        clojure.lang.RT.loadResourceScript (RT.java:381)
        clojure.lang.RT.loadResourceScript (RT.java:372)
        clojure.lang.RT.load (RT.java:459)
        clojure.lang.RT.load (RT.java:424)
        clojure.core/load/fn--6839 (core.clj:6126)
        clojure.core/load (core.clj:6125)
        clojure.core/load (core.clj:6109)
        clojure.core/load-one (core.clj:5908)
        clojure.core/load-one (core.clj:5903)
        clojure.core/load-lib/fn--6780 (core.clj:5948)
        clojure.core/load-lib (core.clj:5947)
Caused by:
IllegalAccessError set-refresh-dirs does not exist
        clojure.core/refer (core.clj:4249)
        clojure.core/refer (core.clj:4217)
        clojure.core/apply (core.clj:667)
        clojure.core/load-lib (core.clj:5966)
        clojure.core/load-lib (core.clj:5928)
        clojure.core/apply (core.clj:667)
        clojure.core/load-libs (core.clj:5985)
        clojure.core/load-libs (core.clj:5969)
        clojure.core/apply (core.clj:667)
        clojure.core/require (core.clj:6007)
        clojure.core/require (core.clj:6007)
        sheluchin.user/eval61143/loading--6721--auto----61144 (user.clj:1)

missing tools-ns repl

in deps

I have:

org.clojure/tools.namespace {:mvn/version "0.2.11"}

but under an alias you're giving to shadow?

:aliases     {:dev {:extra-paths     ["src/dev"]
                     :extra-deps      {org.clojure/clojurescript {:mvn/version "1.10.742"}
                                       thheller/shadow-cljs      {:mvn/version "2.11.23"}
                                       binaryage/devtools        {:mvn/version "0.9.10"}
                                       ; for reloading namespaces at runtime
                                       org.clojure/tools.namespace {:mvn/version "0.2.11"}
                                       cider/piggieback          {:mvn/version "0.4.1"}
                                       fulcrologic/fulcro-spec   {:mvn/version "3.1.4"}
                                       com.fulcrologic/guardrails {:mvn/version "1.1.0"}
                                       ; FIXME: duplicate from top-level :deps. Figure out
                                       ; which one is better to keep
                                       hashp/hashp               {:mvn/version "0.2.0"}}}

does your require actually refer that function?

try loading your user NS in a plain clj repl

It does refer that function:

(ns sheluchin.user
  (:require
    [sheluchin.server.db.mounts :as crux]
    [sheluchin.server :as server :refer [http-server]]
    ; [shadow.cljs.devtools.api :as shadow]
    [clojure.tools.namespace.repl :as tools-ns :refer [set-refresh-dirs refresh]]
    [mount.core :as mount]
    [taoensso.timbre :as log]))
    ; [hashp.core :include-macros true]))

(set-refresh-dirs "src/dev" "src/app" "src/test")

(defn start []
  (mount/start #'sheluchin.server.db.mounts/crux-node
               #'sheluchin.server/http-server))

(defn restart
  "Stop the server, reload all source code, then restart the server.

  See documenation of tools.namespace.repl for more information"
  []
  (log/info "Restarting HTTP server and related services")
  (mount/stop)
  ;; TODO: fix? Not sure, most example use this thing but I keep getting
  ;;       this error when I do:
  ;;       
  ; (refresh :after 'sheluchin.user/start)
  (mount/start))

your shadow-cljs.edn file have the :dev alias in it?

{:deps {:aliases [:dev]}

clj -A:dev
Clojure 1.10.1
(require 'sheluchin.user)
nil
user=>

I don't know what iced is doing to you...have you run shadow-cljs server by itself?

I don't use that tool, but my guess is that it is messing with classpath in a way you don't expect

If iced is running shadow for you, then it also needs to know the deps you want to set. shadow cannot change the classpath if iced is running the jvm

Hmm :thinking_face: I'm under the impression that it does manage deps properly because after updating deps.edn and restarting, I get messages like:

$ iced repl :main --force-shadow-cljs --with-cljs -A:dev

OK: CLJS option is enabled.
OK: shadow-cljs project is detected
OK: For shadow-cljs project, start watching instead of starting REPL.
shadow-cljs - config: project/shadow-cljs.edn  cli version: 2.8.64  node: v12.18.0
shadow-cljs - starting via "clojure"
Downloading: org/lwjgl/lwjgl/3.2.3/lwjgl-3.2.3.jar from central
Downloading: com/github/jnr/jnr-a64asm/1.0.0/jnr-a64asm-1.0.0.jar from central
Downloading: org/lwjgl/lwjgl-lmdb/3.2.3/lwjgl-lmdb-3.2.3-natives-macos.jar from central
Downloading: pro/juxt/crux/crux-lmdb/1.17.1/crux-lmdb-1.17.1.jar from central
Downloading: com/github/jnr/jnr-x86asm/1.0.2/jnr-x86asm-1.0.2.jar from central
Downloading: com/github/jnr/jffi/1.2.17/jffi-1.2.17.jar from central
Downloading: org/lwjgl/lwjgl-lmdb/3.2.3/lwjgl-lmdb-3.2.3-natives-linux.jar from central
Downloading: org/lwjgl/lwjgl/3.2.3/lwjgl-3.2.3-natives-linux.jar from central
WARNING: Use of -A with clojure.main is deprecated, use -M instead
shadow-cljs - HTTP server available at 

but is that -A:dev sent to shadow or for iced?

that's all I know about it, so afraid I cannot help more.

I'm just guessing, and don't have any more of those 😛

Thanks, I'll look into your suggestions some more.

@UPWHQK562 not sure if you’re working with RAD, but the fulcro-rad-demo has some Crux example code https://github.com/fulcrologic/fulcro-rad-demo#running-an-crux-based-server-alpha-quality

@UCHV4JZ7A thanks, I've been using the PR for that as reference https://github.com/fulcrologic/fulcro-rad-demo/pull/24/files I think I have all the main parts copied over, but OFC, I could be missing something. At this point I do think it probably has something to do with my use of vim-iced, but I seem to be following the instructions for that as described here https://github.com/liquidz/vim-iced/issues/350#issuecomment-878606923, but still not getting much luck. The errors are inconsistent, but always similar, so that makes it all the more confusing for a newbie like me. My latest is:

$ iced repl --force-shadow-cljs :main
OK: CLJS option is enabled.
OK: shadow-cljs project is detected
OK: For shadow-cljs project, start watching instead of starting REPL.
shadow-cljs - config: project/shadow-cljs.edn
shadow-cljs - starting via "clojure"
shadow-cljs - HTTP server available at 
shadow-cljs - server version: 2.11.23 running at 
shadow-cljs - nREPL server started on port 9000
shadow-cljs - watching build :main
[:main] Configuring build.
[:main] Compiling ...
GUARDRAILS IS ENABLED. RUNTIME PERFORMANCE WILL BE AFFECTED.
Mode: :runtime  Async? false  Throw? false
Guardrails was enabled because the CLJS Compiler config enabled it
[:main] Build completed. (309 files, 0 compiled, 0 warnings, 15.85s)


Warning: resetting Nippy thaw for custom type with id: :crux.codec/edn-id
Warning: resetting Nippy thaw for custom type with id: :crux.codec/id
[2021-07-29 14:16:43.377 - WARNING] :shadow.cljs.devtools.server.nrepl-impl/init-ns-ex - {:init-ns sheluchin.user}
Note: The following stack trace applies to the reader or compiler, your code was not executed.
CompilerException Syntax error compiling at (mount/core.cljc:1:1). #:clojure.error{:phase :compile-syntax-check, :line 1, :column 1, :source
 "mount/core.cljc"}
        clojure.lang.Compiler.load (Compiler.java:7648)
        clojure.lang.RT.loadResourceScript (RT.java:381)
        clojure.lang.RT.loadResourceScript (RT.java:372)
        clojure.lang.RT.load (RT.java:459)
        clojure.lang.RT.load (RT.java:424)
        clojure.core/load/fn--6839 (core.clj:6126)
        clojure.core/load (core.clj:6125)
        clojure.core/load (core.clj:6109)
        clojure.core/load-one (core.clj:5908)
        clojure.core/load-one (core.clj:5903)
        clojure.core/load-lib/fn--6780 (core.clj:5948)
        clojure.core/load-lib (core.clj:5947)
Caused by:
IllegalAccessError on-error is not public
        clojure.core/refer (core.clj:4249)
        clojure.core/refer (core.clj:4217)
        clojure.core/apply (core.clj:667)
        clojure.core/load-lib (core.clj:5966)
        clojure.core/load-lib (core.clj:5928)
        clojure.core/apply (core.clj:667)
        clojure.core/load-libs (core.clj:5985)
        clojure.core/load-libs (core.clj:5969)
        clojure.core/apply (core.clj:667)
        clojure.core/require (core.clj:6007)
        clojure.core/require (core.clj:6007)
        mount.core/eval71118/loading--6721--auto----71120 (core.cljc:1)

Here's the segment I'm looking at:

(defsc TopChrome [this {:root/keys [router current-session login]}]
  {:query         [{:root/router (comp/get-query TopRouter)}
                   {:root/current-session (comp/get-query Session)}
                   [::uism/asm-id ::TopRouter]
                   {:root/login (comp/get-query Login)}]
   :ident         (fn [] [:component/id :top-chrome])
   :initial-state {:root/router          {}
                   :root/login           {}
                   :root/current-session {}}}
  (let [current-tab (some-> (dr/current-route this this) first keyword)]
    (div :.ui.container
      (div :.
        (dom/a :.item {:classes [(when (= :main current-tab) "active")]
                       :onClick (fn [] (dr/change-route this ["main"]))} "Main")
        (dom/a :.item {:classes [(when (= :settings current-tab) "active")]
                       :onClick (fn [] (dr/change-route this ["settings"]))} "Settings")
        (div :.
          (ui-login login)))
      (div :.ui.grid
        (div :.ui.row
          (ui-top-router router))))))

I originally thought I needed to add the images to the TopChrome query, but it doesn't look like that query corresponds to the items in the menu

I know routers use a union query but how does it decide which query to use?

Still working toward that critical mass of understanding where I can start to figure things out for myself. I finished @U0522TWDA's excellent fulcro exercises without any problems but this template (and me wanting to add routing) seems to add a lot of new things that I'm having trouble sorting through. Appreciate any help you can lend, will def pay it forward!

So, the TopChrome needs to know nothing about the images, because it does not render them

I assume you've composed your Gallery target INTO the TopRouter, and that your Gallery has an ident and SOME kind of initial state

say [:component/id ::Gallery]. That component also probably has a query like :query [{:gallery/images (comp/get-query Image)}] and initial state maybe :initial-state {:gallery/images []}

You'd have a resolver (with some kind of made-up keyword), say :all-images with NO ::pc/input, and an output of something like [:image/url :image/label] (matching whatever the query of Image component needs).

that resolver would return something like {:all-images [{:image/url "..." :image/label "..."} ...]}

then you just issue a load like: (df/load! app :all-images Image {:target [:component/id ::Gallery :gallery/images]})

(dr is not using a union query, BTW, it uses dynamic queries)

I'm imagining an Image component:

(defsc Image [this {:image/keys [label url]}]
  {:query [:image/url :image/label]
   :ident :image/url ; will cause the images to normalize by their URL
  }
  (dom/img {:src url}))

no initial state needed on that one, since there's nothing to know in advance (they are loaded

The take-away is this: Fulcro does have you compose things globally (you end up with a global query and initial state, and you have a normalized db containing all data), BUT, very importantly, Fulcro does not complect that with your ability to reason locally, and refactor freely. Thus, most real concerns in your app will be local to a component. Thus, the Gallery component only has to think about what it is doing (composing in images and asking them to render), and the Image component only has to worry about rendering an image. Loading is always an external concern (and IMO should not be complected with UI lifecycle like :componentDidMount). WHEN you issue a gallery load is probably more related to routing or another user event than rendering. The rendering might coincide with those events, but it isn't the same as them.

When you refactor (e.g. move the Gallery to a new router) you don't have to touch the load, Image, or internals of Gallery itself at all: they are tied to the ident which doesn't change

So, when you ask about TopChrome when talking about some far-off child concern, it is a red flag 🙂. You should not have to know anyting about that there.

The UI State Machine stuff was added to the library after realizing (over and over) that we would like something apart from rendering that can control the lifecycle of some group of components (like your gallery, where the loading, paginating, etc. are complicated concerns having to do with actions done to the Gallery itself).

Redux/Reframe has you code these as events that evolve state. Fulcro uses mutations, which are often sufficient (e.g. a show-gallery mutation can change the route and load the images). In fact, I'd say that plain mutations with composition of helpers gets you most of the way there a lot of the time. UISM is handy when things get more complicated. See the source of Fulcro RAD reports or forms, or Dynamic Routers (these all use UISM). These systems could have been written with separate mutations, but the state machine gives a nice reusable grouping of functionality that can be tied to UI separately, and is easier to see the connections between operations that are valid in various states.

wow thanks! I got my gallery of images showing! still parsing your replies for the deeper understanding, but your comment that TopChrome should have nothing to do with images got me to focus on the right things, gallery and image component queries. I read on a previous thread that composition was important so I was trying to find some connection between parent and child elements that didn't exist, guess things were more decoupled than I thought 🙂 and thanks for pointing out that dynamic router actually uses dynamic queries and not union queries, I think I mistook it with the TopChrome query (which is a union query I believe), and that added to the confusion

still learning state machines (I've read the section in the guide but will probably need to read it a few more times), and I might have a question or two about it down the road.

I'm 99% certain you are not using union queries anywhere 😄

why did you think it used union query? And the connection from parent to child is there - TopChrome includes the query of the router which includes the queries of its targets...No? A nice way to load data into a router target is its :will-enter with deferred routing.

union queries are maps (right?) and i thought the TopChrome query was that, but on second look it's actually a vector of maps. still getting used to the syntax.

yes the connection is there but it's more implicit in the relationship between the entities and not spelled out, i.e. the parent doesn't have to get all the data for the child which is what i'm used to from other frameworks

thanks for the tip on :will-enter , fits my use case

any tips on how to clarify the parent-child relationship / composition in the Minimalist Fulcro Tutorial is most appreciated :)

Giving a little more context: A report/form in RAD can have controls. Those controls result in data that is co-located with the report/form as ui parameters. Sometimes you want to initialize one or more of these "on entry". Triggering a set-ui-parameters event on the ident of a report is how you'd send one or more values into those controls. Triggering a run event causes the report to load/filter/sort. So, the load! you're showing is not needed. The report will do that part when you run it. NOTE: report/start-report! does these for you (and starts the machine, which is required, if it isn't), so you should probably use that instead. If the report is already started, it will do the steps you're listing...though you are allowed to do those manually if you wish.