Kuinka ratkaista yleiset Web-käyttöliittymän testiautomaatio-ongelmat Katalon Studion ilmaisen työkalusarjan avulla

“Jos loppukäyttäjä havaitsee huonoa suorituskykyä verkkosivustoltasi, hänen seuraava napsautus on todennäköisesti sinun-competition.com.” - Ian Molyneaux

Verkkosivustoteknologian edistyminen tekee verkkopohjaisista sovelluksista monipuolisempia, joten web-testauksen automatisointi on entistä haastavampaa.

Verkkosivutekniikan ominaisuudet, kuten monialustainen tuki, selainten välinen reagoiva suunnittelu, saattavat lisätä ongelmia ja vaivaa Web-käyttöliittymän testiautomaatiostrategioihin.

Joten jos olet aloittelija ja aloitat verkon käyttöliittymätestauksen automatisoinnista, tässä on esimerkkejä siitä, kuinka käsitellä yleisiä ongelmia ja tehdä automaatiotestauksesta tehokkaampaa.

Lue lisää: Testiautomaation viisi suurta haastetta

(Web) UI-testien automatisoinnin yhteiset haasteet

  • Odotajankohdat
  • Iframe-julkaisut
  • Ponnahdusikkunat automatisoinnissa
  • Syviä sisäkkäisten elementtien sijaintiin liittyviä ongelmia

Oppitaan kuinka ratkaista nämä käyttöliittymäautomaatio-ongelmat Katalon Studio -työkalun avulla.

Katalon Studio on ilmainen, mutta tehokas automatisointityökaluverkko verkko- ja mobiilisovellusten testaamiseen. Se on helppo asentaa, ja testaajat voivat nopeasti luoda, suorittaa, raportoida ja ylläpitää automatisoituja testejään.

Tämä on Katalon Studion avulla rakennettu esittelyprojekti. Tavoitteena on auttaa sinua yllä mainittujen Web UI -testausautomaatio-ongelmien käsittelyssä. Voit myös ladata Katalon Studion ja esittelyprojektin tämän artikkelin alla olevista linkeistä.

# 1) Odotajankohdat ja ratkaisuehdotus

Mikä on odottelu?

Odotus on taktiikka, jota käytetään testiautomaatio-skripteissä luodaksesi tauon komentosarjavaiheiden väliin odottaessasi ladattavia elementtejä tai sovellusta vastaamaan.

Älykkäät odottamat kysymykset (selkeät odotukset ovat älykkäitä odotuksia, jotka rajoittuvat tiettyyn verkkoelementtiin) auttavat ratkaisemaan ”väärät hälytykset” asioista, joita suunnittelijat analysoivat arvioitavana.

Komentosarjan virheinä eikä sovellusvirheinä. Kun testi epäonnistuu itse skriptin takia eikä sovelluksen / verkkosivun virheen vuoksi, sitä kutsutaan väärään virheeksi.

Nämä ovat joitain yleisiä esimerkkejä siitä, mikä voi johtaa väärään virheeseen:

  • Väärä epäonnistuminen: Yksi suurimmista havaitsemistamme virheistä on, kun skripti epäonnistuu “väärä epäonnistuminen” sovelluksen odottamisen vuoksi. Usein johtuu verkon viiveestä, tietokantapyynnöistä tai monista sovelluksen tai verkkosivun toimintoihin liittyvistä asioista.
  • Kohdennettua elementtiä, jota ei ole sivulla: Tällainen virhe ilmenee, kun odotetaan elementtien näkymistä TAI renderointia selaimessa. Sovellus saattaa olla käynnissä, mutta tiettyjä elementtejä ei ehkä ole ladattu, mikä tekee testikomentosarjasta epäonnistuneen.

Kuinka lähestyä näitä komentosarjan virheitä tapahtui yllä kuvattujen Odota-ongelmien vuoksi?

