Come possiamo eseguire i test unitari contro la manipolazione DOM?

Question

L'introduzione a QUnit oltre a netTuts.com genera uno scambio interessante (mai risolto) su come applicare i test di unità contro le azioni che manipolano il DOM. La seguente citazione (Alex York) arriva al punto cruciale:

Quanto sarebbe bello è che se si ha una funzione come questa:

funzione add (a, b) {var result = a + b; $ ("input # ResultTestBox"). Val (risultato);

Nel test di cui sopra, mi piacerebbe prova di due cose: l'aggiunta di un e B, e il risultato correttamente essere messo in un elemento DOM. Mi piacerebbe provare il secondo fornendo un po 'di codice HTML. Possibile?

Ma, come ho detto ... irrisolto. Risolvibile?

Answer 1

L'ultima versione di QUnit supporta un elemento #qunit-fixture che consente di aggiungere HTML alla pagina Web QUnit.

Ad esempio, nel codice HTML:

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

e nel tuo JavaScript:

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

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

Answer 2

È possibile eseguire in env.js, se non si desidera che il fastidio di creare sandbox pagina html per tutti i tuoi test

Answer 3

Sicuramente quello che in realtà interessa è che il metodo val viene chiamato sul valore di ritorno di $(“input#ResultTestBox”) -Tu non hanno bisogno di verificare la funzionalità del metodo jQuery stesso. Perché non iniettare un'implementazione fittizia dell'oggetto jQuery e testarlo?