Magento projektek automata tesztelése Seleniummal

Egy Magento webáruháznál elengedhetetlen a kifogástalan működés, ehhez viszont, precíz, pontos tesztelésre van szükség. Ebben lehet óriási segítségünkre a Selenium, amellyel egyszerűen, időt és költséget spórolva, hatékonyan tesztelhetjük webáruházunkat, melynek köszönhetően webáruházunk magasabb színvonalon szolgálhatja ki a látogatókat.



Ebből a cikkből kiderül, hogy: 

  • Miért a Selenium-ot válaszd?
  • Mikor éri meg a legjobban használni?
  • Hogyan és miből épül fel a Selenium?
  • Hogyan töltsd le?
  • Mik a funkciói? Hogyan használd?
  • A cikk legvégén pedig egy egyszerű példával mutatom be a folyamatot.

 

Tarts velem!

magento selenium teszter bea

 

Egy e-kereskedelmi vállalkozónak, napjaink kiélezett versenykörnyezetében, muszáj követnie a piacon történő változásokat, és ő maga is rendszeresen változtatásokat kell, hogy végezzen a honlapon.

Ezek a kisebb változtatások teszik lehetővé, hogy válaszoljon a legújabb trendekre és lépést tartson versenytársaival. Ez a változás lehet egy új termék, ajánlat, kedvezmények, szállítási módok, fizetési módok és még sok más.

A rendszeres módosítások közben, a cégek „zökkenőmentes” felhasználói élményt kell biztosítsanak, különben ez negatív és nem kívánt eredményekhez vezethet. Ennek érdekében a tesztelőknek folyamatosan ellenőrizniük kell a honlapot és kiszűrniük a hibákat. A webfejlesztő cégek agilis módszertan szerint dolgoznak, ahol a „sprint”-ek elég rövidek, és minden változtatás után szükséges átfogó, regressziós teszteteket végezni. Sajnos, amikor a változtatások túl gyakoriak, a manuális tesztelés monotonná válhat, és sok időt vehet igénybe. Előbb-utóbb valamiféle „könnyítést” kell alkalmaznunk.

 

Itt jön képbe a Selenium. Lássuk csak, miért.

 

 

1) Miért a Selenium?

 

SELENIUM:

A Selenium egy Firefox bővítmény, amely Black Box jellegű felületi tesztek készítésére ad lehetőséget. Ez annyit jelent, hogy az alkalmazás egészét teszteljük anélkül, hogy ismernénk annak belső működését. A tesztesetek felvétele a Selenium IDE Firefox plugin segítségével történik, amely automatikusan rögzíti a böngészőben végrehajtott műveleteket.

 

Ez nagyon megkönnyítheti a tesztelők életét, mert a tesztek gyorsan, de mégis  optimális módon fejlődnek és ez nagyon költséghatékony lehet. Továbbá a Selenium IDE egy fantasztikusan „segítőkész” eszköz, mert hatékonyan, gyorsan és robotszerűen hajt végre olyan lépéseket, melyek után az alkalmazás tesztelhetővé válik, és olyan állapotba segíti a szoftvert, amelyet manuálisan unalmas, fáradalmas elérni, tesztelni. Ha automatizálod az utat, mellyel eléred ezt a pontot, akkor nem leszel fáradt és ideges, illetve képes leszel továbbra is a tesztelési tudásod legjavát adni.

 

Az automata tesztek bevezetésének számtalan előnye van. Nézzünk is meg egy párat:

  • Lehetőség van a tesztesetek ismételt visszajátszására
  • A teszteseteket párhuzamosan hajthatjuk végre
  • Felügyelet nélkül is futtathatjuk a teszteket
  • Növeli a pontosságot és nagymértékben csökkenti az emberek által generált hibákat
  • Időt és pénzt takaríthatunk meg

 

Itt felmerül néhány fontos kérdés:

  • Mi a legjobb eszköz arra, hogy automatizáljam a teszteseteimet?
  • Milyen költségekkel jár?
  • Mennyire könnyű alkalmazni?

 

