Ne bojte se brezglavega Chroma! Preberite, zakaj in kako ga uporabljati za testiranje Ember

Nazadnje posodobljeno 9.1.17., Ember CLI 2.15. Posebna zahvala Scottu Newcomerju in Benu Demboskiju, ki sta mi pomagala pri odpravljanju napak, Karlu Beckerju za urejanje in Tobiasu Bienieku za nekaj nasvetov CLI!

Po nekaj urah razhroščevanja mojega preizkusnega paketa EmberJS, ki se ni hotel zagnati iz ukazne vrstice, sem odtujil PhantomJS in prešel na Chrome brez glave. Razložimo, kaj vse to pomeni, kako sem to storil in kakšni so vplivi.

Kaj sploh je Chrome brez glave?

Razvijalci podjetja Ember imajo možnosti, katere brskalnike uporabljajo za zagon preizkusnega nabora, Chrome brez glave pa je eden izmed njih. Toda kaj je to? V Googlovem blogu piše:

To je način za zagon brskalnika Chrome v okolju brez glave. V bistvu deluje Chrome brez kroma!
(Alt: kaj je to, sploh ne ...)

Prav. Tu je boljša definicija iz Wikipedije:

Brskalnik brez glave je spletni brskalnik brez grafičnega uporabniškega vmesnika. Brskalniki brez glave omogočajo samodejno nadziranje spletne strani v okolju, podobnem priljubljenim spletnim brskalnikom, vendar se izvajajo prek vmesnika ukazne vrstice ali z uporabo omrežne komunikacije.

Začenši z Ember CLI 2.15, je brezglavi Chrome privzeti za testiranje v EmberJS. Če delate s starejšo aplikacijo Ember, imam dobre novice - ni vam treba nadgraditi aplikacije, da bi preizkusili Chrome brez glave. Pravzaprav lahko uporabite najnovejšo različico CLI s skoraj katero koli starejšo različico aplikacije Ember.

Zakaj je potrebno okolje brez glave?

Tako kot običajni brskalnik tudi brezglavi brskalnik razume HTML in CSS. Lahko izvrši JavaScript kot AJAX zahteve. Pomislite na sprejemne teste v Emberju. Če preizkus skuša klikniti skrit gumb, ga ne bi bilo mogoče klikniti in test ne bi uspel. Toda kako je to znano? Ker brskalnik združi vse HTML, CSS in JavaScript v nekaj koristnega. In ker ni nobenih slik, ki bi jih lahko prikazali, je testiranje hitrejše v okolju brez glave. Obstaja veliko različnih vrst brskalnikov brez glave. Chrome in PhantomJS sta le dva primera.

Zakaj torej preprosto ne zaženete testov neposredno v običajnem brskalniku Chrome? Če imate aplikacijo Ember, zaženite strežbo ember in obiščite http: // localhost: 4200 / testing, si lahko dejansko ogledate, kako se preizkusi izvajajo v realnem času, ali jih začasno ustavite in vizualno pogledate stanje aplikacije. Kadar pa brskalniki brez glave resnično sijejo, ko jih uporabljamo za neprekinjeno testiranje integracije, ki jih običajno imenujemo CI. V proizvodnih aplikacijah je običajno uporabljati storitev, ki samodejno zažene vaš testni paket, ko je koda zavezana. In večinoma se ti testi izvajajo na strežniku in ne v »običajnih« brskalnikih. Na primer, oglejte odprte zahteve za povleko za del spletnega mesta Ember, zlasti tiste z rdečim x zraven. Kadar koli se na GitHubu odpre prošnja za vleko, lahko vidite, ali je opravil preizkuse.

To ni moja prošnja. Prisežem. (Alt: slika, ki prikazuje več preizkusnih napak na zahtevi GitHub pull)

Zakaj ne bi uporabili PhantomJS?

PhantomJS je še en primer brezglavega brskalnika. Ustvarjanje in vzdrževanje je bila herkulovska naloga in njen uspeh je zato, da imamo lepe stvari. Gradnja aplikacij je težka ... si lahko predstavljate, da zgradite cel brskalnik ??? A zdi se, da je na poti ven. Aprila 2017 je eden od vzdrževalcev odstopil in povedal:

Prihaja Chrome brez glave Mislim, da bodo ljudje na koncu prešli na to. Chrome je hitrejši in stabilnejši od PhantomJS. In ne jem spomina kot nor. V razvoju PhantomJS ne vidim nobene prihodnosti.

Kot je opozoril vzdrževalec, ima PhantomJS nekaj težav. Imel sem enega svojega: noben od mojih testov ne bi tekel. V novi aplikaciji je bilo vse v redu, toda neki neznani del moje prave aplikacije ni bil združljiv po uvedbi nekaterih uveljavljenih odvisnosti. Izvedel sem ember test, a preden so se še začeli kakšni testi, so me pozdravili naslednji napaki:

ni v redu 1 PhantomJS 2.1 - Globalna napaka: SyntaxError: Nepričakovani žeton '}' na http: // localhost: 7357 / sredstva / vendor.js, vrstica 120177
ni v redu 2 PhantomJS 2.1 - Globalna napaka: Napaka: Ni mogoče najti modula iz elektronske kovine, ki ga zahteva: ember-testing / support na http: // localhost: 7357 / tools / test-support.js, vrstica 58
ni v redu 3 PhantomJS 2.1 - Globalna napaka: ReferenceError: Ni mogoče najti spremenljivke: določite na http: // localhost: 7357 / tools / ember-bio -right.js, vrstica 5
ni v redu 4 PhantomJS 2.1 - Globalna napaka: ReferenceError: Ne najdem spremenljivke: definiraj na http: // localhost: 7357 / imovina / testi.js, vrstica 3
ni v redu 5 PhantomJS 2.1 - Globalna napaka: ReferenceError: Ni mogoče najti spremenljivke: EmberENV na http: // localhost: 7357/4215 / testing / index.html?

Vse sem vrgel na to napako. Razstreljevanje modulov vozlišč, odstranjevanje vseh, razen najpreprostejšega testa, ponovna namestitev EmberCLI, namestitev / odstranjevanje PhantomJS, kopanje v svežnju prodajalcev, deljenje jeznih GIF-ov mačk, prižiganje nekaj kadila… nič.

Po nekaj vprašanjih in vprašanjih s še nekaj razvijalci je bilo predlagano, da preizkusim Chrome brez glave, da vidim, ali je napake lažje odpraviti.

Napake niso postale lažje odpravljati napak.

Napake so preprosto izginile.

Kako narediti stikalo

V aplikacijah Ember se nahaja datoteka, imenovana testem.js, in tu konfigurirate, katera orodja za testiranje naj se uporabijo, ko vtipkate test ember ali ember test - strežnik. Tu je povezava do vsebine testem.js, ki sem jo na koncu uporabil, prepisal in prilepil iz članka Ryana Toronta. Datoteko testem, ki je bila dobavljena z EmberCLI, si lahko ogledate na tej povezavi na EmberCLI GitHub.

Kaj je Testem?

Testem je testni tekač, kar pomeni, da nalaga in zažene preizkuse vaše aplikacije z uporabo konfiguracije, ki ste jo določili v testem.js. Dobite tudi prijazen vmesnik, da vidite rezultate svojih testov iz ukazne vrstice. Bil sem presenečen, ko sem izvedel, da Testem ni edinstven za Ember. Deluje z mnogimi okviri JavaScript, orodji za testiranje (kot so QUnit, Mocha in Jasmine) in brskalniškim okoljem.

Poglej to? To je Testem v akciji, ki je posledica 'testnega ognja - strežnik'. Kot vidite, je moje zadnje delo na ember-api-Dokumentih ZELO. Vse bo v redu in zagotovo vem, kaj počnem. Ne. (Alt: okno terminala, kjer testtem runner pokaže 175 testnih napak)

Kakšne negativne vplive bi lahko imel Chrome brez glave?

No, ena stvar, Chrome brez glave ni odprti vir, kot je PhantomJS. Prednosti in slabosti tega bi lahko bili lastni članek.

To je tudi novo-ish. Na voljo je bil Chrome 59, vendar so razvijalci že pred tem imeli načine uporabe Chroma. Veliko vprašanje je, če že izvajate testiranje CI, kako dobro ga podpira vaš prodajalec? Mnogi veliki igralci so ga hitro izvedli, vendar je mogoče, da boste naleteli na nekatere težave.

Končno boste morda imeli nekaj testov, ki so bili opravljeni v PhantomJS in niso uspeli v Chromu brez glave, kar pomeni, da je čas, da opravite odpravljanje napak. Seveda sem doživel obratno, kjer so se vse moje težave magično odpravile, ko sem zamenjal brskalnike brez glave, vendar težave niso redke. To je boleča točka, podobna stvarem, ki so v Chromu videti odlično, vendar eksplodirajo v Firefoxu. Zaradi tega in zato, da bi bili njihovi testi bolj robustni, nekatere organizacije izvajajo svoje teste v več orodjih brez glave.

Kdaj preklopiti

Če se vam zdi, da ste obtičali ali želite preprosto vedeti, kaj je najnovejše in najboljše pri testiranju Ember, poskusite!

Srečno testiranje brez glave!

Umetniško delo IrenHorrors, v skupni rabi pod Creative Commons Priznanje avtorstva-nekomercialno-brez izpeljanih del 3.0 Licenca