Kas yra lokatoriai?
„Locator“ yra komanda, nurodanti „Selenium IDE“, kuriuos GUI elementus (pvz., „Text Box“, „Buttons“, „Check Box“ ir kt.) Reikia valdyti. Teisingų GUI elementų identifikavimas yra būtina sąlyga norint sukurti automatikos scenarijų. Tačiau tiksliai nustatyti GUI elementus yra sunkiau, nei atrodo. Kartais galų gale dirbate naudodami neteisingus GUI elementus arba jų visai neturite! Taigi „Selenium“ pateikia daugybę „Locators“, kad tiksliai surastų GUI elementąSkirtingi CSS lokatoriaus tipai Selenium IDE
Yra komandų, kurioms nereikia lokatoriaus (pavyzdžiui, komanda „atidaryti“). Tačiau daugumai jų „Selenium“ žiniatinklio tvarkyklėje reikalingi elementų lokatoriai.
Lokatoriaus pasirinkimas labai priklauso nuo jūsų bandomos programos . Šioje pamokoje mes pereisime nuo „Facebook“, naujų tours.demoaut, remdamiesi lokatoriais, kuriuos palaiko šios programos. Panašiai savo testavimo projekte, remdamiesi savo programos palaikymu, pasirinksite bet kurį iš aukščiau išvardytų elementų lokalizatorių „Selenium“ žiniatinklio tvarkyklėje.
Vieta pagal ID
Tai yra labiausiai paplitęs būdas rasti elementus, nes ID turėtų būti unikalūs kiekvienam elementui.
Tikslinis formatas: id = elemento id
Šiame pavyzdyje mes naudosime „Facebook“ kaip bandomąją programą, nes „Mercury Tours“ nenaudoja ID atributų.
1 žingsnis. Kadangi ši pamoka buvo sukurta, „Facebook“ pakeitė savo prisijungimo puslapio dizainą. Testavimui naudokite šį demonstracinį puslapį http://demo.guru99.com/test/facebook.html. Patikrinkite teksto laukelį „El. Paštas arba telefonas“ naudodami „Firebug“ ir atkreipkite dėmesį į jo ID. Šiuo atveju ID yra „el. Paštas“.
2 žingsnis. Paleiskite Selenium IDE ir laukelyje Tikslinė įveskite „id = email“. Spustelėkite mygtuką Rasti ir pastebėkite, kad teksto laukelis „El. Paštas arba telefonas“ paryškinamas geltonai, o kraštovaizdis - žalias, vadinasi, „Selenium IDE“ sugebėjo teisingai rasti tą elementą.
Vieta pagal pavadinimą
Elementų nustatymas pagal pavadinimą yra labai panašus į nustatymą pagal ID, išskyrus tai, kad vietoj jo naudojame „name =“ priešdėlį.
Tikslinis formatas: pavadinimas = elemento pavadinimas
Šioje demonstracijoje dabar naudosime „Mercury Tours“, nes visi reikšmingi elementai turi pavadinimus.
1 žingsnis. Eikite į http://demo.guru99.com/test/newtours/ ir naudokite „Firebug“, kad patikrintumėte teksto laukelį „Vartotojo vardas“. Atkreipkite dėmesį į jo pavadinimo atributą.
Čia matome, kad elemento vardas yra „vartotojo vardas“.
2 veiksmas . „Selenium IDE“ laukelyje „Target“ įveskite „name = userName“ ir spustelėkite mygtuką Rasti. Selenium IDE turėtų sugebėti rasti teksto laukelį Vartotojo vardas jį pažymėdamas.
Vietos nustatymas pagal pavadinimą naudojant filtrus
Filtrai gali būti naudojami, kai keli elementai turi tą patį pavadinimą. Filtrai yra papildomi atributai, naudojami norint atskirti elementus tuo pačiu pavadinimu.
Tikslinis formatas : pavadinimas = pavadinimas_elemento filtras = reikšmė_filtras
Pažiūrėkime pavyzdį -
1 žingsnis . Prisijunkite prie „Mercury Tours“ naudodami „pamoką“ kaip vartotojo vardą ir slaptažodį. Tai turėtų jus nuvesti į žemiau pateiktą „Skrydžio ieškiklio“ puslapį.
2 žingsnis. Naudodami „Firebug“ pastebėkite, kad radijo mygtukų „Pirmyn į abi puses“ ir „Vienas kelias“ pavadinimai yra „tripType“. Tačiau jie turi skirtingus VALUE atributus, todėl kiekvieną iš jų galime naudoti kaip filtrą.
3 žingsnis.
- Pirmiausia pasieksime radijo mygtuką „One Way“. Spustelėkite pirmąją redaktoriaus eilutę.
- „Selenium IDE“ komandų laukelyje įveskite komandą „spustelėkite“.
- Lauke Tikslinė įveskite „name = tripType value = oneway“. Dalis „value = oneway“ yra mūsų filtras.
4 žingsnis . Spustelėkite mygtuką Rasti ir pastebėkite, kad „Selenium IDE“ gali pažymėti radijo mygtuką „Vienos krypties“ žalia spalva - tai reiškia, kad mes galime sėkmingai pasiekti elementą naudodami jo atributą VALUE.
5 žingsnis. Paspauskite klaviatūros klavišą „X“, kad įvykdytumėte šią spustelėjimo komandą. Atkreipkite dėmesį, kad radijo mygtukas „Vienas kelias“ tapo pasirinktas.
Tą patį galite padaryti naudodami radijo mygtuką „Pirmyn kelionė“, šį kartą naudodami „target = tripType value = roundtrip“.
Vietos nustatymas pagal nuorodos tekstą
Šis CSS lokatoriaus tipas „Selenium“ taikomas tik hipersaitų tekstams. Mes pasiekiame nuorodą, prieš tai pažymėdami tikslą „link =“, o po to - hipersaito tekstu.
Tikslinis formatas : link = link_text
Šiame pavyzdyje mes pateksime į nuorodą „REGISTRUOTIS“, esančią „Mercury Tours“ pagrindiniame puslapyje.
1 žingsnis.
- Pirmiausia įsitikinkite, kad esate prisijungę nuo „Mercury Tours“.
- Eikite į „Mercury Tours“ pagrindinį puslapį.
2 žingsnis .
- Naudodami „Firebug“ patikrinkite nuorodą „REGISTRUOTIS“. Nuorodos tekstas randamas tarp ir žymų.
- Šiuo atveju mūsų nuorodos tekstas yra „REGISTRUOTIS“. Nukopijuokite nuorodos tekstą.
3 žingsnis . Nukopijuokite nuorodos tekstą į „Firebug“ ir įklijuokite jį į „Selenium IDE“ laukelį Tikslinė. Priešdėlis su „link =“.
4 žingsnis. Spustelėkite mygtuką Rasti ir pastebėkite, kad „Selenium IDE“ galėjo tinkamai paryškinti nuorodą REGISTRUOTIS.
5 žingsnis. Norėdami patikrinti toliau, lauke „Command“ įveskite „clickAndWait“ ir jį vykdykite. „Selenium IDE“ turėtų sugebėti sėkmingai spustelėti tą nuorodą REGISTRUOTIS ir patekti į toliau pateiktą registracijos puslapį.
Vietos nustatymas pagal CSS parinkiklį
CSS selektoriai selene yra eilutės šablonai, naudojami elementui identifikuoti pagal HTML žymos, ID, klasės ir atributų derinį. CSS selektorių nustatymas selene yra sudėtingesnis nei ankstesni metodai, tačiau tai yra labiausiai paplitusi patyrusių „Selenium“ vartotojų vietos nustatymo strategija, nes ji gali pasiekti net tuos elementus, kurie neturi ID ar vardo.
CSS selektoriai selene turi daug formatų, bet mes sutelksime dėmesį tik į labiausiai paplitusius.
- Žyma ir ID
- Žyma ir klasė
- Žyma ir atributas
- Žyma, klasė ir atributas
- Vidinis tekstas
Naudodami šią strategiją, visada pažymime laukelį „Tikslinė“ prieš „css =“, kaip bus parodyta toliau pateiktuose pavyzdžiuose.
Vietos nustatymas pagal CSS parinkiklį - žyma ir ID
Šiame pavyzdyje vėl naudosime „Facebook“ teksto laukelį. Kaip atsimenate, jo ID yra „el. Paštas“, ir mes jį jau pasiekėme skiltyje „Vietos nustatymas pagal ID“. Šį kartą mes naudosime „Selenium CSS Selector“ su ID, kad galėtume pasiekti tą patį elementą.
Sintaksė |
apibūdinimas |
---|---|
css = tag # id |
|
Atminkite, kad prieš ID visada yra maišos ženklas (#).
1 žingsnis. Eikite į www.facebook.com. Naudodami „Firebug“ išnagrinėkite teksto laukelį „El. Paštas arba telefonas“.
Šiuo metu atkreipkite dėmesį, kad HTML žyma yra „įvestis“, o jos ID yra „el. Paštas“. Taigi mūsų sintaksė bus „css = input # email“.
2 žingsnis. Įveskite „css = input # email“ į „Selenium IDE“ laukelį Tikslinė ir spustelėkite mygtuką Rasti. Selenas IDE turėtų sugebėti pabrėžti tą elementą.
Vietos nustatymas pagal CSS parinkiklį - žymė ir klasė
Vietos nustatymas pagal CSS selektorių „Selenium“ naudojant HTML žymą ir klasės pavadinimą yra panašus į žymos ir ID naudojimą, tačiau šiuo atveju vietoj maišos ženklo naudojamas taškas (.).
Sintaksė |
apibūdinimas |
---|---|
css = žyma. klasė |
|
1 žingsnis. Eikite į demonstracinį puslapį http://demo.guru99.com/test/facebook.html ir naudokite „Firebug“, kad patikrintumėte teksto laukelį „El. Paštas arba telefonas“. Atkreipkite dėmesį, kad jo HTML žyma yra „įvestis“, o klasė - „įvesties tekstas“.
2 veiksmas . „Selenium IDE“ laukelyje Tikslinė įveskite „css = input.inputtext“ ir spustelėkite Rasti. Selenium IDE turėtų atpažinti teksto laukelį El. Paštas arba Telefonas.
Atkreipkite dėmesį, kad kai keli elementai turi tą pačią HTML žymą ir pavadinimą, bus atpažintas tik pirmasis šaltinio kodo elementas . Naudodami „Firebug“ patikrinkite „Facebook“ teksto laukelį „Slaptažodis“ ir pastebėkite, kad jis turi tą patį pavadinimą, kaip teksto laukelis El.
Priežastis, kodėl ankstesnėje iliustracijoje buvo paryškintas tik teksto laukelis El. Paštas arba Telefonas, yra ta, kad ji yra pirmoji „Facebook“ puslapio šaltinyje.
Vietos nustatymas pagal CSS parinkiklį - žyma ir atributas
Ši strategija naudoja HTML žymą ir konkretų elemento, kurį reikia pasiekti, atributą.
Sintaksė |
apibūdinimas |
---|---|
css = tag [atributas = reikšmė] |
|
1 žingsnis. Eikite į „Mercury Tours“ registracijos puslapį (http://demo.guru99.com/test/newtours/register.php) ir patikrinkite teksto laukelį „Pavardė“. Atkreipkite dėmesį į jo HTML žymą (šiuo atveju „įvestis“) ir pavadinimą („pavardė“).
2 veiksmas . „Selenium IDE“ laukelyje Tikslinė įveskite „css = input [vardas = pavardė]“ ir spustelėkite Rasti. „Selenium IDE“ turėtų sėkmingai pasiekti langelį „Pavardė“.
Kai keli elementai turi tą pačią HTML žymą ir atributą, bus atpažintas tik pirmasis . Šis elgesys yra panašus į elementų nustatymą naudojant CSS selektorius su ta pačia žyma ir klase.
Vietos nustatymas pagal CSS parinkiklį - žyma, klasė ir atributas
Sintaksė | apibūdinimas |
---|---|
css = tag.class [atributas = vertė] |
|
1 žingsnis. Eikite į demonstracinį puslapį http://demo.guru99.com/test/facebook.html ir naudokite „Firebug“, kad patikrintumėte įvesties laukelius „El. Paštas arba telefonas“ ir „Slaptažodis“. Atkreipkite dėmesį į jų HTML žymą, klasę ir atributus. Šiame pavyzdyje mes pasirinksime jų „tabindex“ atributus.
2 žingsnis. Pirmiausia pasieksime teksto laukelį „El. Paštas arba telefonas“. Taigi mes naudosime tabindex reikšmę 1. Įveskite „css = input.inputtext [tabindex = 1]“ į „Selenium IDE“ laukelį „Target“ ir spustelėkite „Find“. Reikėtų paryškinti įvesties laukelį „El. Paštas arba telefonas“.
3 žingsnis. Norėdami pasiekti slaptažodžio įvesties laukelį, tiesiog pakeiskite atributo tabindex vertę. Lauke Tikslinė įveskite „css = input.inputtext [tabindex = 2]“ ir spustelėkite mygtuką Rasti. Selenium IDE turi sugebėti sėkmingai identifikuoti teksto laukelį Slaptažodis.
Rasti pagal CSS selektorių - vidinis tekstas
Kaip jau pastebėjote, HTML etiketėms retai suteikiami ID, vardo ar klasės atributai. Taigi, kaip prie jų prieiti? Atsakymas pateikiamas naudojant jų vidinius tekstus. Vidiniai tekstai yra faktiniai eilutės šablonai, kuriuos HTML etiketė rodo puslapyje.
Sintaksė |
apibūdinimas |
---|---|
css = tag: yra („vidinis tekstas“) |
|
1 žingsnis. Eikite į „Mercury Tours“ pagrindinį puslapį (http://demo.guru99.com/test/newtours/) ir naudokite „Firebug“, kad ištirtumėte etiketę „Slaptažodis“. Atkreipkite dėmesį į jo HTML žymą (šiuo atveju tai yra „šriftas“) ir pastebėkite, kad ji neturi klasės, ID ar pavadinimo atributų.
2 žingsnis. „ Selenium IDE“ laukelyje „Target “ įveskite css = font: tartalmaz ("Slaptažodis:") ir spustelėkite Rasti. Selenium IDE turėtų turėti prieigą prie slaptažodžio etiketės, kaip parodyta žemiau esančiame paveikslėlyje.
3 žingsnis. Šį kartą pakeiskite vidinį tekstą „Boston“, kad jūsų tikslas dabar taptų „css = font: tartalmaz („ Boston “)“. Spustelėkite Rasti. Turėtumėte pastebėti, kad etiketė „Bostonas į San Franciską“ tampa paryškinta. Tai rodo, kad „Selenium IDE“ gali pasiekti ilgą etiketę, net jei ką tik nurodėte pirmąjį jos vidinio teksto žodį.
Rasti pagal DOM (dokumento objekto modelis)
Dokumento objekto modelis (DOM), paprastai tariant, yra HTML elementų struktūrizavimo būdas. Selenium IDE gali naudoti DOM prieigai prie puslapio elementų. Jei naudosime šį metodą, langelis „Tikslinė“ visada prasidės „dom = document…“; tačiau priešdėlis „dom =“ paprastai pašalinamas, nes „Selenium IDE“ vis tiek viską, kas prasideda nuo raktinio žodžio „dokumentas“, vis tiek gali interpretuoti kaip kelią Seleno DOM.
Yra keturi pagrindiniai būdai, kaip surasti elementą per DOM Selene:
- „getElementById“
- „getElementsByName“
- dom: vardas (taikomas tik įvardytos formos elementams)
- dom: rodyklė
Rasti pagal DOM - getElementById
Susitelkime ties pirmuoju metodu - naudodami seleno DOM metodą getElementById. Sintaksė būtų tokia:
Sintaksė |
apibūdinimas |
---|---|
document.getElementById ("elemento ID") |
elemento id = tai yra prieinamo elemento ID atributo vertė. Ši vertė visada turėtų būti įtraukta į skliaustų porą (""). |
1 žingsnis. Naudokite šį demonstracinį puslapį http://demo.guru99.com/test/facebook.html Eikite į jį ir naudokite „Firebug“, kad patikrintumėte žymimąjį laukelį „Laikyti mane prisijungę“. Atkreipkite dėmesį į jo ID.
Matome, kad ID, kurį turėtume naudoti, yra „persist_box“.
2 žingsnis. Atidarykite „Selenium IDE“ ir laukelyje „Tikslinė“ įveskite „document.getElementById („ persist_box “) ir spustelėkite Rasti. Selenium IDE turėtų sugebėti rasti žymimąjį laukelį „Laikyti mane prisijungę“. Nors „Selenium IDE“ negali išryškinti žymės langelio interjero, elementas vis tiek gali būti apsuptas ryškiai žaliu kraštu, kaip parodyta žemiau.
Surasti pagal DOM - getElementsByName
„GetElementById“ metodas vienu metu gali pasiekti tik vieną elementą, tai yra elementas su jūsų nurodytu ID. „GetElementsByName“ metodas yra kitoks. Jis renka masyvą elementų, turinčių jūsų nurodytą pavadinimą. Prie atskirų elementų galite prisijungti naudodami indeksą, kuris prasideda nuo 0.
„getElementById“
|
||
„getElementsByName“
|
Sintaksė |
apibūdinimas |
---|---|
document.getElementsByName ("vardas") [rodyklė] |
|
1 žingsnis. Eikite į „Mercury Tours“ pagrindinį puslapį ir prisijunkite naudodami „pamoką“ kaip vartotojo vardą ir slaptažodį. „Firefox“ turėtų nukreipti jus į „Flight Finder“ ekraną.
2 žingsnis. Naudodami „Firebug“, patikrinkite tris radijo mygtukus, esančius puslapio apačioje (ekonominės klasės, verslo klasės ir pirmos klasės radijo mygtukus). Atkreipkite dėmesį, kad visi jie turi tą patį pavadinimą, kuris yra „servClass“.
3 žingsnis. Pirmiausia pasiekime radijo mygtuką „Ekonominė klasė“. Iš visų šių trijų radijo mygtukų šis elementas yra pirmas, todėl jo indeksas yra 0. Selenium IDE įveskite „document.getElementsByName („ servClass “) [0]“ ir spustelėkite mygtuką Rasti. Selenium IDE turėtų sugebėti teisingai atpažinti ekonominės klasės radijo mygtuką.
4 žingsnis. Pakeiskite indekso numerį į 1, kad jūsų „Target“ dabar taptų document.getElementsByName („servClass“) [1]. Spustelėkite mygtuką Rasti ir „Selenium IDE“ turėtų galėti paryškinti radijo mygtuką „Verslo klasė“, kaip parodyta žemiau.
Vietos nustatymas pagal DOM - dom: name
Kaip minėta anksčiau, šis metodas bus taikomas tik tuo atveju, jei jūsų pasiekiamas elementas yra pavadintoje formoje.
Sintaksė |
apibūdinimas |
---|---|
document.forms ["formos pavadinimas"] .elements ["elemento pavadinimas"] |
|
1 žingsnis. Eikite į „Mercury Tours“ pagrindinį puslapį (http://demo.guru99.com/test/newtours/) ir naudokite „Firebug“, kad patikrintumėte teksto laukelį Vartotojo vardas. Atkreipkite dėmesį, kad jis pateikiamas forma, pavadinta „namai“.
2 veiksmas . „Selenium IDE“ įveskite „document.forms [" home "]. Elements [" vartotojo vardas "] ir spustelėkite mygtuką Rasti. Selenium IDE turi turėti galimybę sėkmingai pasiekti elementą.
Rasti pagal DOM - dom: index
Šis metodas taikomas net tada, kai elementas nėra įvardytoje formoje, nes jis naudoja formos indeksą, o ne jo pavadinimą.
Sintaksė |
apibūdinimas |
---|---|
document.forms [formos rodyklė] .elements [elemento rodyklė] |
|
Mes pateksime į „Telefono“ teksto laukelį „Mercury Tours“ registracijos puslapyje. Tame puslapyje esančioje formoje nėra pavadinimo ir ID atributo, todėl tai bus geras pavyzdys.
1 žingsnis. Eikite į „Mercury Tours“ registracijos puslapį ir patikrinkite teksto laukelį Telefonas. Atkreipkite dėmesį, kad forma su ja neturi ID ir pavadinimo atributų.
2 žingsnis. „Selenium IDE“ laukelyje „Target“ įveskite „document.forms [0] .elements [3]“ ir spustelėkite mygtuką Rasti. „Selenium IDE“ turėtų galėti teisingai pasiekti teksto laukelį Telefonas.
3 žingsnis. Arba galite naudoti elemento pavadinimą vietoj jo indekso ir gauti tą patį rezultatą. „Selenium IDE“ laukelyje „Target“ įveskite „document.forms [0] .elements [„ telefonas “]. Telefono teksto laukelis vis tiek turėtų būti paryškintas.
Rasti pagal XPath
XPath yra kalba, naudojama ieškant XML (Extensible Markup Language) mazgų. Kadangi HTML gali būti laikomas XML įgyvendinimu, mes taip pat galime naudoti XPath ieškodami HTML elementų.
Privalumas: jis gali pasiekti beveik bet kurį elementą, net ir tuos, kurie neturi klasės, vardo ar ID atributų.
Trūkumas: tai yra pats sudėtingiausias elementų identifikavimo metodas dėl per daug skirtingų taisyklių ir aplinkybių.
Laimei, „Firebug“ gali automatiškai sugeneruoti „XPath Selenium“ lokatorius. Šiame pavyzdyje mes pasieksime vaizdą, kurio negalima pasiekti naudojant anksčiau aptartus metodus.
1 žingsnis. Eikite į „Mercury Tours“ pagrindinį puslapį ir naudokite „Firebug“, kad patikrintumėte oranžinį stačiakampį, esantį geltonos dėžutės dešinėje. Žiūrėkite žemiau esantį vaizdą.
2 žingsnis . Dešiniuoju pelės mygtuku spustelėkite elemento HTML kodą ir pasirinkite parinktį „Kopijuoti XPath“.
3 žingsnis . „Selenium IDE“ laukelyje Tikslinė įveskite vieną priekinį pasvirąjį brūkšnį „/“, tada įklijuokite XPath, kurį nukopijavome ankstesniame žingsnyje. Tavo laukelio įrašas dabar turėtų prasidėti dviem pasviruoju brūkšniu „//“.
4 žingsnis . Spustelėkite mygtuką Rasti. Selenas IDE turėtų sugebėti paryškinti oranžinį langelį, kaip parodyta žemiau.
Santrauka
Lokatoriaus naudojimo sintaksė
Metodas |
Tikslinė sintaksė |
Pavyzdys |
---|---|---|
Pagal asmens tapatybės dokumentą | id = id_of_the_element | id = el. paštas |
Pagal vardą | vardas = elemento vardas | vardas = vartotojo vardas |
Pagal pavadinimą naudojant filtrus | name = name_of_the_element filter = value_of_filter | name = tripType value = oneway |
Pagal nuorodos tekstą | nuoroda = nuorodos_tekstas | nuoroda = REGISTRUOTIS |
Žyma ir ID | css = tag # id | css = įvestis # el. paštas |
Žyma ir klasė | css = žyma. klasė | css = input.inputtext |
Žyma ir atributas | css = tag [atributas = reikšmė] | css = įvestis [vardas = pavardė] |
Žyma, klasė ir atributas | css = žyma. klasė [atributas = vertė] | css = input.inputtext [tabindex = 1] |