Clojurescript/Reagent 单元测试组件 - 模拟 onChange答案

【问题标题】：Clojurescript/Reagent Unit testing component - simulate onChangeClojurescript/Reagent 单元测试组件 - 模拟 onChange
【发布时间】：2015-12-19 08:01:31
【问题描述】：

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

(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"}}))

但它不起作用......

【问题讨论】：

标签： jquery unit-testing clojurescript reagent

【解决方案1】：

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

另外，请查看试剂测试本身以获取灵感： https://github.com/reagent-project/reagent/blob/master/test/reagenttest/testreagent.cljs

【讨论】：

嗨，迈克，我实际上在使用。 jayq 作为 jQuery 包装器。我确实发现了关于重新框架测试的文章，我需要仔细看看它。谢谢
提供的链接用于试剂单元测试。与重新框架无关。
抱歉，我没看到。谢谢

【解决方案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"]]

【讨论】：