A fenti kérdések tekintetében, a webes alkalmazások esetében, ahogy fent is említettem, a Selenium egy nagyon jó megoldás. Miért?

  • Könnyen használható
  • Ingyenes (Open source)
  • Nagy felhasználói adatbázissal és segítő közösséggel rendelkezik
  • Több programozói nyelvet támogat

 

2) Mikor érdemes használni?

A Selenium IDE egy könnyen használható eszköz egyszerű tesztesetekre, de a komplexebbekre (ahol például több elágazás van) már kevésbé az.

 

A Selenium-os tesztek készítése akkor éri meg a leginkább, amikor a felület már nem nagyon módosul, de a mögöttes logika, szolgáltatások vagy a háttérrendszerek fejlesztése még folyamatban van. Selenium-os felületi tesztek készítésével a tesztek bármikor visszajátszhatók így szükség szerint folyamatosan értesülhetünk a tesztjeink lefutási eredményeiről!

 

3) Hogyan és miből épül fel?

A Selenium nemcsak egy egyedülálló eszköz, melyet csak egymagában lehet használni, sokkal inkább egy különböző teszteszközökből álló csomag.

Ez a csomag a következő komponensekből tevődik össze:

  • Selenium Integrated Development Environment (IDE) 01-selenium-ide-ikon
  • Selenium Remote Control (RC) 02-selenium-rc-ikon
  • Selenium WebDriver
  • Selenium Grid 03-selenium-grid-ikon

 

A felhasználó saját igényei szerint választhat ezek közül az eszközök közül.

04-selenium-csomag

 

  1. Selenium IDE

A Selenium IDE a legegyszerűbb a Selenium Csomag eszközei közül. A Rögzítés és a Visszajátszás funkció teszi kivételesen könnyűvé a megtanulását, hiszen semmilyen vagy csak minimális programozói hozzáértést igényel.

 

  1. Selenium RC (Selenium Remote Control)

A Selenium RC (Selenium 1) egy Java-ban írt eszköz, amely teszt script-ek létrehozását teszi lehetővé webes alkalmazásokhoz, a kívánt programozói nyelven, valamint ezek futtatását is elvégzi.

Ez az eszköz önmagában már nem igazán használatos.

 

  1. Selenium Grid

A Selenium Grid egy új funkciót tesz elérhetővé, mégpedig azt, hogy a Selenium

RC-ben írt teszteket egy időben több böngészőben és platformon futtathatjuk.

 

  1. WebDriver

A WebDriver egy különálló eszköz, de nagyon sok előnye van, főleg a Selenium RC-vel karöltve. A kettő összeolvadását gyakran Selenium 2-nek nevezik. A WebDriver közvetlenül eléri azokat a böngészőket, amelyek támogatják az automatizálást.

 

Támogatott böngészők:

05-selenium-tamogatott-bongeszok

 

Támogatott programozói nyelvek:

06-selenium-tamogatott-programnyelvek

 

Támogatott operációs rendszerek:

07-selenium-tamogatott-operacios-rendszerek

 

4) Hogyan töltsd le?

 

Első lépés:

Nyisd meg a böngészőt (Firefox) és írd be a Seleniumhq URL-t. Ez a hivatalos oldala a Selenium-nak. Nyomj a „Download” fülre, itt megtalálod a Selenium összes eddigi verzióját.

08-selenium-letoltes

 

Második lépés:

A Selenium IDE bejegyzés alatt találsz egy linket, melyre rákattintva a Firefox bővítmény oldalára kerülsz, ahonnan azonnal letölthető és telepíthető.

09-selenium-letoltes-telepites

 

Harmadik lépés:

Klikkelj az „Add to Firefox” gombra.

10-selenium-ide-firefox

 

Negyedik lépés:

Klikkelj a „Telepítés” gombra.

11-selenium-telepitese

 

Ezzel készen is vagyunk, már meg is jelent a böngésződben a jobb felső sarokban a Selenium IDE ikonja. Innen tudod később indítani a programot. Ha ráklikkelsz már meg is jelenik a Selenium ablak.

 

12-selenium-telepites-ide

 

5) A Selenium funkciói és használata

 

Nézzük meg részletesen a menüpontokat és a funkciókat.

Sajnos a Selenium kisebb hibái közé tartozik, hogy egyes elnevezések magyarul, mások pedig angolul jelennek meg, de a csatolt képeken jól látszik minden, remélem így is érthető lesz mindenki számára.

 

