Fork me on GitHub
Robert Brotherus09:03:28

I am a long-time user of re-frame and now wanted to try to the Karma-integration with cljs.test. Just created new project from the re-frame template with +test:

lein new re-frame verto_gui +garden +10x +test
Then, according to the instructions in the, started auto-reload and karma in another cmd:
npm install
npm run watch
karma start
I see the tests being executed ok:
Chrome Headless 99.0.4844.51 (Windows 10) verto-gui.core-test fake-test FAILED                                                       
        FAIL in   (fake-test) (verto_gui/core_test.cljs:7:9)
        "fake description"
        expected: (=
However, when I make any change to the core_tests.cljs, eg. editing "fake description" to "fake description 2", the subsequent reload produces error:
16 03 2022 09:29:47.135:INFO [filelist]: Changed file "C:/dev/verto_gui/target/karma-test.js".
(node:5640) [log4js-node-DEP0004] DeprecationWarning: Pattern %d{DATE} is deprecated due to the confusion it causes when used. Please use %d{DATETIME} instead.
Chrome Headless 99.0.4844.51 (Windows 10) ERROR
  Uncaught SyntaxError: missing ) after argument list
  at karma-test.js:33653:588
I wonder if there is something I can do to prevent this? Or is this some bug in the framework? Since this happens with completely vanilla re-frame project from the template, it should be easily reproduced if someone is interested.


Are you sure the file you saved has all () paired? Because the error certainly looks like there are more ( than there are ). And I cannot reproduce that error by making a proper change to the file.


Although, that error is not a compilation one, so it's probably not about balancing CLJS parens...

👍 1

I would try opening karma-test.js to see what's at that location.


If you make another change, does the behavior repeat?


As a guess, it could've been a race condition if the JS bundle is written to disk gradually. So the compiler starts writing JS, Karma detects the change and loads the file - all while that JS is still being written.

Robert Brotherus10:03:24

With some additional tries, there seems to be indeed some randomness. On most tries I get the same error about parenthesis, occasionally another syntax error:

Chrome Headless 99.0.4844.51 (Windows 10) ERROR
  Uncaught SyntaxError: Unexpected end of input
  at karma-test.js:47546:3

  SyntaxError: Unexpected end of input

Robert Brotherus10:03:01

And indeed in some cases works also without error. So could be race-condition that is surfacing on the specific timing characteristics of my system


Just in case - even though Slack embeds a preview of that message, you should still follow that link as there's a workaround posted right below the message.

Robert Brotherus10:03:20

I tried setting autoWatchBatchDelay to high value (10000 ie 10 secs) but in this case it does not seem to resolve the problem.

16 03 2022 12:27:19.815:INFO [filelist]: Changed file "C:/dev/verto_gui/target/karma-test.js".
(node:12476) [log4js-node-DEP0004] DeprecationWarning: Pattern %d{DATE} is deprecated ...
**** 10 sec delay here ****
Chrome Headless 99.0.4844.51 (Windows 10) ERROR
  Uncaught SyntaxError: Invalid or unexpected token
  at karma-test.js:43396:1
  SyntaxError: Invalid or unexpected token
The locations and types of syntax errors still vary randomly but inspecting karma-test.js shows no visible errors at the reported location.

Robert Brotherus10:03:22

To eliminate possible sources from dangling processes and IDE (I use IntelliJ + Cursive) I rebooted and started the build with minimal environment and no IDE. With the "npm run watch" and "karma start" running I get from subsequent minimal modifications to the test-code still errors at random locations:

16 03 2022 12:47:18.458:INFO [filelist]: Changed file "C:/dev/verto_gui/target/karma-test.js".
Chrome Headless 99.0.4844.51 (Windows 10) ERROR
  Uncaught SyntaxError: Unexpected end of input
  at karma-test.js:15043:19
  SyntaxError: Unexpected end of input

16 03 2022 12:47:38.697:INFO [filelist]: Changed file "C:/dev/verto_gui/target/karma-test.js".
Chrome Headless 99.0.4844.51 (Windows 10) ERROR
  Uncaught SyntaxError: Unexpected end of input
  at karma-test.js:10802:25
  SyntaxError: Unexpected end of input

16 03 2022 12:47:53.410:INFO [filelist]: Changed file "C:/dev/verto_gui/target/karma-test.js".
Chrome Headless 99.0.4844.51 (Windows 10) ERROR
  Uncaught SyntaxError: Unexpected end of input
  at karma-test.js:19463:1
  SyntaxError: Unexpected end of input

Robert Brotherus11:03:54

Thanks for the suggestions @U2FRKM4TW! At least we have some understanding on the nature of the issue now. I am using Windows 11, but perhaps there are similar caching issues

👍 1
Robert Brotherus11:03:10

Pity the problem does not reproduce as readily with other users as I thought, but I understand that timing-related issues can depend in a subtle way on the characteristics of ones computer, OS, etc


In addition, that's something that other users might not even be using at all. E.g. my UI tests are run with shadow-cljs during local development. And even if I were using Karma for CI, it would not be a problem as well because there wouldn't be any watchers, thus no chance of race conditions.

👍 1
Robert Brotherus12:03:57

Ah! The usePolling: true seems to fix the problem for me! 😀 This was hinted by the second link . Although the text there suggested that Karma reverted to the polling as the default behavior, perhaps they have re-reverted to events later and therefore usePolling: true can still help (although that parameter does not seem to be even documented at ) Thanks even more!


Great! Glad you got it figured out.


Would it be possible to connect the REPL to a production CLJS app?


you could ship self-hosted cljs, but that dramatically increases the bundle size


> to e.g. emit re-frame events? If you have a very narrow scope of what you want to do in such a REPL, you can simply define and export it as a set of CLJS functions that you would then be able to call from JS.


Say I have a server rendered Hiccup site, and would like to add two different CLJS scripts to two different pages. Is it possible to generate JS output in such a way that all the code that's common to both scripts are in one file, and the page-specific parts are in separate files?


This would allow me to load and cache common.js on both pages, meaning faster load time for the other page.


yes, this is possible


w00t! 🎉


I have a function that performs a slow computation and returns some data. How can I make this function run at compile-time instead of at runtime? Running it in Clojure is fine, so I suppose I should be able to wrap it in a macro?


How would I actually do that though?


just doing (def my-macro [] (my-fn)) and (def my-data (my-macro)) doesn't seem to work


@U15RYEQPJ What you did above should almost work. Have you tried (defmacro my-macro [] (my-fn))?


You can check with macroexpand-1 e.g. (macroexpand-1 (my-macro))


yeah thanks, I managed to get it working