Sen sijaan, että lisääisit satunnaisia ​​5–10 sekuntia odottaa jokaista vaihetta, voit kokeilla yhtä seuraavista vaihtoehdoista:

  • Globaali muuttuja - Globaali muuttuja on muuttuja, jolla on globaali laajuus, mikä tarkoittaa, että se on näkyvissä koko ohjelman ajan. Voit harkita 3-tyyppisten globaalien muuttujien määrittämistä testiskriptissäsi lyhyt, keskimääräinen ja pitkä. Käytä näitä muuttujia testikomentosarjoissasi verkkosovelluksesi vastausajan mukaan.
  • Odota sivun lataamista - Tämä logiikka odottaa sivun latautumista kokonaan, ennen kuin suoritat vaiheen komentosarjaasi.
  • Odota elementin läsnäoloa - Joskus verkkoelementtien näkyminen sivulla vie kauemmin, kun selaat sivuja tai napsautat painikkeita tai teet jotain muuta. “WaitForElementPresent” -komento keskeyttää seleenin, kunnes kohdennettua elementtiä ei ole sivulla. Kun elementti ilmestyy sivulle, seleeni menee seuraavan komennon suorittamiseen.

Katalon Studio Test Script:

Tuo sisäinen.GlobalVariable;
importcom.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords as WebUiBuiltInKeywords
Tuo com.kms.katalon.core.model.FailureHandling as FailureHandling
Tuo com.kms.katalon.core.testcase.TestCaseFactory TestCaseFactory-tiedostona
Tuo com.kms.katalon.core.testobject.ObjectRepository nimellä ObjectRepository
Tuo com.kms.katalon.core.testdata.TestDataFactory nimellä TestDataFactory
Tuo com.kms.katalon.core.testcase.TestCase TestCase-tiedostona
Tuo com.kms.katalon.core.testdata.TestData TestData-tiedostona
Tuo com.kms.katalon.core.testobject.TestObject testObject-tiedostona
importcom.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords as WebUI
importcom.kms.katalon.core.mobile.keyword.MobileBuiltInKeywords as mobile
importcom.kms.katalon.core.webservice.keyword.WSBuiltInKeywords as WS
tuo staticcom.kms.katalon.core.testobject.ObjectRepository.findTestObject
tuo staticcom.kms.katalon.core.testdata.TestDataFactory.findTestData
tuo staticcom.kms.katalon.core.testcase.TestCaseFactory.findTestCase
'Avaa selain ja siirry Katalon-sivustoon'
WebUI.openBrowser ( 'https://katalon.com/')
'Odota, kunnes Katalon Studio -sivu latautuu odottamalla, jota käytetään globaalina muuttujana'
WebUI.waitForPageLoad (GlobalVariable.G_Timeout_Small)
'Napsauta \' Kirjaudu \ '-painiketta siirtyäksesi sisäänkirjautumissivulle'
WebUI.click (findTestObject ( 'Page_KatalonHomepage / btn_Login'))
'Syötä käyttäjänimi'
WebUI.setText (findTestObject ('Page_KatalonLogin / txt_Username'), käyttäjänimi)
'Syötä salasana'
WebUI.setText (findTestObject ('Page_KatalonLogin / txt_Password'), salasana)
'Napsauta \' Kirjaudu \ '-painiketta kirjautuaksesi sisään'
WebUI.click (findTestObject ( 'Page_KatalonLogin / btn_Submit'))
'Odota, että epäonnistunut kirjautumisviesti on läsnä'
WebUI.waitForElementPresent (findTestObject ('Page_KatalonLogin / div_LoginMessage'), GlobalVariable.G_Timeout_Small)

Yllä luotu testikomentosarja osoittaa globaalin muuttujan ja Katalon Studion sisäänrakennettujen avainsanojen käytön.

# 2) Iframe-kysymykset ja ratkaisumenetelmä

Mikä on iframe?

Se on HTML-asiakirjan sisäinen kehys, joka on upotettu verkkosivuston toiseen HTML-asiakirjaan. Iframe-elementtiä käytetään sisällön lisäämiseen verkkosivulta muista lähteistä.