1) Menüsor

A menüsor az Selenium ablak felső részén van elhelyezve. Öt részből áll:

  • Fájl
  • Szerkesztés
  • Actions (Műveletek)
  • Options (Opciók)
  • Súgó

 

1.1 Fájl menü

A Fájl menü nagyon hasonló bármely más alkalmazásban használt menühöz. Lehetőséget nyújt a felhasználó számára, hogy:

  • Új tesztesetet hozzon létre, meglévőt kinyisson, vagy elmentse a jelenlegit.
  • Kiexportálhasson egy adott tesztesetet vagy egy teszteset csoportot, a kívánt programozási nyelven, az „Export Test Case As” és „Export Test Suite As” opciókkal. Az első a jelenleg aktív tesztesetet exportálja, míg a második az összes nyitva lévőt.
  • Bezárhassa a tesztesetet

 

13-selenium-menu-fajl

 

A Selenium IDE tesztesetek a következő formátumban menthetőek el:

  • HTML formátum

 

A Selenium IDE tesztesetek a következő formátumban/programozási nyelven exportálhatók:

  • java (Java-ban exportálva)
  • rb (Ruby-ban exportálva)
  • py (Python-ban exportálva)
  • cs (C#-ben exportálva)

 

1.2.  Szerkesztés menü

14-selenium-menu-szerkesztes

 

A Szerkesztés menü olyan opciókat biztosít, mint a Visszavonás, Újra, Kivágás, Másolás, Beillesztés, Törlés és a Minden kijelölése, amelyek általában minden Szerkesztés menüben jelen vannak, valamint ezek mellet még a következők állnak rendelkezésünkre:

  • Insert New Command (Új parancs beszúrása) ‒ ez lehetővé teszi a felhasználó számára, hogy a teszteseten belül felvegyen egy új parancsot
  • Insert New Comment (Új hozzászólás beszúrása) ‒ ez lehetővé teszi a felhasználó számára, hogy a teszteseten belül beszúrjon egy hozzászólást, amivel a későbbi parancsokat magyarázza.

 

Insert New Command

Az új parancs a kijelölt parancs/lépés fölé kerül.

14-selenium-uj-parancs

 

A felhasználó most beszúrhatja az új parancsot, kitöltve a Target (Cél) és Value (Érték) mezőket.

15-selenium-uj-parancs-target-value

 

Insert New Comment

Az új hozzászólás ugyanúgy kerül be, mint a parancs.

16-selenium-uj-hozzaszolas

 

A lila szín jelöli, hogy ez egy hozzászólás/magyarázat.

 

1.3. Actions (Műveletek) menü

17-selenium-muveletek-actions-menu

 

 

 

Az Actions menüben a következő lehetőségek közül választhatunk:

 

  • Record (Rögzítés) – Erre a gombra kattintva a Selenium IDE el kezdi rögzíteni a Firefox böngészőben végrehajtott lépéseket.
  • Play entire test suite – Ez az opció lefuttatja az ehhez a teszt csoporthoz tartozó összes tesztesetet.
  • Play current test case – Ez az opció a jelenleg aktív, kijelölt tesztesetet futtatja le.
  • Pause/Resume – A teszteset futását szüneteltetni és folytatni is lehet.
  • Toggle Breakpoint – A felhasználó beszúrhat egy vagy akár több töréspontot a tesztbe, így bármely lépésnél leállásra kényszerítheti a tesztet.
  • Set/Clear Start Point – Itt egy kezdő pontot adhatunk meg, bármelyik lépéshez, ezután innen fog indulni a teszt.
  • Ugyanitt tudjuk állítani a teszt futásának sebességét is a „Faster, „Fastest”, „Slower” és a „Slowest opciókkal.

 

1.4 Options (Opciók) menü

18-selenium-opciok-options-menu

 

Az Options menü lehetőséget ad a felhasználónak, hogy gyakorolhassa a Selenium IDE által támogatott beállítások kezelését, „játszadozhat” az általános beállításokkal (General), az elérhető formátumokkal (Formats), az elérhető bővítményekkel (Plugins) és az elérhető helymeghatározókkal és azok sorrendjével (Locator Builders).

 

19-selenium-opciok-options-menu-general-altalanos

 

1.5. Súgó menü

 

Ha elakadtunk, itt nézhetjük meg a dokumentációkat, itt jelenthetjük be, ha hibát észleltünk és innen tudunk eljutni a Selenium hivatalos weboldalára vagy blogjára.

 

 

2) Az URL sáv

 

