-
Notifications
You must be signed in to change notification settings - Fork 7
Development
desdemona is an open source project and welcomes developers to join in. See CONTRIBUTING.md
to get started.
The front-end specific parts rely on Om (Next), a ClojureScript interface to ReactJS.
Typically, front-end development happens through figwheel. This tool gives you automatic code reloading when you're editing code or stylesheets, and automatically gives you a REPL that your editor can use. To run it, just run lein figwheel
. It will show you something like:
$ lein figwheel
Figwheel: Starting server at http://localhost:3449
Figwheel: Watching build - dev
Compiling "resources/ui/js/main.js" from ["src"]...
Successfully compiled "resources/ui/js/main.js" in 1.252 seconds.
Launching ClojureScript REPL for build: dev
Figwheel Controls:
(stop-autobuild) ;; stops Figwheel autobuilder
(start-autobuild [id ...]) ;; starts autobuilder focused on optional ids
(switch-to-build id ...) ;; switches autobuilder to different build
(reset-autobuild) ;; stops, cleans, and starts autobuilder
(reload-config) ;; reloads build config and resets autobuild
(build-once [id ...]) ;; builds source one time
(clean-builds [id ..]) ;; deletes compiled cljs target files
(print-config [id ...]) ;; prints out build configurations
(fig-status) ;; displays current state of system
Switch REPL build focus:
:cljs/quit ;; allows you to switch REPL to another build
Docs: (doc function-name-here)
Exit: Control+C or :cljs/quit
Results: Stored in vars *1, *2, *3, *e holds last exception object
Prompt will show when Figwheel connects to your application
Follow the instructions by navigating a browser to http://localhost:3449
and you should see the desdemona UI in development mode. Once you do, and you go back to the terminal where you ran lein figwheel
, you'll see a ClojureScript REPL:
To quit, type: :cljs/quit
cljs.user=>
You can test that you're talking directly to the browser by evaluating an expression such as (js/alert "Hello from the terminal!")
, which should cause an alert dialog box in the browser.
As usual, if you intend to use the terminal REPL directly (instead of using e.g. an IDE-provided REPL through nREPL or something), consider using rlwrap
(available through most package managers including Homebrew) like this: rlwrap lein figwheel
. This will give you libreadline-style line editing capability.
We use doo to facilitate running. To run all of the tests in real browsers, doo uses Karma, a test runner. Karma is distributed as an npm package, which needs to be installed first. To install the npm packages, run:
lein npm install
If you're familiar with npm, this is equivalent to just npm install
. This will install Karma and the required plugins. To run the tests once in Firefox:
$ lein doo firefox test once
;; ======================================================================
;; Testing with Firefox:
LOG: 'Testing desdemona.ui.core-test'
Firefox 44.0.0 (Mac OS X 10.11.0): Executed 1 of 1 SUCCESS (0.011 secs / 0.013 secs)
Typically, you want to run the tests continuously, and ideally even practice test-driven development whenever possible. To do that, simply elide the once
, like so:
> lein doo firefox test 17:10:19
Building ...
Reading analysis cache for jar:file:/Users/lvh/.m2/repository/org/clojure/clojurescript/1.7.228/clojurescript-1.7.228.jar!/cljs/core.cljs
Compiling src/desdemona/ui/core.cljs
Compiling test/desdemona/ui/core_test.cljs
Reading analysis cache for jar:file:/Users/lvh/.m2/repository/org/clojure/clojurescript/1.7.228/clojurescript-1.7.228.jar!/clojure/string.cljs
Reading analysis cache for jar:file:/Users/lvh/.m2/repository/org/clojure/clojurescript/1.7.228/clojurescript-1.7.228.jar!/cljs/pprint.cljs
Reading analysis cache for jar:file:/Users/lvh/.m2/repository/org/clojure/clojurescript/1.7.228/clojurescript-1.7.228.jar!/cljs/test.cljs
Compiling test/desdemona/ui/runner.cljs
Reading analysis cache for jar:file:/Users/lvh/.m2/repository/karma-reporter/karma-reporter/0.1.0/karma-reporter-0.1.0.jar!/jx/reporter/karma.cljs
Reading analysis cache for jar:file:/Users/lvh/.m2/repository/doo/doo/0.1.6/doo-0.1.6.jar!/doo/runner.cljs
Copying file:/Users/lvh/Projects/rackspace/desdemona/src/desdemona/ui/core.cljs to out/desdemona/ui/core.cljs
... done. Elapsed 1.055524177 seconds
[doo] Started karma server
;; ======================================================================
;; Testing with Firefox:
[doo] Started karma run
Watching paths: /Users/lvh/Projects/rackspace/desdemona/src, /Users/lvh/Projects/rackspace/desdemona/test
Change detected, recompiling ...
Compiling src/desdemona/ui/core.cljs
Compiling test/desdemona/ui/core_test.cljs
Compiling test/desdemona/ui/runner.cljs
Copying file:/Users/lvh/Projects/rackspace/desdemona/src/desdemona/ui/core.cljs to out/desdemona/ui/core.cljs
... done. Elapsed 0.105915272 seconds
;; ======================================================================
;; Testing with Firefox:
[doo] Started karma run
LOG: 'Testing desdemona.ui.core-test'
Firefox 44.0.0 (Mac OS X 10.11.0) desdemona.ui.core-test add-tests FAILED
Fail (add-tests) (cljs/test.js:371:11)
Expected (= (c/add 1 2) 3)
Actual: (not (= -1 3))
Firefox 44.0.0 (Mac OS X 10.11.0): Executed 1 of 1 (1 FAILED) (0 secs / 0.011 seFirefox 44.0.0 (Mac OS X 10.11.0): Executed 1 of 1 (1 FAILED) ERROR (0.017 secs / 0.011 secs)
Change detected, recompiling ...
Compiling src/desdemona/ui/core.cljs
Compiling test/desdemona/ui/core_test.cljs
Compiling test/desdemona/ui/runner.cljs
Copying file:/Users/lvh/Projects/rackspace/desdemona/src/desdemona/ui/core.cljs to out/desdemona/ui/core.cljs
... done. Elapsed 0.113700553 seconds
;; ======================================================================
;; Testing with Firefox:
[doo] Started karma run
LOG: 'Testing desdemona.ui.core-test'
Firefox 44.0.0 (Mac OS X 10.11.0): Executed 1 of 1 SUCCESS (0.013 secs / 0.01 secs)
As you can see, the tests are automatically re-ran whenever the code changes. This will also keep a separate Firefox open, so it shouldn't impact your normal work environment.