Miksi on tärkeää osata testata iframe-kehyksiä?

Tekstin ja objektien tarkistaminen Iframe-kehyksissä voi olla haaste. Vaikka sinäkin (ihmisen testaajana) näet tekstin, automaatiotyökalut eivät ota tekstiä yksilöimällä kohdetta. Sinun on kerrottava käsikirjoituksellesi, miten iframe-kehykset kulkevat, ja valittava oikea iframe-kehys, jossa teksti ja kohde ovat.

Esimerkit Iframe-kehyksestä:

# 1) Katalon Studio -foorumin iframe

Kuva 1: Näyttää iframe tunnistettu ja siepattu

Voit nähdä, että Katalon Studio Object Spy valitsee iframe-kehyksen punaisella korostetulla alueella.

Kuva 2: Katalon Studio Object vakooja

Katalon Studio -objektivakoilija havaitsi ja sieppasi kommentin iframe-kehyksen (kuva 1) tarvittaessa objektien todentamiseksi kyseisessä iframe-kehyksessä.

# 2) JQueryUI-vedä ja pudota -esimerkki:

Kuva 3: Näyttää JQueryUI-Vedä ja pudota iframe-alueen valinnan

Voit vetää "Vedä minut ympärille" -objektin muihin iframe-kehyksen alueisiin.

Kuva 4: Katalon Studio Object vakooja

Katalon Studio Object Spy havaitsi ja vangitsi iframe-kehyksen, kuten yllä kuvassa 3 esitetään.

Tyypillinen ratkaisu auttaisi sinua tunnistamaan lähde- ja kohdeelementit sekä oikean selainistunnon yhteydessä. Työkalut, kuten Selenium, tarjoavat vetämällä ja pudottamalla käsitelläksesi tätä kysymystä jossain määrin.

Ratkaisu Iframe-kehyksen testaamiseen Katalon Studion avulla:

Alla on muutamia vinkkejä vuorovaikutukseen vetämällä ja pudottamalla -objektin kanssa iframe-kehyksessä Katalon Studion avulla.

Tuo com.kms.katalon.core.testobject.ObjectRepository nimellä ObjectRepository
tuo com.kms.katalon.core.mobile.keyword.MobileBuiltInKeywords as mobile
Tuo com.kms.katalon.core.webservice.keyword.WSBuiltInKeywords as WS
tuo staattinen com.kms.katalon.core.testobject.ObjectRepository.findTestObject
tuo staattinen com.kms.katalon.core.testdata.TestDataFactory.findTestData
tuo staattinen com.kms.katalon.core.testcase.TestCaseFactory.findTestCase
Tuo com.kms.katalon.core.testcase.TestCase TestCase-tiedostona
Tuo com.kms.katalon.core.testdata.TestData TestData-tiedostona
Tuo com.kms.katalon.core.testobject.TestObject testObject-tiedostona
Tuo com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords as WebUiBuiltIn Keywords
Tuo com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords as WebUI
Tuo sisäinen.GlobalVariable nimellä GlobalVariable
'Avaa selain ja siirry jQuery-käyttöliittymän sivulle'
WebUI.openBrowser ( 'http://jqueryui.com/')
'Maksimoi nykyinen selainikkuna'
WebUI.maximizeWindow ()
'Napsauta \' Vedä \ 'linkkiä'
WebUI.click (findTestObject ( 'Page_jQuery_Homepage / lnk_Draggable'))
'Vaihda esittelypaneelin iframe-kehykseen'
WebUI.switchToFrame (findTestObject ('Page_jQuery_Drag ja pudota esimerkki / ifr_Demo-kehys'), GlobalVariable.G_Timeout_Small)
'Vedä ja pudota iframe-kehys toiseen asentoon'
WebUI.dragAndDropByOffset (findTestObject ('Page_jQuery_Drag and Drop Example / div_Frame_Draggable'), 200, 38)
WebUI.closeBrowser ()

