Selenium - Bevezetés a webes felületi teszteléshez

Frissítve: 2011.11.04.  

Gyakori, hogy az elkészült webes felületeket az erre szakosodott tesztelő csapat egy előre meghatározott tesztforgatókönyv alapján manuálisan klikkelgeti végig, ahelyett hogy valamilyen automatizmust használnának!

A projekt kezdeti fázisában - ahol még a felület gyakran változik - a manuális felületi tesztelés lehet a célravezetőbb, a későbbiekben azonban mindenféleképpen érdemes elgondolkozni valamilyen automatizált megoldás bevezetésén. Véleményem szerint a Seleniumos 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ér rendszerek fejlesztése még folyamatban van. Seleniumos felületi tesztek készítésével a tesztek bármikor visszajátszhatók akár Hudsonnal integrálva is, így szükség szerint folyamatosan értesülhetünk a tesztjeink lefutási eredményeiről!

A webes felületek automatizált tesztelése azonban nem tekinthető triviálisnak, gondoljunk csak a böngészőkből adódó eltérésekre, vagy az ajaxos alkalmazások újszerű kihívásaira. A következő néhány bejegyzésemben ezt a témakört fogom a Selenium keretrendszer bemutatásával körbejárni és megmutatom, hogyan is kellene újrafelhasználható és eltérő adatokkal is működő webes felületi teszteket létrehozni!

Selenium bevezető

A Selenium, Black Box jellegű integrációs felületi tesztek készítésére ad lehetőséget, ami 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. A Selenium parancsokat tartalmazó szkript többek között java forrásként is exportálható, amit némi refaktorálás és adatforrás bekötés után, eltérő környezetekben is használható tesztekké alakíthatunk!


Selenium fogalmak ismertetése

A Selenium elnevezéseit nem mindenhol használják jól, így kezdjük az alapfogalmak áttekintésével:

• Selenium: A projekt neve.
• Selenium 1: A Selenium projekt első verziója.
• Selenium 2: A Selenium projekt második verziója.
• Selenium Remote Control (RC): A Selenium 1 által használt API.
• Selenium WebDriver: A Selenium 2 által használt alapértelmezett API.

A következő néhány Selenium-os bejegyzésemben a Selenium projekt 2-es verzióját fogom ismertetni a Selenium Remote Control API használatával, mégpedig azért mert a cikk írásakor a Selenium IDE még nem volt képes a WebDriver API parancsainak problémamentes exportálására. Szerencsére a fejlesztés jó ütemben halad, így már erre sem kell sokáig várni...

Selenium architektúrák rövid áttekintése

A Selenium RC parancsok visszajátszásához szükséges egy Selenium RC Server indítása, amely proxy-ként továbbítja a végrehajtandó műveleteket a böngészőnek. Selenium WebDriver API használatánál erre már nincs szükség, mivel a parancsok - egy gépes környezetben - közvetlenül a böngészőhöz továbbítódnak.

Selenium 2 újdonságai

A Selenium 2 legfőbb újdonságait a WebDriver projekttel történő egyesülés hozta.

• Letisztultabb API, amit a WebDriver project biztosít. A Selenium RC parancsok Selenium 2-es környezetben való futtatásához a WebDriverBackedSelenium osztályt használhatjuk fel.
• Beépített IPhone és az Android emulátor, melyek használatával mobil eszközök böngészőjében is futtathatók a tesztek.
• Pop-up dialógusok bevonása a tesztesetekbe: basic authentication, fájl feltöltés pop-up dialógus.
• Cross Domain Testing: Tipikusan a Facebook Connect-et használó alkalmazások tesztelése.
• Amíg a Selenium 1 JavaScript-et használ a böngészőben történő tevékenységek végrehajtásához, addig a Selenium 2 - a WebDriver API felhasználásával – operációs rendszer szintű eseményekkel dolgozik a visszajátszás során, így standalone környezetben nem szükséges a Selenium Proxy Server indítása.

