Intro
Mi estis esploranta unuan elprovadon kaj testan priraportadon por JavaScript kiel mi laboras sur nova SharePoint app por SharePoint enreta en la Oficejo 365 Aro. La evidentaj esploraj vojoj gvidis min al Qunit.Js Kaj ĝusta post kiam tio, Al Kovro.Js.
QUnit lasis min instalita unuajn testojn kaj grupigi ilin en kapsuloj. Kapsulo estas nur simpla vojo organizi rilatita testojn. (Mi ne estas certe mi estas uzanta ĝin kiel celita, Sed ĝi estas laboranta por mi tiel ege kun la malgranda aro de testoj mi tiel ege difinis).
Kovro.Js integrigas kun Qunit kaj ĝi montros min la realaj linioj de JavaScript kiu estis – kaj pli grave – ne estis efektive efektivigita en la kurso kuri la testojn. Tio ĉi estas “priraportadaj” – linioj kiu efektivigis estas kovrita de la testo dum aliaj ne estas.
Inter instalanta bonajn testajn kazojn kaj vidanta priraportadon, Ni povas redukti la riskon ke nia kodo kaŝis mankojn. Bonaj tempoj.
Qunit
Supozanta vin havas vian Vidan Studian projekton instalita, Komenco de elŝutanta la JavaScript pako de http://qunitjs.com. Aldoni la JavaScript kaj responda CSS al via solvo. Mia similas tion ĉi:
Cifero 1
Kiel vi povas vidi, Mi estis uzanta 1.13.0 Ĉe la tempo mi skribis ĉi tiun blogan poŝton. Ne forgesas elŝuti kaj aldoni la CSSan dosieron.
KE ekstere de la vojo, Sekvanta paŝo estas krei iun specon de testo jungas kaj referenci la Qunit pecoj. Mi estas elprovanta aron de funkcioj en skriba dosiero vokis “QuizUtil.Js” do mi kreis HTMLan paĝon vokis “QuizUtil_testo.Html” kiel montrita:
Cifero 2
Ĉi tie-a la kodo:
<!DOCTYPE Html> <Html Xmlns="Http://Www.w3.org/1999/xhtml"> <Kapo> <Titolo>QuizUtil testo kun Qunit</Titolo> <Ligo Rel="Stylesheet" Href="../CSS/qunit-1.13.0.Css" /> <Skribo Tipo="Teksto/javascript" Src="QuizUtil.Js" Datumo-kovrilo></Skribo> <Skriba tipo="Teksto/javascript" Src="Qunit-1.13.0.Js"></Skribo> <Skriba tipo="Teksto/javascript" Src="Kovro.Min.Js"></Skribo> <Skribo> Kapsulo("GetIDFromLookup"); Testo("QuizUtil getIDFromLookupField", Funkcio () { Var GoodValue = "1;#Paul Galvin"; Egala(GetIDFromLookupField(GoodValue) + 1, 2), "IDENTIGAĴO de [" + GoodValue + "] + 1 Devus esti 2"; Egala(GetIDFromLookupField(Undefined), Undefined, "Undefined eniga argumento devus reveni undefined rezulto."); Egala(GetIDFromLookupField(""), Undefined, "Senhoma eniga argumento devus reveni undefined valoro."); Egala(GetIDFromLookupField("Gobbledigood3-thq;Dkvn ada;Skfja sdjfbvubvqrubqer0873407t534piutheqw;Vn"), Undefined,"Ĉiam devus reveni rezultan kabrioleton al Integralo"); Egala(GetIDFromLookupField("2;#Kelkaj alia persono"), "2", "Kontrolanta [2;#Kelkaj alia persono]."); Egala(GetIDFromLookupField("9834524;#Longa valoro"), "9834524", "Granda valora testo."); NotEqual(GetIDFromLookupField("5;#Iu ajn", 6), 6, "Elprovanta notEqual (5 Ne estas egala al 6 Por ĉi tiu ekzemplo: [5;#Iu ajn]"); }); Kapsulo("HtmlEscape"); Testo("QuizUtil htmlEscape()", Funkcio () { Egala(HtmlEscape("<"), "≪", "Evitanta malpli ol operacianto ('<')"); Egala(HtmlEscape("<Div klaso="someclass">Iu teksto</Div>"), "≪Div klaso=&Quot;Someclass&Quot;≫Iu teksto≪/Div≫", "Pli kompleksa testa ŝnuro."); }); Kapsulo("GetDateAsCaml"); Testo("QuizUtil getDateAsCaml()", Funkcio () { Egala(GetDateAsCaml(Nova Dato("12/31/2013")), "2013-12-31T:00:00:00", "Elprovanta malfacile kodita daton: [12/31/2013]"); Egala(GetDateAsCaml(Nova Dato("01/05/2014")), "2014-01-05T:00:00:00", "Elprovanta malfacile kodita daton: [01/05/2014]"); Egala(GetDateAsCaml(Nova Dato("01/31/2014")), "2014-01-31T:00:00:00", "Elprovanta malfacile kodita daton: [01/31/2014]"); Egala(GetTodayAsCaml(), GetDateAsCaml(Nova Dato()), "GetTodayAsCaml() Devus egalan getDateAsCaml(Nova Dato())"); Egala(GetDateAsCaml("Absurda valoro"), Undefined, "Provi akiri la daton de absurda valoro."); Egala(GetDateAsCaml(Undefined), Undefined, "Provi akiri la daton de la [Undefined] Dato."); }); Kapsulo("GetParameterByName"); Testo("QuizUtil getParameterByName (De la demanda ŝnuro)", Funkcio () { Egala(GetParameterByName(Undefined), Undefined, "Provi akiri undefined parametro devus reveni undefined."); Egala(GetParameterByName("Ne ekzistas"), Undefined, "Provi akiri parametran valoron kiam ni scias la parametron ne ekzistas."); }); Kapsulo("Kuketoj"); Testo("QuizUtil diversaj kuketaj funkcioj.", Funkcio () { Egala(SetCookie("Testo", "1", -1), GetCookieValue("Testo"), "Akiri kuketon mi fiksas devus labori."); Egala(SetCookie("Anycookie", "1", -1), Vera, "Fiksanta validan kuiradon devus reveni 'veran'."); Egala(SetCookie("Freneza kuketa nomo !@#$%"%\^&*(()?/><.,", "1", -1), Vera, "Fiksanta malbonan kuketan nomon devus reveni 'falsan'."); Egala(SetCookie(Undefined, "1", -1), Undefined, "Pasanta undefined kiel la kuketa nomo."); Egala(GetCookieValue("Ne ekzistas"), "", "Kuketo ne ekzistas teston."); }); </Skribo> </Kapo> <Korpo> <Div Identigaĵo="Qunit"></Div> <Div Identigaĵo="Qunit-fiksaĵo"></Div> </Korpo> </Html>
Estas pluraj aferoj okazanta ĉi tie:
- Referencanta mian kodon (QuizUtil.Js)
- Referencanta Qunity.Js
- Difinanta kelkajn kapsulojn (GetIDFromLookup, Kuketoj, Kaj aliaj)
- Lokanta <Div> Kies IDENTIGAĴO estas “qunit”.
Tiam, Mi nur tiras supre ĉi tiu paĝo kaj vi akiras ion tiel:
Cifero 3
Se vi rigardas trans la supro, Vi havas kelkajn elektojn, Du el kiu estas interesanta:
- Kaŝi pasita testojn: Sufiĉe evidenta. Povas helpi vian okulon nur vidi la problemajn areojn kaj ne multa malordo.
- Kapsulo: (Fali malsupren): Tio ĉi filtros la testojn malsupren al nur tiuj grupoj de testoj vi deziras.
Koncerne la testoj si mem – kelkaj rimarkoj:
- Ĝi iras sen diranta ke vi devas skribi vian kodon tia ke ĝi estas testable en la unua loko. Uzanta la ilon povas helpi observigi tiun disciplinon. Ekzemple, Mi havis funkcion vokis “getTodayAsCaml()”. Tio ĉi ne estas tre testable pro tio ke ĝi prenas neniun enigan argumenton kaj elprovi ĝin por egaleco, Ni devus konstante ĝisdatigi la testan kodon reflekti la nunan daton. Mi refactored ĝi de aldonanta datuman enigan parametron tiam pasanta la nunan daton kiam mi deziras hodiaŭan daton en CAMLa formato.
- La Qunit kadro dokumentas ĝiajn proprajn testojn kaj ĝi ŝajnas sufiĉe fortika. Ĝi povas fari simplajn aferojn kiel elprovanta por egaleco kaj ankaŭ havas subtenon por ajax stilaj vokoj (Ambaŭ “vera” aŭ mokis uzanta vian preferatan pli imita).
- Iranta tra la procezo ankaŭ devigas vin pensi tra randaj kazoj – kio okazas kun “undefined” aŭ null estas pasita en funkcio. Ĝi faras ĝin senvive simpla elprovi ĉi tiujn scenarojn ekstere. Bona aĵo.
Priraportado kun Kovro.Js
Kovro.Js kompletigas Qunit de spuranta la realajn liniojn de kodo kiu efektivigas dum la kurso kuri viajn testojn. Ĝi integrigas ĝuste en Qunit do eĉ kvankam ĝi estas tuta aparta app, Ĝi ludas agrable – ĝin vere similas ĝin estas unu seamless app.
Tio ĉi estas kovro.Js en ago:
Cifero 4
Cifero 5
(Vi efektive devas klaki sur la “Ebligi priraportadon” checkbox ĉe la supro [Vidi Ciferon 3] Ebligi tion ĉi.)
La reliefigita liniojn en Cifero 5 Ne estis efektivigita de iu ajn de miaj testoj, Do mi devas elpensi teston kiu faras kaŭzi ilin efektivigi se mi deziras plenan priraportadon.
Akiri kovron.Js laboranta de sekvanta ĉi tiujn paŝojn:
- Elŝuti ĝin de http://blanketjs.org/.
- Aldoni ĝin al via projekto
- Ĝisdatigi vian teston jungas paĝon (QuizUtil_testo.Html en mia kazo) Kiel sekvas:
- Referenci la kodon
- Ornami via <Skribo> Referenci tiel:
<Skribo Tipo="Teksto/javascript" Src="QuizUtil.Js" Datumo-kovrilo></Skribo>
Kovro.Js kaptas la “datumon-kovrila” eco kaj faras ĝian magion. Ĝi hokas en Qunit, Ĝisdatigas la UI aldoni la “Ebligi priraportadan” elekton kaj voila!
Resuma (TL; D-ro)
Uzi Qunit skribi viajn testajn kazojn.
- Elŝuti ĝin
- Aldoni ĝin al via projekto
- Skribi teston jungas paĝon
- Krei viajn testojn
- Refactor kelkaj de via kodo esti testable
- Esti kreiva! Pensi de freneza, Neeblaj scenaroj kaj elprovi ilin ĉiuokaze.
Uza kovro.Js certigi priraportadon
- Fari certan Qunit estas laboranta
- Deŝuta kovro.Js kaj aldoni ĝin al via projekto
- Aldoni ĝin al via testo jungas paĝon:
- Aldoni referencon al kovro.Js
- Aldoni “datumon-kovrila” eco al via <Skribo> Etikedo
- Kuri via Qunit testoj.
Mi neniam faris iun ajn de tio ĉi antaŭ ol kaj havis iun rudimentan aĵon laboranta en iometo de horoj.
Feliĉa elprovado!
</Fino>
Sekvi min sur Pepi ĉe http://www.twitter.com/pagalvin