špička v každém směru

IT3

Začínáme testovat web pomocí Selenium Školení pro začátečníky

IT3

špička v každém směru

Co je Selenium IDE

Automatické testování Automatické testování webové webové aplikace aplikace jako černé skříňkyjako černé skříňky

Minimální konfiguraceMinimální konfigurace Firefox plugin Firefox plugin Selenium IDESelenium IDE

Viz. Viz. HelloWorld – stripes-shopHelloWorld – stripes-shop

http://selenium-ide.openqa.org/download.jsphttp://selenium-ide.openqa.org/download.jsp

IT3

špička v každém směru

Pro koho je Selenium IDE?

Pro testeryPro testery Automatizace testování podle testovacích scénářůAutomatizace testování podle testovacích scénářů Testovací scénáře v jednoduché HTML podoběTestovací scénáře v jednoduché HTML podobě

Pro vývojářePro vývojáře Smoke testy buildovacího procesu (např. Ant skriptů)Smoke testy buildovacího procesu (např. Ant skriptů) Integrační testování jako součást nočních buildůIntegrační testování jako součást nočních buildů Testování Ajax částí aplikace a GUITestování Ajax částí aplikace a GUI

IT3

špička v každém směru

Nativní formát testu

Jednoduché HTMLJednoduché HTML Srozumitelné i Srozumitelné i

pro nevývojářepro nevývojáře

<tr><tr>

<td>type</td><td>type</td>

<td>jusername</td><td>jusername</td>

<td>vjohn</td><td>vjohn</td>

</tr></tr>

<tr><tr>

<td>type</td><td>type</td>

<td>jpassword</td><td>jpassword</td>

<td>vjohn</td><td>vjohn</td>

</tr></tr>

<tr><tr>

<td>clickAndWait</td><td>clickAndWait</td>

<td>login</td><td>login</td>

<td></td><td></td>

</tr></tr>

IT3

špička v každém směru

Testování více prohlížečů

Jeden test lze spustit protiJeden test lze spustit proti ExploreruExploreru FirefoxuFirefoxu

IT3

špička v každém směru

Selenium command

Jeden řádek v testuJeden řádek v testu Instrukce pro selenium, co má s aplikací dělatInstrukce pro selenium, co má s aplikací dělat

1. buňka1. buňka CommandCommandNázev příkazu (např. type)Název příkazu (např. type)

2. buňka2. buňka Element selectorElement selectorUrčení elementu na stránce pro provedení Určení elementu na stránce pro provedení příkazupříkazu

3. buňka3. buňka Další argument pro Další argument pro příkazpříkaz

<tr><tr>

<td>type</td><td>type</td>

<td>jusername</td><td>jusername</td>

<td>vjohn</td><td>vjohn</td>

</tr></tr>

IT3

špička v každém směru

Jak testovat commandy

V selenium IDE napište příkazV selenium IDE napište příkaz Spusťte příkazSpusťte příkaz

A) PoklepánímA) Poklepáním B) Pomocí klávesové zkratky XB) Pomocí klávesové zkratky X

Nápověda k příkazům v Selenium IDENápověda k příkazům v Selenium IDE V Selenium IDE obsahuje jednoduchou Code V Selenium IDE obsahuje jednoduchou Code

completioncompletion Karta Reference obsahuje nápověduKarta Reference obsahuje nápovědu

IT3

špička v každém směru

Commands - typy

ActionsActions provádějí uživatelské akce v aplikaciprovádějí uživatelské akce v aplikaci typetype clickclick selectselect submitsubmit

Pozn.:Pozn.: Varianta andWait způsobí počkání na nahrání další Varianta andWait způsobí počkání na nahrání další stránky (např. clickAndWait)stránky (např. clickAndWait)

AssertionsAssertions ověřují stav aplikace očekáváníověřují stav aplikace očekávání assertTextassertText assertTitleassertTitle

AccessorsAccessors ukládají stav aplikace do proměnnéukládají stav aplikace do proměnné storeValuestoreValue storeEvalstoreEval storeAttributestoreAttribute

IT3

špička v každém směru

Práce s formulářem

ttypeype napíše hodnotu do formulářového polenapíše hodnotu do formulářového poleSyntaxe:Syntaxe: typetype <locator><locator> <value><value>Např.:Např.: typetype namename Pavel JetenskýPavel Jetenský

submitsubmit odešle formulářodešle formulářSyntaxe:Syntaxe: submitsubmit <locator><locator>Např.:Např.: submitsubmit document.forms[0]document.forms[0]

sselectelect vyvybbereere hodnoty z rolovací nabídky hodnoty z rolovací nabídkySyntaxe:Syntaxe: select <locator> <option label>select <locator> <option label>Např.:Např.:select osobySelect Frantaselect osobySelect Franta