A Selenium lehetőséget ad arra, hogy eltérő böngészők különböző verzióival is letesztelhessük az alkalmazást. Böngésző nélküli tesztelésre is van mód a HtmlUnitDriver használatával, amely gyors teszt futtatásra ad lehetőséget, azonban a JavaScript motorja nem bizonyult megfelelőnek az összetettebb JavaScript könyvtárak használatakor (pl.: Prototype). A probléma valószínűleg a későbbi verziókban javításra kerül. A Selenium által támogatott platformok részletes listája megtalálható itt.

A Selenium-os teszteléshez szükséges eszközök

Firefox

• Szükséges böngésző a Selenium IDE kiegészítő használatához.
• Firefox 3.6 vagy Firefox 4 is telepíthető, azonban későbbi Firefox verziókhoz a cikk írásakor még nem volt stabil verziója az összes felhasznált kiegészítőnek.

Selenium IDE

• Firefox plugin, ami lehetővé teszi a böngészőben végrehajtott műveletek (kattintás, gépelés) felvételét, visszajátszását és exportálását. Érdemes a legfrissebb verziót telepíteni!

Selenium Expert

• Selenium IDE kiegészítő, amely a rögzített Selenium tesztekhez ad javítási lehetőségeket ill. tippeket.

WebDriver Backed Formatters

• Selenium IDE kiegészítő, amely lehetővé teszi a rögzítet Selenium szkriptek WebDriver alapú exportálását.

Highlight Elements

• Selenium IDE kiegészítő, amely a kiválasztott Selenium parancshoz tartozó html elemre, eltérő színezéssel rámutat a böngészőben.

Selenium Client Driver

• Selenium 2 kliens oldali java könyvtár. A dokumentum írásakor a Selenium 2 rc3 (selenium-java-2.0rc3.zip) verziója már probléma nélkül használható volt.

További hasznos Firefox kiegészítők

• WebDeveloper
  
• FireBug
  
• XPathFinder

Selenium IDE

A Selenium IDE kiegészítőt, telepítés után a Firefox/Tools/Selenium IDE menü kiválasztásával jeleníthetjük meg. A tesztek rögzítésének indítása ill. leállítása a jobb-fenti piros gombra kattintással történik. Indítás után a böngészőben végrehajtott műveletek (pl.: klikkelés, gépelés) azonnal megjelennek jobb oldali panel table tab-ja alatt. A rögzítés után a teszteset visszajátszható a ’play current test case’ gombra kattintva, melynek a naplója a Log tab-on tekinthető meg. A visszajátszás után a sikeresen végrehajtott parancsok zöld színnel, a végre nem hajtott parancsok pedig piros színnel jelennek meg. A Reference tab-ra klikkelve a táblázatban kiválasztott parancs használatáról és argumentumairól olvashatunk információkat, az Expert tabon pedig tippek és javítási ötletek jelennek meg, amelyeket azonnal elvégezhetünk az inspect, majd fix gombra kattintással.

Ha a toolbar-on bekapcsoljuk a ’HighLight Elements’ opciót, akkor a teszteset visszajátszása során az aktuálisan végrehajtott parancshoz tartozó html elem sárga háttérrel kivillan az oldalon. Hasonlóan, ha a táblázatban kiválasztunk egy sort és ráklikkelünk a target mező melletti Find gombra, akkor a böngészőben a lokátorhoz tartozó mező háttérszíne megváltozik. Ha fordított működésre lenne szükségünk, akkor használjuk az XPathFinder Firefox plugin-t, amivel a böngészőben megjelenő html elemekhez kaphatjuk meg a hozzájuk tartozó XPath kifejezést. Az elkészített tesztesetet a File/Export Test Case As… menüpont alatt többféle formátumban is exportálhatjuk.

Zárszó

A mostani bejegyzésemet leginkább egy bevezető jellegű kedvcsinálónak szántam, remélem elérte a célját! A folytatásban a Selenium parancsok használatáról fogok írni, de addig is egy kis olvasnivaló:

• Selenium projekt oldal
• Hivatalos Selenium blog
• Selenium fejlesztői oldal 
• Selenium architektúra leírása