Thanks a lot for your comforting words!
Here is the test code I started to write couple of months ago which did not
work: I could not manage to trigger onChange event. Is it really not
triggerable programatically?
(ns capital-match.users-test
(:require-macros [cemerick.cljs.test
:refer (is deftest with-test run-tests testing test-var
done)]
[cljs.core.async.macros :refer [go]]
[dommy.macros :refer [node sel sel1]])
(:require [cemerick.cljs.test :as t]
[capital-match.user.registration :as u]
[om.core :as om :include-macros true]
[om.dom :as dom :include-macros true]
[cljs.core.async :refer [chan <! >! pub sub]]
[dommy.utils :as utils]
[dommy.core :as dommy]))
(defn simulate-click-event
"From
https://github.com/levand/domina/blob/master/test/cljs/domina/test.cljs";
[el]
(let [document (.-document js/window)]
(cond
(.-click el) (.click el)
(.-createEvent document) (let [e (.createEvent document "MouseEvents")]
(.initMouseEvent e "click" true true
js/window 0 0 0 0 0
false false false false 0
nil)
(.dispatchEvent el e))
:default (throw "Unable to simulate click event"))))
(defn simulate-change-event
"From
https://github.com/levand/domina/blob/master/test/cljs/domina/test.cljs";
[el]
(let [document (.-document js/window)]
(cond
(.-onChange el) (do (print "firing on change on " el) (.onChange el))
(.-createEvent document) (let [e (.createEvent document "HTMLEvents")]
(print "firing " e " on change on " (.-id
el))
(.initEvent e "change" true true)
(.dispatchEvent el e))
:default (throw "Unable to simulate change event"))))
(def sink
"contains a channel that receives messages along with notification type"
(chan))
;; see
http://yobriefca.se/blog/2014/06/04/publish-and-subscribe-with-core-dot-asyncs-pub-and-sub/
(def source
(pub sink #(:topic %)))
(defn change-field!
[id value]
(let [el (sel1 (keyword (str "#" id)))]
(dommy/set-value! el value)
(simulate-change-event el)
))
(deftest ^:async password-confirmation
(testing "do not submit if passwords are not equal"
(let [subscription (chan)]
(sub source :user-registration subscription)
(om/root
(partial u/registration-view source sink)
nil
{:target (sel1 :#view)})
(go
(let [m (<! subscription)]
(is (= :error (:state m)))
(done)
))
(change-field! "userRequestedEmail" "[email protected]")
(change-field! "userRequestedPassword" "secret")
(change-field! "confirmPassword" "nosecret")
(simulate-click-event (sel1 :#submitRegistration))
)))
The component is mounted on a dedicated DOM node which is part of the test
HTML.
I would like to be able to test this without a browser, e.g. using
something like phantomjs, in order to run all tests as part of build of the
system the UI is part of. We currently have setup ETE testing using
selenium w/in docker components so it would not be a big deal to use that
to run "unit" tests too but these kind of tests are slow and selenium is
somewhat brittle (although it too has improved and seems a lot more stable
now than it was couple of years ago...).
Do you have an example test available that I could get inspiration from? I
am not using reagent but I guess it should be possible to use React
testutils with Om, I simply don't seem to understand how to do this...
Thanks a lot
--
Arnaud Bailly
twitter: abailly
skype: arnaud-bailly
linkedin: http://fr.linkedin.com/in/arnaudbailly/
On Fri, Dec 26, 2014 at 12:53 AM, <[email protected]> wrote:
> Hi Arnaud,
>
> I feel your pain. I've been developing with cljs nearly from the beginning
> (though as a newbie to Clojure) and the road has been bumpy but plenty
> rewarding. My advice is to stay at it; your flow will improve and the
> language and tooling have been improving a lot, too.
>
> I'll speak to a couple points about testing. I'm far from a veteran but
> with a couple apps undergoing heavy refactoring I've felt the pain of
> components breaking b/c of subtle changes to data structures, so I've been
> exploring this a bit.
>
> In terms of testing, I am using React.addons.TestUtils.Simulate (I use
> react-with-addons.js in development, which includes it), and it is vital
> for being able to test components, because JavaScript event handlers like
> 'onChange' aren't triggered programmatically. Also I should note I'm using
> reagent, allowing me to be explicit about passing references to state in as
> a parameter(s), which makes mocking simple. Finally I've made a component
> mounting macro that just creates and tears down a DOM node target just for
> the test. The result of this is that I can pass a certain state in to a
> component, simulate some clicks, input, or external state change, and then
> inspect the resulting state in the test. I am using simple (assert ...)'s
> and run my tests in a separate tests.html (which refreshes on every
> compilation via ring-refresh). Failing asserts point right to the failure
> in devtools with sourcemaps enabled and change the favicon for a quick
> visual indicator w/o having to switch tabs.
>
> So like I said, keep at it and I'm sure you'll find your flow. A lot is
> already possible.
> M
>
> --
> Note that posts from new members are moderated - please be patient with
> your first post.
> ---
> You received this message because you are subscribed to a topic in the
> Google Groups "ClojureScript" group.
> To unsubscribe from this topic, visit
> https://groups.google.com/d/topic/clojurescript/7o7tX7ktOvM/unsubscribe.
> To unsubscribe from this group and all its topics, send an email to
> [email protected].
> To post to this group, send email to [email protected].
> Visit this group at http://groups.google.com/group/clojurescript.
>
--
Note that posts from new members are moderated - please be patient with your
first post.
---
You received this message because you are subscribed to the Google Groups
"ClojureScript" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/clojurescript.