Az URL sáv ugyanolyan és nagyjából úgy működik, mint egy böngészőben. Megjegyzi a korábban látogatott oldalak címét, így később csak ki kell választanunk, ami nagyban megkönnyíti a dolgunkat, főleg, ha már nem tudjuk megjegyezni és észben tartani mindegyik weboldal címét, amin dolgozunk.

20-selenium-url-sav

 

3) Eszköztár

 

21-selenium-eszkoztar

 

Az eszköztár közvetlenül az URL sáv alatt található és a következő opciókat tartalmazza:

 

  • Playback Speed – Itt lehet állítani a teszt futtatásának sebességét. 22-selenium-eszkoztar-playback-speed
  • Play test suite – Ezzel a gombbal az összes tesztesetet futtathatjuk, ami jelen éppen meg van nyitva. 23-selenium-eszkoztar-play-test-suite
  • Play test case – Ezzel a gombbal az éppen aktív tesztesetet futtathatjuk. 24-selenium-eszkoztar-play-test-case
  • Pause – Szüneteltethetjük a teszt futását. 25-selenium-eszkoztar-pause
  • Step – A felhasználó átléphet egy adott parancsot, egyszerre csak egy parancsot végrehajtva. Általában hibajavításnál használatos. 26-selenium-eszkoztar-step
  • Rollup – Összevonhatunk két vagy több lépést. 27-selenium-eszkoztar-rollup
  • Record – Ezzel a gombbal indíthatjuk és le is állíthatjuk a rögzítést. 28-selenium-eszkoztar-record

 

4) Szerkesztő

 

A szerkesztő az az ablak, ahol a teszteset lépéseit láthatjuk, ide kerülnek be az újonnan rögzített parancsok is. A szerkesztőnek két nézete van:

 

1) Táblázat (Table) nézet

29-selenium-tablazat

 

2) Forrás (Source) nézet

Itt a teszteset HTML formátumban jelenik meg.

30-selenium-forras-nezet

 

A Szerkesztőben a felhasználónak lehetősége nyílik begépelni a parancsokat, a Selenium már az első karakter begépelése után felajánlja a lehetséges opciókat.

A Select gombra kattintva kiválaszthatjuk az adott elemet közvetlenül a böngészőből, úgy, hogy ráklikkelünk.

A Find gomb az adott érték alapján rámutat a hozzá tartozó elemre a böngészőben.

31-selenium-find

 

5) Test Case ablak

32-selenium-test-case-ablak

 

Itt fog megjelenni a legújabb teszteset, de mivel a Selenium-ban lehetőség van arra, hogy egyszerre több tesztesetet is megnyissunk, az összes itt lesz felsorolva. Így könnyen kiválaszthatjuk, hogy éppen melyiken szeretnénk dolgozni. Egy teszt-re kattintva a Szerkesztő ablakban megjelennek annak lépései.

Itt jelennek meg a lefuttatott teszt eredményei is, amit a Selenium IDE két színnel jelöl: a pirossal és a zölddel.

  • A Piros szín a hibákat illetve a teszt elbukását jelöli
  • A Zöld szín a sikeres tesztesettel társítható

 

6) Log (Napló) ablak

33-selenium-naplo-log-ablak

 

A Log fülön információkat láthatunk, üzenetek formájában, mindegyik lépésről külön-külön, annak lefutásának pillanatában. Itt jelenik meg az is, ha hiba van a tesztben vagy elbukott, piros színnel jelölve, így a későbbiekben könnyen javíthatjuk a tesztünket.

Itt találhatjuk, többek között a Reference fület is, ahol részletes leírást kapunk egy adott parancsról, és az Expert fület is, amelyet egy kiegészítő ad hozzá a Seleniumhoz. Itt tippek és javítási ötletek jelennek meg, amelyeket azonnal elvégezhetünk az Inspect, majd Fix gombra való kattintással.

