2010-10-20 2 views
15

Введение в QUnit over at netTuts.com порождает интересный обмен (никогда не разрешенный) по поводу применения модульных тестов против действий, которые управляют DOM. Следующая цитата (Alex York) попадает в затруднении:Как мы можем выполнить модульные тесты против манипуляций с DOM?

Что бы приятно, что если у вас функция, как это:

функции дополнения (а, б) {результат вар = а + b; $ ("input # ResultTestBox"). Val (результат);

В вышеупомянутом тесте, я хотел бы тест две вещи: добавление и Ь, и результат правильно помещать его в элемент DOM. Мне бы хотелось проверить вторую вещь, предоставив некоторый макет HTML. Возможное?

Но, как я сказал ... неразрешенный. Разрешимы?

ответ

20

Последняя версия QUnit поддерживает элемент #qunit-fixture, который позволяет добавлять HTML-код на веб-страницу QUnit.

Например, в вашем HTML:

<ol id="qunit-tests"></ol> 
<div id="qunit-fixture">test markup, will be hidden</div> 

и в вашем JavaScript:

$('<input id="ResultTestBox" type="text"/>').appendTo('#qunit-fixture'); 
var result = add(a, b); 

equals(result, $('input#ResultTestBox').val(), "testing result box value"); 
+0

Как это модульное тестирование, когда вы на самом деле основываете его на реальных манипуляциях с dom? – Tushar

+2

@Tushar, который зависит от того, какое из 26 определений модульного тестирования вы используете. Пока тесты могут работать независимо друг от друга, они являются модульными тестами в соответствии с некоторыми определениями. (например, в книге «Test Driven Development By Example» от Kent Beck) – herman

0

Вы можете запустить их в env.js, если вы не хотите стычку создания HTML-страницы песочницы для все ваши тесты.

2

Конечно то, что вы на самом деле заботы о том, что метод val вызывается на возвращаемом значении $(“input#ResultTestBox”) -вым не нужно, чтобы проверить функциональность самого метода JQuery. Почему бы не ввести макетную реализацию объекта jQuery и не протестировать против этого?

+0

Как вы создаете объекты jQuery без потери самого jQuery? Как идея, но у меня проблемы с визуализацией того, как вы издеваетесь над кодом. – Sukima

+4

@Sukima, вы бы реорганизовали исходный код, чтобы объект '$' передавался как параметр, и по умолчанию это значение параметра jQuery. Затем в ваших модульных тестах вы передаете свой макет объекта –

+0

Mocking (по крайней мере, для вещей, отличных от удаленных вызовов, запросов к базе данных ...) является запахом кода. Если вы можете проверить результат вызова, а не осознать тот факт, что сам вызов произошел, что обычно намного лучше. – herman

Смежные вопросы