Вывод и поведение компонента модульного тестирования Clojurescript/Reagent

Мы использовали React уже около года с неизменяемыми данными, что очень впечатляет. Теперь мы хотим перейти к Clojurescript/Reagent, но нам нужен очень хороший способ протестировать наш код. Для компонентов это то, что мы сделали:

  1. Протестируйте вывод компонента в зависимости от отправленных реквизитов:
  2. Проверьте, что компонент вызывает правильные функции и с правильными параметрами, когда происходит событие, такое как щелчок.

Для 1 это будет так:

function renderFFC(filters, search_criterias)
{
    return TestUtils.renderIntoDocument(React.createElement(FilterIntervalNumberComponent,{filter:filters, search_criteria:search_criterias}));
}

describe("IN", function(){
    it("should render search criteria - interval", function() {
        var criterias = {};
        var ffc = renderFFC(filter, criterias);
        expect(ffc.refs[0].getDOMNode().value).toBeNull();
        expect(ffc.refs[1].getDOMNode().value).toBeNull();
     });

Для 2 это будет что-то вроде:

describe("OUT", function(){
    it("should change the values, then click - boolean ", function() {
        //mock function
        set_criteria_and_search = jest.genMockFunction();

        var fbc = renderFBC(filter, {});

        React.addons.TestUtils.Simulate.change(fbc.refs.yes.getDOMNode(),{nativeEvent: {target: {value: true}}});

        expect(controller.set_criteria_and_search.mock.calls)
          .toEqual(
                    [['taxes_applied',{'taxes_applied':[{value:"1"}]}]]
                );
     });

Мы использовали facebook Jest для тестов.

Как мне сделать то же самое в Clojurescript с помощью Reagent, желательно с автоматическим запуском тестов?


reactjs unit-testing jestjs clojurescript reagent
person Dan Bunea    schedule 09.12.2015    source источник
comment
С нетерпением жду ответа. Попробуйте с шаблоном Lein реагент и посмотрите, что они настроили. Не забудьте параметр +test github.com/regent -проект/реагент-шаблон/блоб/мастер/   -  person Joaquin    schedule 10.12.2015
comment
По какой-то причине я не могу заставить +test работать. lein новое имя фигового колеса -- --реагент +тест??   -  person Dan Bunea    schedule 11.12.2015
comment
Это шаблон фигового колеса, который вы используете. Вместо этого используйте шаблон реагента: lein new reagent <name> +test   -  person Joaquin    schedule 11.12.2015
comment
Мне удалось заставить figwheel запускать мои тесты автоматически на второй вкладке. У меня пока нет тестов компонентов, и я изучаю различные сценарии того, как это сделать. Для тестов фигового колеса я смотрел youtube.com/watch?v=j-kj2qwJa_E. затем вдохновился изменением конфигурации из примера приложения: github.com/bhauman/crashverse.   -  person Dan Bunea    schedule 15.12.2015
comment
Ницца! Не могли бы вы опубликовать ответ с фрагментом конфигурации из project.clj? Это было бы полезно для людей, которые задаются вопросом в будущем!   -  person Joaquin    schedule 15.12.2015
comment
Настройте тестирование в проекте figwheel/reagent: 1. Добавьте тестовую сборку в project.cljs github.com/DanBunea/cljs-learning-weather-app/blob/master/ См. тест :cljsbuild и :aliases 2. Добавление test.html в resources/public github.com/DanBunea/cljs-learning- Weather-app/blob/master/ 3. Добавление test-runner и core.cljs github.com/DanBunea/cljs-learning-weather-app/tree/master/test/ 4. запуск обеих автосборок: lein figwheel dev test 2 вкладки в браузер: localhost:3449/index.html и localhost:3449/test.html   -  person Dan Bunea    schedule 16.12.2015
comment
Или посмотрите здесь: github.com/DanBunea/cljs-learning- погода-приложение/вики/   -  person Dan Bunea    schedule 16.12.2015
comment
В clojure существует очень активное сообщество slack. Там вы получите много ответов. Здесь не так много: clojurians.net   -  person Mike Thompson    schedule 18.12.2015
comment
Спасибо, Майк, я уже в деле. Мне нужно ответить на все мои вопросы, потому что теперь я нашел ответы :), может быть, кому-то они пригодятся.   -  person Dan Bunea    schedule 19.12.2015
comment
Я также опубликовал способ, которым мы начали тестировать компоненты, в этом вопросе: «Компонент модульного тестирования реагентов clojurescript имитирует onchange»> stackoverflow.com/questions/34368653/. В основном визуализируйте их на экране и проверяйте визуализированные элементы dom с помощью jquery, а также симулируя события.   -  person Dan Bunea    schedule 19.12.2015

Ответы (1)


arrow_upward
2
arrow_downward

Компоненты испытательного реагента:

Протестируйте выходные данные компонента. Для компонента:

 (defn weather-component [city temp country]
  [:div#weather
    [:h2#city {:on-click #(do-something 101)} city ]
    [:h3#temp temp]
    [:h3#contry country]])

Тест:

 (deftest weather-component-test-in
  ;;WHEN render component in test
  (let [comp (r/render-component [w/weather-component "Paris" 12]
                             (. js/document (getElementById "test")))]
    ;;ASSERT
    (is (= (d/html (sel1 :#city)) "Paris"))
    (is (= (d/html (sel1 :#temp)) "12"))))

Проверьте, что компонент вызывает правильные функции и с правильными параметрами, когда происходит событие, такое как щелчок

(deftest weather-component-test-out 
 (let [comp (r/render-component [w/weather-component "London" 0]
                             (. js/document (getElementById "test"))) 
    expected-invocations (atom [])] 
    (with-redefs [weather-app.core/do-something #(swap! expected-invocations conj %)] 
      (sim/click (sel1 :#city) {})
      (is (=[101] @expected-invocations)))))

Чтобы управлять домом и моделировать события:

[cljs-react-test "0.1.3-SNAPSHOT"] и домми (d/...)

person Dan Bunea    schedule 22.12.2015