ultimate xpath writing cheat sheet tutorial with syntax
Top 20 spôsobov, ako napísať Ultimate XPATH pre ľubovoľný typ webového prvku (XPATH nikdy nebude neplatný):
Webová aplikácia sa skladá z rôznych typov webových prvkov, napríklad webového prvku, na ktorý sa má kliknúť, vstupného webového prvku na zadávanie textu, rozbaľovacej ponuky, prepínačov atď.
Tieto webové prvky sa tiež nazývajú značky alebo uzly.
Pokiaľ ide o automatizáciu webových aplikácií, začína sa to napísaním automatizačného skriptu, ktorý nájde webový prvok, vykoná s ním akciu, ako napríklad kliknúť na tlačidlo, zadať text do vstupného poľa, označiť začiarkavacie políčko, zvoliť prepínač, posúvajte nahor alebo nadol a nakoniec overte očakávané správanie na konci akcie.
najlepší softvér na tvorbu hier pre začiatočníkov
Čo sa dozviete:
- Čo je XPath a ako to vyzerá?
- Top 20 spôsobov, ako napísať XPath pre akýkoľvek webový prvok
- # 1) Spätné vyhľadávanie
- # 2) Používanie premenných a vlastných hodnôt
- # 3) Používanie značiek „XML“, „AND“ atď
- # 4) Používanie atribútov a tabuľky XPATH
- # 5) Používanie atribútov, tabuliek a textu
- # 6) Generovanie XPATH pomocou vnorených atribútov
- # 7) Generovanie XPath kombináciou atribútov, prvkov Div a tlačidla
- # 8) Generovanie XPATH pomocou OBSAHU, SPÄTNÉHO HĽADANIA atď.
- # 9) Generovanie XPath pomocou relatívnych, OBSAHUJE, SPÄTNÝCH, NÁSLEDUJÚCICH SIBLINGOV, atď.
- # 10) Generovanie XPath pomocou atribútov, Convert, Reverse, Preceding-Sibling, Divs a Span
- # 11) Používanie atribútov, značiek XML atď.
- # 12) Generovanie XPath tým, že sa nepozeráte na celú stránku, ale skôr sa pozeráte do všetkých odkazov a obsahuje
- # 13) Používanie obsahuje a atribúty
- # 14) Používanie atribútov, sledovanie súrodencov a potomkov
- # 15) Používanie atribútov, sledovanie súrodencov, potomkov a textu
- # 16) Používanie hlavičky a textu
- # 17) Používanie textu hlavičky, sledovanie súrodencov, cesta atď.
- # 18) Používanie atribútov, obsahuje a predchádza súrodencov
- # 19) Hľadáte rozbaľovaciu ponuku pomocou atribútu Id, nejakého konkrétneho textu a spätného vyhľadávania
- # 20) Kombinácia atribútu „id“ a hľadanie odkazu s konkrétnym textom
- Záver
- Odporúčané čítanie
Čo je XPath a ako to vyzerá?
Nájsť prvok je ako nájsť niekoho dom na mape. Jediný spôsob, ako môžeme nájsť domov priateľa bez akejkoľvek vonkajšej pomoci, je to, že by sme mali mať mapu a vedieť, čo nájsť (dom).
Aby sme v tomto prípade uviedli túto analógiu, mapa sa použije ako DOM (značky HTML, JavaScript atď.), Kde existujú všetky webové prvky, spolu s konkrétnym webovým prvkom, ktorý chceme nájsť.
Keď sa nájde jedinečná adresa alebo cesta prvku, automatizačný skript na ňom potom vykoná niektoré akcie na základe testovacieho scenára. Napríklad, chcete overiť adresu URL stránky, ktorá sa otvorí po kliknutí na tlačidlo.
Nie je však priame nájsť jedinečnú adresu / cestu webového prvku, pretože by mohli existovať podobné značky, rovnaké hodnoty atribútov a identické cesty, vďaka ktorým je ťažké vytvoriť presnú jedinečnú adresu webového prvku s názvom „XPATH“.
Tu sa podrobne ponoríme do niekoľkých skvelých a efektívnych techník, ako vygenerovať platný a jedinečný XPATH pre akýkoľvek typ webového prvku.
Odporúčané čítanie => Identifikujte webové prvky pomocou protokolu XPath v seléne
Niekedy môžete ľahko vytvoriť XPath pomocou rozšírení prehľadávača, ale v mojom automatizované testovanie svojej kariéry som sa stretol s nespočetnými situáciami, keď tradičné rozšírenia prehľadávača nefungujú a musíte si pomocou vlastnej kreativity vymyslieť vlastné prispôsobené cesty XPath. Som si istý, že podobné situácie máte alebo budete čeliť.
V tomto výučbe sa pozrieme na 20 najlepších spôsobov, ako vytvoriť špičkový XPath pre webový prvok, napríklad tak, že aj keď sa váš kód zmení, váš XPath zostane v platnosti po celú dobu (pokiaľ vývojár neprepíše celý funkcia / modul).
Keď budete poznať všetky tieto techniky, stanete sa majstrom v písaní vlastnej cesty XPath a budete schopní písať vrahovské cesty XPath s veľmi malou pravdepodobnosťou, že sa stanete neplatnými.
Najprv začnime porozumením syntaxe XPath a definujme každú z jej častí.
Nasledujúci obrázok ukazuje, ako bude XPath vyzerať, spolu s popisom jednotlivých častí:
- //: Vyberte aktuálny uzol, napríklad vstup, div atď.
- Názov značky: Názov značky webového prvku / uzla
- @: Vyberte atribút
- Atribút: Názov atribútu uzla / konkrétneho webového prvku
- Hodnota: Hodnota atribútu
Chcem sa tu len podeliť o niekoľko tipov, že 80% času zlyhal pri testovaní automatizácie kvôli skriptu XPath. Je to spôsobené buď tým, že zadaný XPath obsahuje viac webových prvkov, alebo je XPath neplatný alebo stránka ešte nebola načítaná.
Takže kedykoľvek váš testovací prípad zlyhá:
- Skopírujte svoju cestu XPath.
- Vyhľadajte ho v prehliadači (F12 alebo okno nástroja pre vývojárov) v DOM a overte, či je platný alebo nie (pozri obrázok nižšie).
Pro Type 1: Uistite sa, že je jedinečný a pri vyhľadávaní dvakrát v DOM sa nezobrazí žiadny iný webový prvok.
Pro Type 2: Niekedy sa vyskytne problém s načasovaním, čo znamená, že váš webový prvok / stránka ešte nie je načítaná, kým ju hľadal skript, preto pridajte čas čakania a vykonajte test znovu.
Pro Type 3: Pred hľadaním webového prvku sa pokúste vytlačiť celý DOM. Týmto spôsobom zistíte, že v konzole zistíte, či váš webový prvok existuje v DOM alebo nie.
Predtým, ako sa ponoríme hlboko do vyhľadávania XPath, chcem sa podeliť o jednu dôležitú vec, že ak máte priamy prístup k vývojovému tímu alebo ak sa váš tím nachádza tam, kde ste, požiadajte svoj vývojový tím, aby vám poskytol jedinečné ID v každý webový prvok alebo aspoň tie, ktoré chcete použiť pre automatizáciu, a ušetrí vám to veľa času.
Ak to nie je možné, možno budete musieť použiť svoju kreativitu a prísť s vlastnými prispôsobenými XPaths, a čo sa teraz naučíme.
Top 20 spôsobov, ako napísať XPath pre akýkoľvek webový prvok
Poďme sa ponoriť do vytvárania top 20 spôsobov, ako zabiť XPath.
# 1) Spätné vyhľadávanie
Povedzme, že chcete kliknúť na tlačidlo a existuje podobné tlačidlo. Obe tlačidlá majú atribúty id, sú však dynamické a žiadny z atribútov nie je jedinečný v obidvoch prvkoch tlačidiel.
V nasledujúcom scenári chceme kliknúť na tlačidlo „Nastavenie“ v rámci „Testovať interaktívne“.
Zákonníka
Ak sa pozriete na tlačidlá „Nastavenie“, obidva kódy sú podobné. Pri použití tradičných spôsobov ako id, meno, hodnota, contains a pod., Žiadny z nich nebude fungovať napr.
// * (obsahuje (text (), ‘nastavenie’))), výsledkom budú dva webové prvky. Preto to nie je jedinečné.
Takže tu je konečná stratégia,
>> Najskôr vyhľadajte najbližšiu značku, ktorá je jedinečná, a v tomto prípade je
XPATH: “//*(@id='rcTEST')
>> Po druhé, vyhľadajte najbližší webový prvok zamýšľanému webovému prvku, ktorý v tomto prípade obsahuje (text (), „TEST Interactive“). Teraz sme na rovnakom mieste, kde existuje tlačidlo „Nastavenie“, ale aby sme na neho klikli, musíme najskôr prejsť na hlavný bod pomocou dvojitých bodiek, ako je znázornené nižšie.
XPATH: “//*(@id='rcTEST')//*(contains(text(), 'TEST Interactive'))/..
>> Ako vidíte, nachádzame sa na úrovni, ktorá má druhý webový prvok ako tlačidlo „Nastavenie“. Toto má dve tlačidlá a chceme prejsť na druhé tlačidlo, ktorým je tlačidlo „Nastavenie“. Pridaním tlačidla „/ tlačidlo (2)“ na konci môžeme získať náš jedinečný XPATH pre tlačidlo „Nastavenie“, ako je uvedené nižšie.
Konečná XPATH:
“//*(@id='rcTEST')//*(contains(text(), 'TEST Interactive'))/../button(2)”
Tu je ďalší spôsob generovania, ak si myslíte, že by mohli zmeniť typ webového prvku z „tlačidla“ na niečo iné.
“//*(@id='rcTEST')//*(contains(text(), 'TEST Interactive'))/..//*(contains(text(), 'Setting'))”
alebo pomocou „nasledovného súrodenca“
“//*(@id='rcTEST')//*(contains(text(), 'TEST Interactive'))/following-sibling::button”
# 2) Používanie premenných a vlastných hodnôt
Povedzme, že existuje webová aplikácia, ktorá má funkciu FTP („File Transfer Protocol“) na nahrávanie / sťahovanie súborov a máte testovací prípad na stiahnutie konkrétneho súboru kliknutím na odkaz na stiahnutie.
Najskôr môžeme definovať názov súboru, ktorý hľadáme, ako premennú.
Reťazec expectfileName = “Test1”;
Teraz pomocou XPATH môžeme nájsť skutočný názov súboru.
“String actualFileName = WebDriverAccess.getDriver().findElement (By.xpath('//*'+fileName +'/tr/td(1)')).getAttribute('title');”
Vo vyššie uvedenom XPath prejde ... / / tr / td (1) .getAttribute („title“) do konkrétneho riadku a prvého stĺpca a získa hodnotu atribútu title. Skutočný názov súboru môžeme uložiť do inej premennej.
Keď máme očakávaný aj skutočný názov súboru, môžeme ich porovnať a ak sa zhodujú, môžeme jednoducho kliknúť na odkaz na ich stiahnutie.
(if acutalFileName == expectedFileName) { WebDriverAccess.getDriver().findElement(By.xpath('//*'+fileName +'/tr/td(4)')).click(); }
Môžeme tiež vytvoriť slučku cez každý riadok a neustále overovať názov súboru, kým ho nenájdete.
Loop(int count <30) { String actualFileName = WebDriverAccess. getDriver ().findElement (By. xpath ('//*'+acutalFileName +'/tr(' + count + ')/td(1)')).getAttribute('title'); (if acutalFileName == expectedFileName) { WebDriverAccess. getDriver ().findElement(By. xpath ('//*'+fileName +'/tr/td(4)')).click(); } Count++; }
Môžeme vygenerovať jedinečný XPATH pomocou prispôsobených značiek a pridať ďalšie podmienky.
Napríklad, povedzme, že náš zamýšľaný webový prvok existuje v hlavnej značke a existuje viac štítkov s adresami, ale chcete nájsť iba konkrétny. Všetky štítky s adresami majú atribút triedy, takže môžeme začať s.
// address(@class='ng-scope ng-isolate-scope')
Všimli sme si, že náš zamýšľaný webový prvok je v značke, ktorá má text nazvaný „Testovanie“.
// address(@class='ng-scope ng-isolate-scope')//div(contains(.,'Testing')
Prišli sme na to, že vo výsledku sa našlo viac webových prvkov. Preto, aby bol jedinečný, môžeme pridať ďalšie podmienky, ako napríklad „id“, ktoré nás nakoniec nasmerujú na webový prvok, ktorý hľadáme.
// address(@class='ng-scope ng-isolate-scope')//div(contains(.,Testing') and @id='msgTitle')
# 4) Používanie atribútov a tabuľky XPATH
Predpokladajme, že chceme napísať do webového prvku, ktorý je umiestnený vo vnútri tabuľky a tabuľka je umiestnená vo vnútri prvku formulára.
Všetky formy vo vnútri DOM nájdeme s názvom „myForm“.
“//*(@name='myForm')”
Teraz vo všetkých formulároch nájdite tabuľku s id „tbl_testdm“.
'//*(@name='myForm')//table(@id='tbl_ testdm’)”
V rámci tabuľky prejdite na konkrétny riadok a stĺpec.
'//*(@name='myForm')//table(@id='tbl_ testdm’)/tbody/tr/td(6)/”
Ak je v bunke viac vstupov, nájdite vstup, kde hodnota = „Otvoriť RFS“, čím získate konečnú cestu XPath poľa.
//*(@name='myForm')//table(@id='tbl_ testdm’)/tbody/tr/td(6)/ input(@value='Open RFS')'
# 5) Používanie atribútov, tabuliek a textu
Predpokladajme, že váš zamýšľaný webový prvok sa nachádza v tabuľke panelov a obsahuje nejaký spoločný text.
Najskôr začnite panelom s jedinečným atribútom, ktorý je v tomto prípade „TITLE“.
//*(@title=’Songs Lis Applet')
Teraz prechádzajte všetky značky tabuľky.
//*(@title=’Songs Lis Applet')//table
Vo všetkých tabuľkách nájdite stĺpec s textom „Autor“.
Finálny XPath by vyzeral takto:
//*(@title=’Songs List Applet')//table//td(contains(text(),'Author'))
# 6) Generovanie XPATH pomocou vnorených atribútov
XPath cieľového webového prvku možno vygenerovať aj pomocou vnorených atribútov. Napríklad, v takom prípade vyhľadá konkrétny atribút v rámci DOM a potom v ňom vyhľadá ďalší atribút.
//*(@id='parameters')//*(@id='testUpdateTime')')
# 7) Generovanie XPath kombináciou atribútov, prvkov Div a tlačidla
Napríklad, v nasledujúcom XPath som bol schopný nájsť cieľový webový prvok pomocou id (relatívny XPath), niekoľkých značiek div a tlačidla.
“//*(@id='MODEL/PLAN')/div(1)/div(2)/div(1)/div(1)/widget/section/div(1)/div/div(1)/div/div/button(1)'
# 8) Generovanie XPATH pomocou OBSAHU, SPÄTNÉHO HĽADANIA atď.
Raz som mal rozbaľovaciu ponuku bez priamej identifikácie. Musel som použiť atribúty CONTAINS, REVERSE, DIVs, aby som prišiel s finálnou XPATH, ako je uvedené nižšie.
//*(contains(text(),'Watch Dial))/../div/select(@data-ng-model='context.questions (subqts.subHandleSubId)')'),
# 9) Generovanie XPath pomocou relatívnych, OBSAHUJE, SPÄTNÝCH, NÁSLEDUJÚCICH SIBLINGOV, atď.
Mal som situáciu, že aplikácia zobrazuje graf a každú hodnotu grafu bolo treba overiť. Ale, bohužiaľ, každá hodnota nemala nijakú jednoznačnú identifikáciu, preto som pre poslednú hodnotu XPATH, ako je zobrazené nižšie, vymyslel jednu grafickú hodnotu, ktorá kombinuje značky relatívneho, obsahuje, reverzuje, sleduje súrodenca a div.
//*(@id='RESEARCH/PLAN')//*(contains(@id, 'A4'))/../../following-sibling::div(1)/div(1)/span(1)/span(1)
# 10) Generovanie XPath pomocou atribútov, Convert, Reverse, Preceding-Sibling, Divs a Span
Raz som musel overiť rôzne údaje alarmu a každá hodnota alarmu sa zobrazila na základe konkrétneho výpočtu alebo časovania. Aby som mohol zachytiť každú hodnotu, musel som prísť s nižšie uvedenou XPATH, ktorá používa značky atribútov, obsahuje, reverzovať, predchádzajúci súrodenec, divs a span.
//*(@id='ALARMDATA')//*(contains(@id, 'AFC2'))/../../preceding-sibling::div(1)/div(1)/span(1)/span(1)
# 11) Používanie atribútov, značiek XML atď.
V nasledujúcom XPATH, atribútoch a značkách XML sa na získanie konečnej jedinečnej adresy webového prvku používa sekvencia.
//*(@id='RESEARCH/REVIEW') //widget/section/div(1)/div/div(2)/div(1)/div(3)/div(1)//span(@class='details')
# 12) Generovanie XPath tým, že sa nepozeráte na celú stránku, ale skôr sa pozeráte do všetkých odkazov a obsahuje
Nasledujúci XPath bude hľadať iba odkazy na celej stránke, ktoré obsahujú text ako „Manuálne zadanie údajov o parametroch“.
//a(contains(.,'Parameter Data Manual Entry'))
# 13) Používanie obsahuje a atribúty
//*(contains(@style,'display: block; top:'))//input(@name='daterangepicker_end')
# 14) Používanie atribútov, sledovanie súrodencov a potomkov
//*(@id='dropdown-filter-serviceTools')/following-sibling::ul/descendant::a(text()='Notepad')
# 15) Používanie atribútov, sledovanie súrodencov, potomkov a textu
//*(@id='dropdown-filter-service tools') /following-sibling::ul/descendant::a(text()='Trigger Dashboard')
# 16) Používanie hlavičky a textu
Ak je webovým prvkom hlavička s nejakým konkrétnym textom, potom môže byť XPath nasledovný:
//h3(text()='Internal Debrief')
# 17) Používanie textu hlavičky, sledovanie súrodencov, cesta atď.
//h3(contains(text(),'Helium Level'))/following-sibling::div/label/input
# 18) Používanie atribútov, obsahuje a predchádza súrodencov
Keď som mal rozpätie, ktoré nemalo žiadny jedinečný atribút, vytvoril som XPATH kombináciou absolútneho, Obsahuje, predchádzajúcich súrodencov a inej absolútnej cesty.
//div(div(p(contains(text(),'Status'))))/preceding-sibling::div/div/span(3)/span
# 19) Hľadáte rozbaľovaciu ponuku pomocou atribútu Id, nejakého konkrétneho textu a spätného vyhľadávania
//*(@id='COUPLING')//*(contains(text(),'COUPLE Trend'))/../div/select
# 20) Kombinácia atribútu „id“ a hľadanie odkazu s konkrétnym textom
//*(@id='ffaHeaderDropdown')//a(contains(text(),'Start Workflow'))
Záver
Pokiaľ ide o napísanie zabijáckej XPATH, veľmi záleží na tom, ako dobre kódu rozumiete a analyzujete. Čím viac kódu pochopíte, tým viac spôsobov, ako písomné písanie efektívnych XPATH nájdete, nájdete.
Prvým krokom pri písaní protokolu XPath je nájsť najbližší jedinečný webový prvok k cieľovému webovému prvku a neustále sa približovať pomocou rôznych vyššie diskutovaných techník, ako sú atribúty, DIV, nasledujúce, obsahuje atď.
Na záver by sme to ešte raz povedali, že vám skutočne uľahčí život, ak požiadate vývojový tím o pridanie jedinečných identifikátorov do všetkých webových prvkov, ktoré vás zaujímajú.
Kedykoľvek začne cyklus šprintov alebo práca na nových požiadavkách a tím bude zdieľaný s novými modelmi, vždy prejdem všetkými modelmi a v duchu si premyslím potenciálne prípady automatizácie, pripravím si zoznam všetkých potenciálnych webových prvkov, ktoré budú použité v automatizačných testoch a pripraviť si svoje vlastné ID.
Po dokončení zoznamu všetkých webových prvkov spolu s mojimi navrhnutými ID by som ho vopred zdieľal s vývojárom, aby sa mohol použiť vo vývojovom kóde. Týmto spôsobom by som vždy získal jedinečné ID, aby som uľahčil svoju bitku pri písaní XPATH.
Nižšie je uvedený kombinovaný zoznam rôznych spôsobov zápisu XPATH:
- „// * (@ id =‘ rcTEST ’) // * (obsahuje (text (),‚ TEST Interactive ‘)) /../ tlačidlo (2)“
- „// * (@ id =‘ rcTEST ‘) // * (obsahuje (text (),‚ TEST Interactive ‘)) /..//* (obsahuje (text (),‚ nastavenie ‘))“
- „// * (@ id =‘ rcTEST ’) // * (obsahuje (text (),‚ TEST Interactive ‘)) / nasledovný súrodenec :: tlačidlo“
- 'String actualFileName = WebDriverAccess.getDriver (). FindElement (By.xpath (' // * '+ názov súboru +' / tr / td (1) ')). GetAttribute (' názov ');'
- WebDriverAccess.getDriver (). FindElement (By.xpath ('// *' + názov súboru + '/ tr / td (4)')). Kliknúť ();
- '// adresa (@ class = 'ng-scope ng-isolate-scope') // div (obsahuje (., Testovanie ') a @ id =' msgTitle ')'
- „// * (@ name =‘ myForm ’) // tabuľka (@ id =‘ tbl_ testdm ’) / tbody / tr / td (6) /
- vstup (@ value = ‘Otvoriť RFS’) “
- „// * (@ title =‘ Songs List Applet ‘) // tabuľka // td (obsahuje (text (),‚ autor ‘))“
- „// * (@ id =‘ parametre ‘) // * (@ id =‘ testUpdateTime ’)”) “
- “// * (@ id = 'MODEL / PLÁN') / div (1) / div (2) / div (1) / div (1) / widget / oddiel / div (1) / div / div (1) / div / div / tlačidlo (1) ”
- „// * (contains (text (),‘ Watch Dial)) /../ div / select (@ data-ng-model = ‘context.questions (subqts.subHandleSubId)‘) “),“
- “// * (@ id = 'VÝSKUM / PLÁN') // * (obsahuje (@id, 'A4')) /../../ nasledujúci súrodenec :: div (1) / div (1) / rozpätie (1) / rozpätie (1) “
- “// * (@ id = 'ALARMDATA') // * (obsahuje (@id, 'AFC2')) /../../ predchádzajúci súrodenec :: div (1) / div (1) / span ( 1) / rozpätie (1) “
- “// * (@ id = 'VÝSKUM / RECENZIA') // widget / oddiel / div (1) / div / div (2) / div (1) / div (3) / div (1) // span ( @ class = 'details') ”
- „//A(obsahuje(.,‘ Manuálne zadanie údajov o parametroch ‘))“
- „// * (contains (@ style,‘ display: block; top: ‘)) // vstup (@ name =‘ daterangepicker_end ’)“
- „// * (@ id =‘ dropdown-filter-serviceTools ‘) / following-sibling :: ul / descendant :: a (text () =‘ Poznámkový blok ‘)“
- „// * (@ id =‘ dropdown-filter-serviceTools ‘) / following-sibling :: ul / descendant :: a (text () =‘ Trigger Dashboard ‘)“
- “// h3 (text () =‘ Internal Debrief ’)”
- „// h3 (contains (text (),‘ Helium Level ‘)) / following-sibling :: div / label / input“
- “// div (div (p (contains (text (),‘ Status ‘)))) / prior-sibling :: div / div / span (3) / span“
- „// * (@ id =‘ COUPLING ’) // * (contains (text (),, COUPLE Trend‘)) /../ div / select “
- „// * (@ id =‘ ffaHeaderDropdown ‘) // a (obsahuje (text (),‚ Spustiť pracovný postup ‘))“
Dúfam, že tento informačný článok obohatil vaše vedomosti o písaní XPaths.
Autor Bio: Tento článok je napísaný Adnanom Arifom, IT špecialistom s rôznymi skúsenosťami a zručnosťami v jeho kariére trvajúcej viac ako 9 rokov.
Odporúčané čítanie
- Hĺbkové návody pre zatmenie pre začiatočníkov
- Výukový program pre Python DateTime s príkladmi
- Syntax príkazov Unix Cat, možnosti s príkladmi
- Unixový príkaz na triedenie so syntaxou, možnosťami a príkladmi
- Výukový program pre skriptovanie Unixu s príkladmi
- Sprievodca hľadaním prvkov selénom podľa výučby s príkladmi
- Výukový program pre hlavné funkcie Pythonu s praktickými príkladmi
- Postprocesor Xpath Extractor v JMeter