Ezzel nagyjából elérkeztünk a bemutatás és az elméleti rész végéhez. Egy rövidebb példával zárnám a cikkemet, hogy gyakorlatban is lássuk a fent leírtakat. Ez tényleg egy egyszerű teszteset, ennél jóval összetettebbekkel is össze lehet állítani, de nem szerettem volna túlbonyolítani, hisz nem ez a cikkem lényege.

 

Példa

 

Egy teszt „script” összeállítása 3 nagy lépésből áll:

  1. Rögzítés – A Selenium IDE rögzít minden kattintást és műveletet, amit a böngészőben hajtottunk végre.
  2. Visszajátszás – A már összerakott tesztesetet többször vissza kell játszanunk, hogy meggyőződjünk arról, hogy jól működik, esetleg javítsuk, csiszoljunk rajta.
  3. Mentés – Ha a teszt megfelelően stabil, ajánlott elmenteni, hogy a jövőben bármikor újra használhassuk.

 

Rögzítés

 

Első lépés

Indítsuk el a Firefox böngészőt és ezzel együtt a Selenium-ot is, az eszköztárban található ikonra kattintva.

 

Második lépés

Írjuk be a tesztelni kívánt weboldal címét (https://accounts.google.com) az URL sávba.

34-selenium-url-tesztelesre

 

Harmadik lépés

A Record gomb alapértelmezetten be van kapcsolva, ha mégsem, ne felejtsük el bekapcsolni, különben nem rögzíti a lépéseket.

 

Negyedik lépés

Nyissuk meg az adott weboldalt (accounts.google.com) Firefox-ban.

 

35-selenium-google-bejelentkezes

 

 

Ötödik lépés

Írjunk be egy létező és valós e-mail címet.

 

Hatodik lépés

Írjuk be az e-mail címhez tartozó jelszót.

 

Hetedik lépés

Kattintsunk a „Sign In” vagy „Bejelentkezés” gombra, a belépés befejezéséhez.

 

Nyolcadik lépés

Végül leállíthatjuk a rögzítést a piros gombbal, és visszajátszhatjuk a tesztesetünket.

 

Figyelem! Ha a tesztesetbe nem rögzítettük bele a Kijelentkezés lépést, a visszajátszás előtt midnenképp szükséges ezt a lépést megtenni, különben a Selenium nem fogja megtalálni a szükséges mezőket vagy gombokat.

 

Visszajátszás

Most, hogy elkészült a tesztünk, szükséges visszajátszani, hogy megnézzük, elég stabil-e. Kattintsunk a „Play current test case” gombra.

 

36-selenium-replay

 

Mentés

Ha minden rendben van, elmenthetjük a script-et, a Fájl -> Mentés másként opcióra kattintva.

 

ÖSSZEGZÉS

Egyértelmű cél, hogy weboldalunk minőségét fokozzuk és pozitív felhasználói élményt nyújtsunk. Ám ezentúl fontos szempont az is, hogy az ezen dolgozó emberek szeressék és élvezzék a munkájukat, hogy a legjobbat nyújthassák.

Összesítésben a Selenium egy nagyon hasznos eszköz, amivel megkönnyíthetjük a tesztelőink munkáját, mellyel jobb minőséget érhetnek el. Ahogy a fentiekből is kiderül, nagyon egyszerű a használata, de sok gyakorlást igényel, ha komplexebb feladatokat kívánunk megoldani.

 

Szász Beáta

Szász Beáta

QA

Bea a dedikált tesztelő csapatunk tagja. Kedves mosolya mögött könyörtelen vadászösztön lapul. A legjobban elrejtőzött bugok sem érezhetik biztonságban magukat, esélyük nincs kikerülni az éles oldalra. Szereti a kutyákat, szabadidejében imád fotózni, autózni és zenét hallgatni.


SZÜKSÉGE VAN EGY MEGBÍZHATÓ, PROFI MAGENTO FEJLESZTŐ PARTNERRE?

Kérjük, keressen bennünket, ha bármilyen kérdése, igénye lenne új vagy meglévő webáruház készítésével, megújításával kapcsolatban!

Next