Yllä luotu testikomentosarja on tarkoitettu vetämistoimintoon. Katalon Studio antaa sinun muokata vahvistusvaiheita komentosarjan välillä, jotta voidaan vahvistaa tietty objekti iframe-kehyksessä.

# 3) Ponnahdusikkunat ja ratkaisumenetelmä

Mikä on ponnahdusikkuna?

Ponnahdusikkuna on graafisen käyttöliittymän (GUI) näyttöalue, yleensä pieni ikkuna, joka ilmestyy (”ponnahdusikkuna”) visuaalisen käyttöliittymän etualaan.

Onko sinulla ponnahdusikkunoita?

Ihmisenä sinulla on kyky reagoida testauksen aikana tapahtuviin toimiin, kuten odottamatta tapahtuvaan ponnahdusikkunaan. Mutta koodina, jonka kooderi on kirjoittanut, voit tehdä vain sen, mitä kooderi on käskenyt sinun tekevän, ja se rajoittaa kykyäsi reagoida odottamattomiin käyttäytymisiin, kuten ponnahdusikkunaan.

Alla on muutama yleisesti käytetty pop-up-esimerkki, joka saattaa olla este web-automaatiolle:

1) Uusi selainikkuna

2) Hälytys: Hälytysruutua käytetään usein varmistamaan, että tiedot tulevat käyttäjän läpi

3) Mukautettu modaalivalintaikkuna: Modaalivalintaikkuna on valintaikkuna / ponnahdusikkuna, joka näkyy nykyisen sivun yläosassa.

4) Alkuperäinen ponnahdusikkuna

Ratkaisu ponnahdusikkunoiden käsittelemiseen Katalon Studion kanssa:

Alla on muutamia vinkkejä vuorovaikutukseen ponnahdusikkunoiden kanssa Katalon Studion avulla.

Tuo com.kms.katalon.core.annotation.SetUp as Setp
Tuo com.kms.katalon.core.annotation.TearDown nimellä TearDown
Tuo com.kms.katalon.core.model.FailureHandling as FailureHandling
Tuo com.kms.katalon.core.testobject.ObjectRepository nimellä ObjectRepository
Tuo com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords as WebUiBuiltIn Keywords
Tuo com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords as WebUI
tuo com.kms.katalon.core.mobile.keyword.MobileBuiltInKeywords as mobile
Tuo com.kms.katalon.core.webservice.keyword.WSBuiltInKeywords as WS
tuo staattinen com.kms.katalon.core.testobject.ObjectRepository.findTestObject
tuo staattinen com.kms.katalon.core.testdata.TestDataFactory.findTestData
tuo staattinen com.kms.katalon.core.testcase.TestCaseFactory.findTestCase
Tuo com.kms.katalon.core.testcase.TestCase TestCase-tiedostona
Tuo com.kms.katalon.core.testdata.TestData TestData-tiedostona
Tuo com.kms.katalon.core.testobject.TestObject testObject-tiedostona
Tuo java.util.Formatter.DateTime kuin DateTime
Tuo sisäinen.GlobalVariable nimellä GlobalVariable
'Avaa selain ja siirry korotetulle sivustolle'
WebUI.openBrowser ( 'http://www.elated.com/articles/javascript-tabs/')
'Maksimoi nykyinen selainikkuna'
WebUI.maximizeWindow ()
'Napsauta' 'Tweet' -painiketta iframe-kehyksessä '
WebUI.click (findTestObject ( 'Page_Elated / lnk_Tweet'))
'Vaihda ikkunaan, jonka otsikko on' Jaa linkki Twitterissä '
WebUI.switchToWindowTitle ('Jaa linkki Twitterissä')
'Syötä käyttäjätunnus'
WebUI.setText (findTestObject ('Sivu_Jaa linkki Twitterissä / txt_Twitter_Login_Username'), sähköposti)
'Kirjoita salasana'
WebUI.setText (findTestObject ('Sivu_Jaa linkki Twitterissä / txt_Twitter_Login_Password'), salasana)

