Cum se testează codul javascript cu qunit

Ce este QUnit

Dacă nu sunteți familiarizați cu ideea de "testare unitate", nu vă faceți griji - nu este nimic greu de înțeles:

"Testarea unităților este un proces de programare care vă permite să verificați corectitudinea modulelor individuale ale codului sursă al programului." Ideea este de a scrie teste pentru fiecare funcție sau metodă non-trivială. dacă următoarea modificare a codului a condus la regresie, adică la apariția erorilor în locațiile deja testate ale programului și facilitează, de asemenea, detectarea și eliminarea unor astfel de erori. "







Definiția este citată din Wikipedia. Doar efectuați teste pentru fiecare bloc funcțional al codului dvs. și dacă toate testele sunt transmise, puteți fi siguri că nu există erori (depinde în special de cât de bine sunt proiectate testele).

De ce să-mi testez codul

Dacă nu ați mai scris teste de unitate înainte, probabil că ați plasat codul direct pe serverul web, l-ați executat, ați urmat erorile și ați încercat să le eliminați așa cum au fost descoperite. Această metodă de lucru creează multe probleme.

În primul rând, aceasta este o ocupație foarte obositoare și plictisitoare. Verificarea în realitate este o sarcină foarte dificilă, pentru că trebuie să fii sigur că totul a fost presat. Și în acest proces există o probabilitate foarte mare de a pierde unul sau două momente.

În al doilea rând, tot ceea ce se face pentru astfel de teste nu poate fi reutilizat. Cu această metodă, este foarte dificil să găsim regresii. Ce este regresia? Imaginați-vă că ați scris un anumit cod și l-ați testat, ați rezolvat toate erorile pe care le-ați găsit și ați pus codul pe site. Apoi, utilizatorul a trimis un feedback despre noi erori și despre o cerere de funcții noi. Veți reveni la cod, veți corecta erorile și veți adăuga noi funcții. În acest caz, ar putea exista o situație în care din nou se manifestă erori vechi, numită "regresie". Trebuie să verificați totul. Și există o șansă să nu găsiți greșelile voastre vechi. În orice caz, timpul va trece înainte de a vă da seama că problema este cauzată de "regresie". Când folosiți testul unității, scrieți un test. Odată ce codul este modificat, îl filtrați din nou prin test. Dacă regresia se manifestă, atunci unele teste nu vor trece și veți putea determina cu ușurință ce parte din cod conține eroarea. Deoarece știți ce ați schimbat, eroarea va fi ușor corectată.

Un alt avantaj al testării unităților (în special pentru dezvoltarea web) este faptul că este ușor să testați compatibilitatea cu browserul încrucișat. Trebuie doar să executați testele în diferite browsere. Dacă există probleme în browser, puteți să le rezolvați și să executați din nou testul. Ca rezultat, veți fi siguri că toate browserele țintă sunt acceptate, deoarece toate au fost testate.

Cum se scriu testele de module în QUnit

Deci, cum scrieți în mod direct chestionarele pentru modulele QUnit? Primul pas este stabilirea unui mediu de testare:

Codul care trebuie testat este plasat în fișierul myProject.js. și testele sunt plasate în myTests.js. Pentru a rula testele, trebuie doar să deschideți fișierul HTML în browser. Acum e timpul să scriu niște teste.

Blocul de testare a unității este aprobat.

"O afirmație este o expresie care prezice rezultatul returnat atunci când execută codul dvs. Dacă prognoza este incorectă, instrucțiunea este falsă, ceea ce vă permite să ajungeți la concluzia că există erori."

Pentru a executa instrucțiuni, trebuie să le plasați în blocul de testare:

Aici definim funcția isEven. care verifică paritatea unui număr și doriți să vă asigurați că această funcție nu aduce valori eronate.

În primul rând, numim test (). care construiește un bloc de aluat. Primul parametru este șirul care va fi afișat ca rezultat. Al doilea parametru este o funcție de retur care conține declarațiile noastre. Această funcție de returnare va fi apelată o dată când se execută Qunit.

Am scris cinci declarații, toate acestea sunt logice. O afirmație logică presupune că primul parametru este adevărat. Al doilea parametru este mesajul care se transmite către rezultat.

Iată ce obținem după test:

Cum se testează codul javascript cu qunit

Toate afirmațiile noastre au fost confirmate cu succes, astfel încât să putem presupune că funcțiaEven () funcționează conform așteptărilor.

Să vedem ce se întâmplă dacă declarația este greșită.

Iată ce obținem ca rezultat al testului:

Cum se testează codul javascript cu qunit

Declarația are o eroare pe care am făcut-o în mod deliberat. Dar în proiectul dvs., dacă un test nu reușește și toate celelalte afirmații sunt corecte, atunci va fi foarte ușor să detectați eroarea.

Alte aprobări

ok () nu este singura declarație susținută de QUnit. Există și alte tipuri de declarații pe care le puteți utiliza atunci când creați teste pentru proiectele dvs.:







Declarație de comparație

Instrucțiunea de comparație este egală () presupune că primul parametru (care este o valoare validă) este echivalent cu al doilea parametru (care este valoarea așteptată). Această declarație este foarte asemănătoare cu ok (). dar produce ambele valori - reale și presupuse, ceea ce facilitează foarte mult depanarea codului. Ca și ok (). equals () ca un al treilea parametru poate primi un mesaj pentru ieșire.