check/uncheckcheck/uncheckzaškrtne/odškrtne checkboxzaškrtne/odškrtne checkboxSyntaxe:Syntaxe: check <locator>check <locator>Např.:Např.: check check faktura.odberatel.sendNewsletterfaktura.odberatel.sendNewsletter

IT3

špička v každém směru

Element locator

Určuje objekt v HTML stránce pro provedení příkazuUrčuje objekt v HTML stránce pro provedení příkazu

Více možností pro Více možností pro locatorTypelocatorType – identifier, id, name, dom, xpath, – identifier, id, name, dom, xpath, link, csslink, css

identifier=<hodnota>identifier=<hodnota>Najdi element podle @id, nenajdeš-li pak podle @nameNajdi element podle @id, nenajdeš-li pak podle @name

id=<hodnota>id=<hodnota> najdi element podle @idnajdi element podle @id name=<hodnota>name=<hodnota> najdi element podle @namenajdi element podle @name dom=<hodnota>dom=<hodnota> najdi element podle dom výrazunajdi element podle dom výrazu

dom=document.forms['myForm'].myDropdowndom=document.forms['myForm'].myDropdown xpath=<xpath>xpath=<xpath> najdi element podle XPATH výrazunajdi element podle XPATH výrazu

xpath=//table[@id='table1']//tr[4]/td[2] xpath=//table[@id='table1']//tr[4]/td[2] link=<text odkazu> link=<text odkazu> najdi odkaz (<a>) podle textunajdi odkaz (<a>) podle textu

linklink==Odhlásit seOdhlásit se

Syntaxe: Syntaxe: locatorTypelocatorType==argumentargument

IT3

špička v každém směru

Jak testovat locatory

V selenium IDE napište příkazV selenium IDE napište příkaz Do druhého políčka příkazu napište element selectorDo druhého políčka příkazu napište element selector Klepněte na tlačítko u selectoru FindKlepněte na tlačítko u selectoru Find

IT3

špička v každém směru

Locator – zjednodušená syntaxe Bez locatorTypeBez locatorType locatorType = IdentifierlocatorType = Identifier

type identifier=emailtype identifier=email test@deltax.cztest@deltax.cz

type email type email test@deltax.cztest@deltax.cz Locator začínající na Locator začínající na //// locatorType = XPathlocatorType = XPath

typetype xpath=//input[@id='e1'] xpath=//input[@id='e1'] test@deltax.cz test@deltax.cz typetype //input[@id='e1'] //input[@id='e1'] test@deltax.cztest@deltax.cz

Locator začínající na Locator začínající na document.document. locatorType = domlocatorType = dom

clickclick dom=document.images[56] dom=document.images[56]clickclick document.images[56] document.images[56]

IT3

špička v každém směru

Kvízová otázka XPath

V aplikaci máme zobrazenou tuto tabulkuV aplikaci máme zobrazenou tuto tabulku

Potřebujeme klepnout na odkaz Smazat u uživatele Jan Potřebujeme klepnout na odkaz Smazat u uživatele Jan Hasič. Při nahrávání v Selenium IDE recorder nahrál Hasič. Při nahrávání v Selenium IDE recorder nahrál tento command:tento command: click //tr[3]/td[2]/aclick //tr[3]/td[2]/a

Jak nahradit XPath na odkaz Smazat, aby fungoval Jak nahradit XPath na odkaz Smazat, aby fungoval nezávisle na pořadí řádku s Janem Hasičem v tabulce (a nezávisle na pořadí řádku s Janem Hasičem v tabulce (a byl srozumitelnější, co se děje)?byl srozumitelnější, co se děje)?

Click //tr[td[text()='Jan Hasič']]/td[2]/aClick //tr[td[text()='Jan Hasič']]/td[2]/a

JménoJméno AkceAkce

Tom ŘidičTom Řidič SmazatSmazat

Jan HasičJan Hasič SmazatSmazat

Studenti mají přednost Studenti mají přednost

IT3

špička v každém směru

Assertions commands

assertassertTextText Test na přítomnost textu ve stránceTest na přítomnost textu ve stránce assertValueassertValue Test na hodnotu ve formulářiTest na hodnotu ve formuláři assertTitleassertTitle Test na titulek stránky (podpora pro Test na titulek stránky (podpora pro

nahrání v recorderu)nahrání v recorderu) assertVisible, assertEditableassertVisible, assertEditable Test na často používané Test na často používané

DHTML vlastnosti elementůDHTML vlastnosti elementů

IT3

špička v každém směru

Assertions varianty

assertassertXXXXXX Při nesplnění kontroly test selže a Při nesplnění kontroly test selže a nepokračujenepokračuje

verifyXXXverifyXXX Při nesplnění kontroly se chyba zaloguje, Při nesplnění kontroly se chyba zaloguje, ale test pokračujeale test pokračuje

