Ohjelmointi

Verkkosovellusten testaaminen Node.js: n ja Playwrightin avulla

Nykyaikainen sovelluskehitys riippuu automatisoidusta testauksesta. Testikehysten avulla varmistetaan, että koodi on valmis menemään sovelluspaketteihin ja loppukäyttäjille. Testauksen hyödyntämiseksi testit kirjoitetaan ennen koodia ja ne voidaan integroida lähdeohjaus- ja CI / CD (jatkuva integrointi / jatkuva käyttöönotto) -putkiin. Testien tulisi olla kaikkialla kehitysprosessissasi. Onko sinun yhdistettävä vetopyyntö? Testaa koodi. Tarvitseeko sitoutua sivuliikkeeseen? Testaa koodi.

Mutta on yksi alue, jolla testaus on vaikeaa, varsinkin kun se on automatisoitava. Puhun tarpeesta olla vuorovaikutuksessa ja testata dynaamisia käyttöliittymiä. Verkkosovellusten testaus on monimutkainen prosessi. Työkalut, kuten Selenium ja webdriver, ovat avaintekijöitä sivun sisällön automatisoinnissa ja sen varmistamisessa, että testaat sekä sivuelementtejä että sovellusta kokonaisuutena. Ne ovat tärkeitä, jos käytät päätöntä selainta sovelluksessa. Olen käyttänyt joukko Python-komentosarjoja Seleniumin ja Chromiumin verkko-ohjaintuen ympärille rakennetussa Twitter-sovelluksessa kuvakaappausten ottamisen automatisoimiseksi lentokoneiden seurantasovelluksesta.

Esittelyssä Playwright, Microsoftin verkkotestauskehys

Seleeni ja verkko-ohjain eivät ole ainoat työkalut nykyaikaisten verkkosovellusten ja selainten kattavien testien rakentamiseen. Suosittu vaihtoehto on Googlen Puppeteer, joka käsittelee sekä napsautusten lähettämisen selaimille samalla tekniikalla kuin Chromen verkkojohdotyökalut, että virheenkorjaustietoihin pääsemisen tuttujen kehitystyökalujen sovellusliittymien kautta. Microsoft kehittää selaimen testausliigan uudempaa tulijaa, Playwrightia, GitHubissa isännöitävänä avoimen lähdekoodin projektina.

Näytelmäkirjailija vie Puppeteer-perusarkkitehtuurin ja siirtää sen enemmän Selenium-suuntaan, lisäämällä verkkoautomaatiokehyksen ja parantamalla sitä, miten Puppeteer on vuorovaikutuksessa sivun sisällön kanssa. Se on suunniteltu asentamaan nopeasti ja helposti käyttämällä tuttua npm-syntaksia ja käyttämällä JavaScriptiä verkkosovellusten automaation ja testauksen rakentamiseen. Se toimii useamman selaimen kanssa ja tukee Chromium-pohjaisia ​​selaimia, kuten Edge, Firefox ja Applen WebKit.

Playwrightin tuettujen selainten luettelossa on tärkeä viesti: Et voi käyttää sitä Trident- tai EdgeHTML-pohjaisten selainten kanssa. Se ei ole yllättävää. Microsoft on sitoutunut tiukasti Chromium-haaraan uudessa reunassaan, ja sekä vanha Edge että Internet Explorer ovat loppumassa. Jos aiot käyttää Playwrightia testaamiseen, päätät tukea vain nykypäivän valtavirran selaimia, joten sinun on kerrottava käyttäjille, mitä on varastossa rakennettavien ja tukemiesi verkkosovellusten tuleville julkaisuille.

Verkon testaaminen Playwrightilla

Mahdollisuus suorittaa alustojen välinen testaus kaikilla tärkeimmillä selaimilla samoilla komentosarjoilla on tärkeä, samoin kuin sivustojen mobiiliversioiden tuki (koska kaksi tärkeintä mobiilialustaa käyttävät työpöydän selainten muunnelmia, Playwright emuloi tällä hetkellä mobiilinäkymiä työpöydän selaimissa ). Tärkeää on myös tuki päätöttömille testeille, joissa et hahmonna selaimen käyttöliittymää, vaan työskentelet sen sijaan luodun asiakirjaobjektimallin kanssa (ja varjon DOM: n kanssa, jos käytät nykyaikaisia ​​selaintoimintoja ja tekniikoita, kuten verkkokomponentteja).

Voit käyttää Playwrightia automatisoimaan käynnissä olevan selaimen kehitystyöpöydillä tarkistaaksesi virheet osana sovelluksen virheenkorjausta varmistaen, että suoritat jatkuvasti kaikki testipolut samalla kun tallennat muita suorituskykytietoja ja seuraat jäljittämättömiä käyttöliittymän häiriöitä. Vaihtoehtoisesti se voidaan asettaa osana GitHub-toimintoa uuden koodin testaamiseksi osana sitoutumista tai yhdistämistä automatisoimalla mikä muuten voisi olla monimutkainen manuaalinen testi.

Playwright-testien rakentaminen ja suorittaminen

Playwrightin käytön aloittaminen on yhtä helppoa kuin uuden Node.js-projektin luominen. Ensinnäkin, asenna Node.js testilaitteisiisi. Koska Playwright käyttää Solmua, voit käyttää sitä kehitystietokoneilla tai CI / CD-putkesi palvelimilla, mikä tekee siitä osan GitHub-toimintoa, jota voidaan käyttää koko ohjelmistokehitysprosessissasi. Tarvitset vain yhden npm-komennon, joka asentaa Playwright-paketin sekä kaikkien tuettujen selainten binäärit. Kun asennus on valmis, voit luoda automaatio-komentosarjoja JavaScriptiä tai TypeScriptiä käyttäen kutsua Playwright-sovellusliittymiä. Nämä ovat kaikki asynkronisia puheluita, joten käytä odotuslausekkeita lupausten hallintaan.

