Clojurescript / Reagent Unit测试组件 – 模拟onChange

对于我有文本框的组件，我需要能够从测试中更改其中的文本：

(defn choose-city-component [] (let [inner-state (r/atom {:text ""})] (fn [] [:div [:input#txt_city { :type "text" :value (@inner-state :text) :on-change #(swap! inner-state assoc :text (-> % .-target .-value))... 

在测试中，我在屏幕上渲染它：

 (deftest choose-city-component-test-out ;;GIVEN render component in test (let [comp (r/render-component [w/choose-city-component] (. js/document (getElementById "test")))] ;;WHEN changing the city.... 

现在使用jQuery触发器我试图在文本上模拟onChange：

我们尝试了

 (.change ($ :#txt_city) {"target" {"value" "Paris"}}) 

和

 (.trigger ($ :#txt_city) "change" {"target" {"value" "Paris"}})) 

但它不起作用……

Answer 1

我不太了解jQuery，但是你的代码不应该更像(js/$ "#txt_city") （注意：参数是字符串，而不是关键字）。

另外，请试试试剂本身的灵感： https ： //github.com/reagent-project/reagent/blob/master/test/reagenttest/testreagent.cljs

Answer 2

答案是cljs-react-test：

 (deftest choose-city-component-test-out (let [comp (r/render-component [w/choose-city-component] (. js/document (getElementById "test"))) expected-invocations (atom [])] (with-redefs [weather-app.core/fetch-weather #(swap! expected-invocations conj %)] ;;GIVEN render component in test ;;WHEN changing the city and submitting (sim/change (sel1 :#txt_city) {:target {:value "london"}}) (sim/click (sel1 :#btn_go) nil) ;;ASSERT london should be sent to fetch-weather (is (=["london"] @expected-invocations)) ))) 

我们在哪里使用：

  [cljs-react-test.simulate :as sim] [dommy.core :as dommy :refer-macros [sel1 sel]] 

并在project.clj

  :dependencies [[org.clojure/clojure "1.7.0"] [org.clojure/clojurescript "1.7.170"] [org.clojure/core.async "0.2.374"] [reagent "0.5.1" :exclusions [cljsjs/react]] [cljs-react-test "0.1.3-SNAPSHOT"] [cljsjs/react-with-addons "0.13.3-0"] [cljs-ajax "0.5.2"] [jayq "2.5.4"]]