Clojurians Log v2

script tags execute in the order that they appear in the page so it should work

maybe if you list your source here, I can see what's going on

or do you mean a next javascript script tag?

<html>

<head>
      <script type="application/javascript"
            src=""></script>
      <script type="application/javascript"
            src=""></script>
      <script type="application/x-scittle">
      (require
      '[replicant.string :as s]
      '[clojure.edn :as edn]
      '[replicant.dom :as r])
      (println "I'm loading myself")
      (defn renderelm [elem hic]

      (def el (js/document.getElementById elem))
      (println elem)
      (println el)
      (r/render el (edn/read-string hic))
      )
      
      (set! (.-renderelem js/window) renderelm)

      </script>

</head>
<body>
      <div data-signals="{game_id: '', test_hiccup: '[:p &quot;iiiiihiii&quot;]'}"></div>
      <section class="section">
            <div class="container has-text-centered">
                  <div id="replicanttest" data-text="window.renderelem('replicanttest', $test_hiccup)"></div>
            </div>
      </section>
</body>
<script type="module" src=""></script>

</html>

the issue here is that datastar is probably earlier in processing the stuff than scittle has loaded stuff

exactly. But how come as the x-scittle stuff is in the head

because scittle doesn't control your whole html page and your browser

it might also be a datastar problem (maybe it doesn't allow access to custom properties)

scittle tags are processed on DOMContentLoaded https://github.com/babashka/scittle/blob/5b3a3acb5433a80b0e7560b559b050693115e018/src/scittle/core.cljs#L139

but you can fire that thing earlier if you want to

that would be nice! My alternative route would be to include datastar in x-scittle by manipulating the dom

you can just call scittle.core.disable_autoeval or whatever it's called and then call scittle.core.eval_script_tags before you even load datastar in the next script tag

in a javascript tag

before the x-scittle tags

or after

since they must appear in the page first

so maybe first list the x-scittle tags to ensure they exists. then disable auto eval in a javascript tag. then load scittle. then call eval-script-tags

no sorry. you must first load scittle since you need scittle to stop auto-eval

so: • scittle load tag • disable auto eval • list x-scittle tags • call scittle.eval_script_tags

and then load datastar

note that eval_script_tags is async for src="foo.cljs"

you can also defer datastar maybe with defer=true

this may also work:

<script type="module">
  await scittle.core.eval_script_tags();
  await import("");
</script>

trying that right now

this works, but the x-scittle is loaded twice (probably once again on dom loaded). I think I should be able to figure that out.

Probably just disable the auto-eval?

as I said earlier:

<script type="module">
  scittle.core.disable_auto_eval();
  await scittle.core.eval_script_tags();
  await import("");

</script>

Thanks a lot for your continuing help!

what you are seeing here is that datastar is setting the text of the replicant id element with the result of replicant.render (which is a dom element seemingly). interesting mix of technologies ;)

and doesn't work 🤣

well, it works, but probably not how you want it ;)

but what does work is to have another div which sets the target div content