Intro
Już badają jednostki badań i sprawdzić zasięg JavaScript jak działa na nowych aplikacji SharePoint dla programu SharePoint online w biurze 365 Apartament. Ścieżki oczywiste badań doprowadziły mnie do Qunit.js i zaraz po tym, do Blanket.js.
QUnit pozwól mi się testy jednostkowe i zgrupuj je do modułów. Moduł jest tylko prostym sposobem organizowania związanych z testów. (Nie jestem pewien, że używam go zgodnie z przeznaczeniem, ale to działa dla mnie do tej pory z małych zestaw testów, które do tej pory zostały zdefiniowane).
Blanket.js integruje się z Qunit i pokaże mi rzeczywistej linii JavaScript, które były- i co ważniejsze – nie zostały rzeczywiście wykonane podczas uruchamiania testów. To jest "zasięgu"-linie, które wykonywane są objęte badanie, podczas gdy inni nie są.
Tworzenie dobrych testów i oglądania zasięgu, możemy zmniejszyć ryzyko, że nasz kod ma ukryte wady. Dobre czasy.
Qunit
Zakładając, że Visual Studio projektu ustawić, Zacznij Pobieranie pakietu z JavaScript http://qunitjs.com. Dodaj odpowiednie CSS i JavaScript do rozwiązania. Kopalnia wygląda jak ten:
Rysunek 1
Jak widać, Był przy pomocy 1.13.0 w tym czasie napisałem ten post blog. Nie zapomnij, aby pobrać i dodać plik CSS.
Że z drogi, następnym krokiem jest stworzenie pewnego rodzaju badania przewodów i odwołać Qunit bitów. Jestem testowania kilka funkcji w pliku skryptu o nazwie "QuizUtil.js", więc stworzyłem stronę HTML o nazwie "QuizUtil_test.html", jak pokazano:
Rysunek 2
Oto kod:
<!DOCTYPE HTML> <HTML xmlns= "http://www.w3.org/ 1999/xhtml"> <głowa> <Tytuł>QuizUtil test z Qunit</Tytuł> <link rel= "arkusz stylów" href="../CSS/qunit-1.13.0.css" /> <skrypt Typ= text/javascript"" src="QuizUtil.js" danych okładka></skrypt> <skrypt typ ="text/javascript" src ="qunit-1.13.0.js"></skrypt> <skrypt typ ="text/javascript" src ="blanket.min.js"></skrypt> <skrypt> moduł("getIDFromLookup"); badania("QuizUtil getIDFromLookupField", Funkcja () { var goodValue = "1;#Paul Galvin"; równe(getIDFromLookupField(goodValue) + 1, 2), "Identyfikator [" + goodValue + "] + 1 powinno być 2"; równe(getIDFromLookupField(niezdefiniowana), niezdefiniowana, "Niezdefiniowany argumentów wejściowych powinien zwracać wynik niezdefiniowany."); równe(getIDFromLookupField(""), niezdefiniowana, "Pustych argumentów wejściowych powinien zwracać wartość undefined."); równe(getIDFromLookupField("gobbledigood3-thq;dkvn ada;skfja sdjfbvubvqrubqer0873407t534piutheqw;vn"), niezdefiniowana,"Należy zawsze zwraca wynik kabriolet całkowitą"); równe(getIDFromLookupField("2;#Niektóre inne osoby"), "2", "Sprawdzanie [2;#Niektóre inne osoby]."); równe(getIDFromLookupField("9834524;#długa wartość"), "9834524", "Dużą wartość badania."); notEqual(getIDFromLookupField("5;#ktoś", 6), 6, "Badania notEqual (5 nie jest równa 6 Ten przykładowy: [5;#ktoś]"); }); moduł("htmlEscape"); badania("QuizUtil htmlEscape()", Funkcja () { równe(htmlEscape("<"), "<", "Ucieczki mniej niż operator ('<')"); równe(htmlEscape("<DIV class = "someclass">Jakiś tekst</DIV>"), "<DIV class ="someclass">Jakiś tekst</DIV>", "Bardziej złożonych testów ciąg."); }); moduł("getDateAsCaml"); badania("QuizUtil getDateAsCaml()", Funkcja () { równe(getDateAsCaml(Nowy Data("12/31/2013")), "2013-12-31T:00:00:00", "Zakodowanego Data badania: [12/31/2013]"); równe(getDateAsCaml(Nowy Data("01/05/2014")), "2014-01-05T:00:00:00", "Zakodowanego Data badania: [01/05/2014]"); równe(getDateAsCaml(Nowy Data("01/31/2014")), "2014-01-31T:00:00:00", "Zakodowanego Data badania: [01/31/2014]"); równe(getTodayAsCaml(), getDateAsCaml(Nowy Data()), "getTodayAsCaml() powinna być równa getDateAsCaml(nowy termin())"); równe(getDateAsCaml("wartość bzdury"), niezdefiniowana, "Postarać się daty wartość bzdury."); równe(getDateAsCaml(niezdefiniowana), niezdefiniowana, "Staramy się od dnia [niezdefiniowana] Data."); }); moduł("getParameterByName"); badania("QuizUtil getParameterByName (ciąg kwerendy)", Funkcja () { równe(getParameterByName(niezdefiniowana), niezdefiniowana, "Staramy się niezdefiniowanych parametrów należy powrót niezdefiniowany."); równe(getParameterByName("nie istnieje"), niezdefiniowana, "Postarać się wartość parametru, gdy wiemy, że parametr nie istnieje."); }); moduł("Ciasteczka"); badania("QuizUtil różne funkcje plików cookie.", Funkcja () { równe(setCookie("badanie", "1", -1), getCookieValue("badanie"), "Pobierz plik cookie, ustawiłem powinno działać."); równe(setCookie("anycookie", "1", -1), PRAWDA, "Ustawienie prawidłowe gotowanie powinno zwraca 'true'."); równe(setCookie('Nazwa ciasteczka szalony !@#$%"%\^&*(()?/><.,", "1", -1), PRAWDA, "Ustawienia nazwy zły cookie należy zwrócić 'false'."); równe(setCookie(niezdefiniowana, "1", -1), niezdefiniowana, "Przekazywanie niezdefiniowane jako Nazwa ciasteczka."); równe(getCookieValue("nie istnieje"), "", "Cookie nie istnieją badania."); }); </skrypt> </głowa> <organ> <DIV Identyfikator= "qunit"></DIV> <DIV Identyfikator= "qunit uchwyt"></DIV> </organ> </HTML>
Tu są osobisty rzeczy dzieje się tutaj:
- Odwoływanie się do mojego kodu (QuizUtil.js)
- Odwoływanie się do Qunity.js
- Określanie niektórych modułów (getIDFromLookup, Ciasteczka, i inni)
- Wprowadzenie do <DIV> których identyfikator jest "qunit".
Następnie, Tylko podciągnąć tej strony i masz cos takiego:
Rysunek 3
Jeśli spojrzeć na górze, masz kilka możliwości, dwa z nich są ciekawe:
- Ukryj przeszedł testy: Dość oczywiste. Pomoże Ci się w oczy po prostu zobacz obszary problemowe i nie dużo bałaganu.
- Moduł: (spadek w dół): Będzie to filtr testy do tylko tych grup testów, które chcesz.
Co do testów, siebie-kilka uwag:
- Jest rzeczą oczywistą, że należy napisać kod, tak, że jest to sprawdzalne w pierwszej kolejności. Za pomocą narzędzia mogą pomóc egzekwowania tej dyscypliny. Na przykład, Miał funkcję o nazwie "getTodayAsCaml()”. To nie jest bardzo testować, ponieważ zajmuje żadnego argumentu wejściowego i przetestować go na rzecz równości, musimy stale aktualizować kod testu w celu odzwierciedlenia bieżącej daty. Mi przepisano go przez dodanie danych parametru wejściowego, a następnie przekazywanie bieżącej daty, kiedy chcę daty w formacie CAML.
- Ramach Qunit dokumenty własne testy i wydaje się dość solidne. To można zrobić proste rzeczy, jak badania na rzecz równości i posiada również wsparcie dla połączenia stylu ajax (zarówno "prawdziwe" lub wyśmiewali, przy pomocy twój ulubieniec mocker).
- Przechodzi proces również zmusza do myślenia poprzez krawędzi przypadkach – co się dzieje z "nieokreślone" lub wartość null jest przekazywana do funkcja. To sprawia, że martwe proste do testowania tych scenariuszy się. Dobre rzeczy.
Relacje z Blanket.js
Blanket.js uzupełnia Qunit przez śledzenie rzeczywistej linii kodu, które są wykonać w trakcie prowadzenia testów. Integruje prawo do Qunit więc choć to zupełnie oddzielny aplikacja, ładnie gra – to naprawdę wygląda to jeden app bez szwu.
To jest blanket.js w akcji:
Rysunek 4
Rysunek 5
(Rzeczywiście trzeba kliknąć na pole "Włącz zasięgu" u góry [patrz rysunek 3] Aby to umożliwić.)
Wyróżnione wiersze na rysunku 5 nie zostały wykonane przez jednego z moich testów, więc trzeba opracować test, który powoduje je wykonać, jeśli chcę pełne pokrycie.
Dostać blanket.js pracy przez następujące kroki:
- Pobierz za darmo z http://blanketjs.org/.
- Dodaj to do swojego projektu
- Aktualizacja strony wykorzystać badania (QuizUtil_test.html w moim przypadku) w następujący sposób:
- Kod referencyjny
- Udekoruj swój <skrypt> odwołanie takiego:
<skrypt Typ= text/javascript"" src="QuizUtil.js" danych okładka></skrypt>
Blanket.js wybiera się atrybut "dane okładka" i ma swoją magię. Haki do Qunit, aktualizacje interfejsu dodać opcję "Włącz zasięgu" i voila!
Podsumowanie (TL; DR)
Użyj Qunit do napisania swojej sprawy.
- Pobierz za darmo to
- Dodaj to do swojego projektu
- Napisz stronę testową uprząż
- Tworzenie testów
- Refaktoringu część kodu należy testować
- Bądź kreatywny! Myślę, że Crazy, możliwe scenariusze i tak je przetestować.
Użyj blanket.js do zapewnienia pokrycia
- Upewnij się, że działa Qunit
- Pobierz za darmo blanket.js i dodać go do projektu
- Dodać go do uprzęży Strona testowa:
- Dodaj odwołanie do blanket.js
- Dodaj atrybut "dane okładka" do swojej <skrypt> Tag
- Uruchomienia testów Qunit.
Nigdy nie zrobił to przed i miał pewne elementarne rzeczy działa w kilka godzin.
Szczęśliwy badania!
</koniec>
Follow me on Twitter wiek na http://www.twitter.com/pagalvin