Yllä luotu testikomentosarja, joka näyttää Katalon Studion sisäänrakennettujen avainsanojen käytön.

E.g .: switchToWindowTitle sisäänrakennettu avainsana auttaa sinua käsittelemään ponnahdusikkuna -ongelman.

XPath-pesintäongelmat ja ratkaisuehdotus

Mikä on XPATH?

XPath-lauseke on mekanismi selaamiseen ja solmujen valitsemiseen XML-dokumentista tai sitä voidaan käyttää HTML-elementtien paikantamiseen.

Tässä on esimerkki sisäkkäisestä elementistä:

1 
2 10

# 4) Syvät sisäkkäisten elementtien tunnistusongelmat

On vaikea tunnistaa elementti, jota haluat käyttää, varsinkin kun ne ovat syvästi sisäkkäisiä, kuten yllä olevassa komentosarjan 'a' -elementissä esitetään.

Sinulla voi olla vaikeaa kirjoittaa XPath manuaalisesti, jos sinulla ei ole vankkaa XPath-tietämystä päästäksesi kyseiseen 'a' -elementtiin automaatiotestaustyökalulla.

Kuinka tunnistaa sisäkkäiset elementit helposti?

  • Käytä XPath: XPath on tehokas tapa löytää elementtejä, jos niitä ei voida tunnistaa tunnuksella, nimellä tai muulla määritteellä JA kun ne ovat syvästi sisäkkäisiä. Polun manuaalinen tunnistaminen on kuitenkin vaikeaa ilman toimintojen rakentaneiden insinöörien oikeaa työkalua TAI.
  • Käytä Katalon Studiota: Katalon Studio voi luoda älykkään ja optimoidun XPathin. Se tunnistaa elementin lähimmän yksilöivän vanhemmuussolmun perusteella, joten sinun ei tarvitse etsiä DOM-puusta.
Kuva 7: Katalon Studio Object Spy

Katalon Studio tuotti sinulle optimoidun XPath-tiedonsiirron automaattisesti, kun vakoilet “Rekisteröidy nyt” -objektia.

Tämä on Katalon Studion avulla rakennettu esittelyprojekti. Tavoitteena on auttaa sinua yllä mainittujen Web UI -testausautomaatio-ongelmien käsittelyssä. Voit ladata Katalon Studion ja esittelyprojektin alla olevasta linkistä.

  • Ilmainen latauslinkki - Katalon Studio
  • Lataa myös - Demo Project

johtopäätös:

Vaikka verkkotestauksen automatisointi voi olla vaikeaa, toivomme, että tässä artikkelissa ehdotetut ratkaisut voivat auttaa sinua käsittelemään yleisiä web-testien automatisointiongelmia ja lisäämään arvoa testiautomaatioosi.

Katso tämä käytännön video siitä, kuinka vältetään yleiset Web UI Automation -riskit

= >> Napsauta tätä katsoaksesi videota

Tietoja kirjoittajasta: Tämä on vierasartikkeli Abhishek Kumarilta. Hän on KMS Technologyn tuotepäällikkö. Hän yhdistää strategisen ja taktisen johtamisen asiantuntemuksen ja vahvan pätevyyden ohjelmistojen kehittämisessä, ohjelmistojen testauksessa, testiautomaatioissa, tuotehallinnassa, uuden yrityksen perustamisessa, liiketoiminnan kehittämisessä, projektinhallinnassa ja yleisessä toiminnassa.

Voit kokeilla tätä ilmaista työkalua verkko- tai mobiilisovelluksen automaatiotestaukseen ja ilmoittaa meille, jos sinulla on ongelmia / kyselyjä sitä käytettäessä.

Lue lisää: Testiautomaation viisi suurta haastetta

Lähde: Kuinka ratkaista yleiset Web-käyttöliittymän testiautomaatio-ongelmat Katalon Studion ilmaisen työkalusarjan avulla