Tuloksena on hyvin selkeä tapa rakentaa komentosarjoja, avaamalla päätön selaininstanssi ja siirtymällä sitten sivulle ennen vuorovaikutusta sivuilmentymien kanssa. Aluksi on hyvä rakentaa testejä kaikilla selaimilla, jotta voit seurata, kuinka Playwright on vuorovaikutuksessa sovelluksesi kanssa. Hyödyllinen hidas mo -vaihtoehto ajaa vuorovaikutusta ihmisen nopeudella, mikä helpottaa työpöydän selaimissa suoritettavien testien visualisointia ja hallintaa. Kun testi on virheenkorjattu ja se toimii hyvin, voit siirtää sen Headless-tilaan ja suorittaa sen sitten osana CI / CD-toteutusta.

Playwright sisältää CLI-työkalun, joka voi tallentaa vuorovaikutusta sivustojen kanssa ja luoda automaattisesti testien suorittamiseen tarvittavan JavaScriptin. Codegen-vaihtoehto on hyödyllinen työkalu Playwrightin käytön aloittamiseen nopeasti. Se näyttää koodin, joka on vuorovaikutuksessa sivuelementtien kanssa, joita voit käyttää mallina omissa testeissäsi, kopioida ja muokata luotua koodia tarvittaessa. TypeScript-tuki voi auttaa kirjoittamaan monimutkaisempia testejä käyttämällä vahvaa kirjoittamista muuttujien hallintaan.

Työskentely verkkosovellusten kanssa Playwrightissa

Yksi Playwrightin hyödyllisimmistä ominaisuuksista on sen tuki selainyhteyksille. Näiden avulla voit suorittaa yksittäisiä toimintoja yhdessä selainesimerkissä, joten voit määrittää useita yhteyksiä testataksesi useita vuorovaikutuksia samanaikaisesti. Jokaisessa yhteydessä luodaan sivuja, jotka ajatellaan parhaiten välilehdinä työpöydän selaimessa. Sivut tukevat omia napsautusvuorovaikutuksiaan, ja niitä voidaan seurata samanaikaisesti. Kun olet sivulla, voit käyttää erilaisia ​​tapoja löytää sisältöä vuorovaikutuksessa CSS- tai XPath-valitsimien, HTML-määritteiden tai tekstin avulla. Jos olet perehtynyt Seleniumiin, sinun pitäisi löytää selaaminen tutuilla sivuilla ja lisätä mahdollisuus odottaa sivun latautumista kokonaan tai dynaamisen sisällön renderointia yhden sivun verkkosovelluksessa.

Voit käyttää arviointitoimintoja parametrien lähettämiseen verkkosivuilta ja sivuilta sivukontekstissa toimivaan JavaScript-koodiin. Tulokset palautetaan Node.js: n testiskriptin juoksijalle analysointia varten, jolloin saat testien läpäisemiseen tai epäonnistumiseen tarvittavat työkalut. Playwright toimii F12-selaimen devtoolien kanssa, joten se voi tehdä paljon enemmän kuin vain vuorovaikutuksessa sivun sisällön kanssa. Se voi seurata verkkoliikennettä, joten voit käyttää sitä muun muassa sekä todennuksen että tiedostojen lataamisen testaamiseen. Se voi käyttää selainkonsolia ja tallentaa virheitä, jotka eivät välttämättä näy heti renderoidulla sivulla: esimerkiksi seurata CSS-ongelmia tai JavaScript-kirjastoja, jotka eivät lataudu.

Playwrightissa on paljon, ja se on seleniumille pakottava vaihtoehto selainsovellusten testaamiseen. Kun Microsoft lisää jatkuvasti Eden F12-kehittäjätyökaluja, on mielenkiintoista seurata, kuinka Playwright lisää uusia ominaisuuksia, jotka laajentavat selaimesi isännöimien sovellusten ja progressiivisten verkkosovellusten testausvaihtoehtoja perinteisten verkkosovellusten rinnalla.

Beyond JavaScript: Testaus Pythonissa ja C #

Microsoft julkaisi äskettäin uuden version Playwrightista kehittäjille, jotka haluavat rakentaa testejä Pythonissa eikä JavaScriptissä. Se on hyödyllinen vaihtoehto, koska monet nykyiset Selenium-testikehykset ovat Python-pohjaisia, ja sen avulla voit linkittää testauskoodisi analyyttisiin paketteihin tarkempaa tulosanalyysiä varten käyttämällä Pythonin rikkaita tilastosovellusten ja -työkalujen ekosysteemejä.

Playwright sisältää kielisitoja C #: lle, joten voit tuoda Playwrightin olemassa oleviin ASP.NET- tai muiden .NET-työkalujen testikehyksiin. Sinun ei tarvitse muuttaa työtapaa uusien työkalujen tuomiseksi, ja Microsoft lupaa Java- ja Ruby-kielille uusia kielisitoja. Tulevaisuudessa on mahdollisuus enemmän, koska Playwright-dokumentaatiossa todetaan, että se on suunniteltu tukemaan minkä tahansa kielen sidoksia. Kun kaikki GitHub-koodit ovat käytettävissä, sinulla on mahdollisuus luoda omat sidokset valitsemallesi testikielelle ja lähettää ne vetopyynnönä projektiin.

$config[zx-auto] not found$config[zx-overlay] not found