assertNotXXX,verifyNotXXXassertNotXXX,verifyNotXXX Negovaná kontrolaNegovaná kontrola Stejné jako assertXXX, ale kontrola se vyhodnocuje negativně.Stejné jako assertXXX, ale kontrola se vyhodnocuje negativně. Např. assertNotValue email test@deltax.cz – test selže, pokud Např. assertNotValue email test@deltax.cz – test selže, pokud

@value elementu email obsahuje test@deltax.cz@value elementu email obsahuje test@deltax.cz assertVisibleassertVisible Kontrola viditelnosti prvku na Kontrola viditelnosti prvku na

stráncestránce assertEditableassertEditable Kontrola editovatelnosti prvku na stránceKontrola editovatelnosti prvku na stránce

IT3

špička v každém směru

Možnosti spouštění testů

RučněRučně Okno firefox pluginu – jeden testOkno firefox pluginu – jeden test Pomocí testrunneru – více testů (testsuite)Pomocí testrunneru – více testů (testsuite)

IT3

špička v každém směru

Kvízová otázka

Uvažujme, že máme sadu Uvažujme, že máme sadu 10ti Seleniových testů v 10ti Seleniových testů v HTML formátu, login HTML formátu, login sekvence se na začátku sekvence se na začátku každého testu opakujekaždého testu opakuje

Jak by šlo docílit re-use login Jak by šlo docílit re-use login sekvence v těchto testech?sekvence v těchto testech?

<tr><tr>

<td>type</td><td>type</td>

<td>jusername</td><td>jusername</td>

<td>vjohn</td><td>vjohn</td>

</tr></tr>

<tr><tr>

<td>type</td><td>type</td>

<td>jpassword</td><td>jpassword</td>

<td>vjohn</td><td>vjohn</td>

</tr></tr>

<tr><tr>

<td>clickAndWait</<td>clickAndWait</td>td>

<td>//<td>//input[@value="Prihlasit input[@value="Prihlasit se"]</td>se"]</td>

<td></td><td></td>

</tr></tr>

Možné řešení: Použijte Možné řešení: Použijte JSP kontejner pro testy a JSP kontejner pro testy a jsp:includejsp:include

<jsp:include <jsp:include page="include/login.jsp"/>page="include/login.jsp"/>

Studenti mají přednost Studenti mají přednost

IT3

špička v každém směru

Seskupování testů

testsuite.html - HTML soubor, který linkuje více testůtestsuite.html - HTML soubor, který linkuje více testů<html><html> <head><head> <title>Testsuite Example</title><title>Testsuite Example</title> </head></head><body><body> <table cellpadding="1" cellspacing="1" border="1"><table cellpadding="1" cellspacing="1" border="1"> <tbody><tbody> <tr><tr> <td>Etar tests</td><td>Etar tests</td> </tr></tr> </tbody></tbody> <tr><td><a href="Login.html">Login</a></td></tr><tr><td><a href="Login.html">Login</a></td></tr> <tr><td><a href="NovySP.html">Nový SP</a></td></tr><tr><td><a href="NovySP.html">Nový SP</a></td></tr> </table></table></body></body></html></html>

IT3

špička v každém směru

Praktický příklad (stripes-shop) Vytvoření testůVytvoření testů

Test “Přihlášení”Test “Přihlášení” Test přidání zboži do košíkuTest přidání zboži do košíku Test validace formulářeTest validace formuláře

Další ukázky – co by vás zajímalo?Další ukázky – co by vás zajímalo? Vytvoření testsuiteVytvoření testsuite

Spuštění testsuite z test runneruSpuštění testsuite z test runneru Spuštění testu z junitSpuštění testu z junit Re-use login sekvence pomocí jsp:includeRe-use login sekvence pomocí jsp:include Spuštění testu proti Internet ExplorerSpuštění testu proti Internet Explorer Best practices pro psaní snadno udržovatelných testůBest practices pro psaní snadno udržovatelných testů

IT3

špička v každém směru

Odkazy

Selenium Selenium homepagehomepage Selenium IDESelenium IDE Selenium Selenium RemoteRemote ControlControl (used by jUnit sel. tests) (used by jUnit sel. tests)

Selenium-RC Selenium-RC andand ContinuousContinuous IntegrationIntegration Selenium testování GUI –přednáška o Seleniu, obsahující Selenium testování GUI –přednáška o Seleniu, obsahující

některá pokročilejší témata (např. best practices, spouštění některá pokročilejší témata (např. best practices, spouštění testů přes ANT nebo jUnit atp.)testů přes ANT nebo jUnit atp.)

IT3

špička v každém směru

Otázky nakonec

Nebojte se a ptejte se Nebojte se a ptejte se