Cum se testează codul javascript cu qunit

Cum se testează codul javascript cu qunit

Rețineți că valoarea așteptată este afișată la sfârșitul liniei.

Și dacă valorile nu sunt egale:

Cum se testează codul javascript cu qunit

O astfel de înregistrare oferă mai multe informații.

Instrucțiunea de comparație utilizează operatorul "==" pentru a verifica parametrii, deci nu poate funcționa cu matrice sau obiecte:

Pentru astfel de cazuri, Qunit are o declarație de identitate.

Afirmarea identității

Aserția identității () utilizează aceiași parametri ca și equals (). dar funcționează nu numai cu tipuri primitive, ci și cu matrice și obiecte. Instrucțiunile din exemplul anterior vor fi testate dacă treceți de la declarațiile de identitate:

Rețineți că același () utilizează pentru comparație operatorul '===', deci este util să comparați valorile speciale:

Structura declarațiilor

Punerea tuturor afirmațiilor într-un test este o idee foarte proastă. Acest test va fi dificil de întreținut și puteți obține confuzie în evaluarea rezultatelor implementării acestuia. Prin urmare, este necesar să se structureze testul prin plasarea instrucțiunilor în blocuri separate, fiecare dintre acestea urmărind un anumit grup de funcții.

Puteți organiza module individuale apelând funcția modulului.

Cum se testează codul javascript cu qunit

Test asincron

În exemplul precedent, toate declarațiile au fost numite în mod sincron, adică au fost executate unul după altul. În lumea reală, există multe funcții asincrone, cum ar fi cererile AJAX sau funcțiile setTimeout () și setInterval (). Cum putem testa acest tip de funcție? Qunit are un tip special de test numit "test asincron" și este destinat testelor asincrone:

În primul rând, încercați să scrieți testul în mod obișnuit:

Cum se testează codul javascript cu qunit

Se pare că nu există declarații în test. Deoarece declarația a fost executată sincron, dar la momentul numirii funcției, testul a fost deja finalizat.

Versiunea corectă a testarea exemplului nostru:

Cum se testează codul javascript cu qunit

Am folosit funcția stop () pentru a opri testul și, după executarea instrucțiunii, am testat din nou funcția start ().

Apelarea funcției stop () imediat după apelarea testului () este o practică foarte frecventă. Prin urmare, QUnit are o abreviere specială: asyncTest (). Exemplul anterior poate fi rescris ca:

Există un punct la care să vă gândiți: funcția setTimeout () apelează întotdeauna funcția de retur și dacă testați o altă funcție (de exemplu, un apel AJAX). Cum pot fi sigur că va fi apelată o funcție de returnare? Dacă funcția de apel invers nu este apelată, funcția start () va fi lăsată și fără un apel, iar întregul test se va "atârna":

Cum se testează codul javascript cu qunit

Puteți organiza testul după cum urmează:

O valoare de expirare este trecută la funcția stop (). Acum, Qunit a primit instrucțiunea: "dacă funcția start () nu va fi apelată după expirarea timpului de expirare, acest test ar trebui considerat eșuat." Acum, întregul test nu se va "agăța" și va fi emis un avertisment dacă ceva nu merge bine.

Acum, luați în considerare cazul mai multor funcții asincrone. Unde să plasați funcția start (). Trebuie să o plasați în funcția setTimeout ().

Valoarea timeout trebuie să fie suficientă pentru a efectua apeluri la ambele funcții de returnare înainte de a continua testul. Dacă una dintre funcții nu este chemată, cum să determinați care dintre ele? Pentru aceasta, există funcția expect ().

Transmitem în funcția așteptare () numărul de declarații care sunt programate să fie executate. Dacă una dintre afirmații nu este îndeplinită, veți primi un mesaj care să ateste că ceva nu merge așa cum a fost planificat.

Există o intrare scurtă de utilizat (). trebuie să transmiteți numărul de instrucțiuni programate ca al doilea parametru pentru test () sau asyncTest ().

concluzie

În această lecție am oferit tot ce aveți nevoie pentru a începe cu Qunit. Testarea unităților este o modalitate excelentă de a testa codul înainte de al utiliza. Dacă nu ați mai folosit niciun test înainte, este timpul să începeți.

Cum se testează codul javascript cu qunit

Prin obținerea de informații imediat prin două canale (vedere și auz), eficiența predării este mult mai mare decât învățarea din cărți. Și temele și testele online vă vor permite să gândiți în mod constant în limba pe care o învățați și să vă verificați imediat cunoștințele!

Cum se testează codul javascript cu qunit

Cum se testează codul javascript cu qunit

Dacă doriți să învățați HTML mult timp, atunci am o veste bună pentru dvs.!

Cum se testează codul javascript cu qunit

Dacă ați învățat deja HTML și doriți să treceți mai departe, următorul pas este să învățați tehnologia CSS.

Cum se testează codul javascript cu qunit

Dacă doriți să înțeleagă conceptele de domeniu si hosting, învață cum să creeze o bază de date, încărca fișiere pe un site web prin intermediul unui server FTP, crea subdomenii, configurați cutiile poștale pentru site-ul și să monitorizeze participarea, acest curs este conceput special pentru tine!







Trimiteți-le prietenilor: