ultimate xpath writing cheat sheet tutorial with syntax
Topp 20 sätt att skriva Ultimate XPATH för ALLA typer av webbelement (XPATH kommer aldrig att vara ogiltigt):
En webbapplikation består av olika typer av webbelement som webbelement för en knapp att klicka på, mata in webbelement för att skriva text, rullgardinsmeny, alternativknappar etc.
Dessa webbelement kallas också taggar eller noder.
När det gäller automatisering av webbapplikationer börjar det med att skriva ett automatiseringsskript som hittar webbelementet, utföra en åtgärd på det, till exempel, klicka på en knapp, ange text i inmatningsrutan, markera en kryssruta, välj en alternativknapp, bläddra uppåt eller nedåt och bekräfta slutligen det förväntade beteendet i sin tur.
Vad du kommer att lära dig:
- Hur är XPath och hur det ser ut?
- Topp 20 sätt att skriva XPath för alla webbelement
- # 1) Omvänd sökning
- # 2) Använda variabler och anpassade värden
- # 3) Använda “XML” -taggar, “OCH” osv
- # 4) Använda attribut och tabell XPATH
- # 5) Använda attribut, tabeller och text
- # 6) Generera XPATH med kapslade attribut
- # 7) XPath Generation genom att kombinera attribut, Divs och Button
- # 8) XPATH-generering med CONTAINS, REVERSE LOOKUP, etc.
- # 9) XPath-generation med Relativ, INNEHÅLLER, OMVÄNDNING, FÖLJANDE SYSTEM etc.
- # 10) XPath-generation med hjälp av attribut, innehåller, omvänd, föregående syskon, divs och span
- # 11) Använda attribut, XML-taggar etc.
- # 12) XPath Generation genom att inte titta på hela sidan utan att titta på alla länkar istället och innehåller
- # 13) Använda Innehåll och attribut
- # 14) Använda attribut, efter syskon och efterkommande
- # 15) Använda attribut, följa syskon, ättling och text
- # 16) Använda rubrik och text
- # 17) Använda rubriktext, följa syskon, väg osv.
- # 18) Använda attribut, innehåller och föregående syskon
- # 19) Letar efter rullgardinsmeny med Id-attribut, viss specifik text och omvänd sökning
- # 20) Kombinera “id” -attribut och leta efter en länk med specifik text
- Slutsats
- Rekommenderad läsning
Hur är XPath och hur det ser ut?
Att hitta ett element är som att hitta någons hus på kartan. Det enda sättet vi kan hitta en väns hem utan extern hjälp är att vi ska ha en karta och veta vad vi ska hitta (hus).
För att sätta denna analogi i vårt fall kommer kartan att användas som DOM (HTML-taggar, JavaScript, etc.) där alla webbelement finns, tillsammans med det specifika webbelement som vi vill hitta.
När den unika adressen eller sökvägen till ett element har hittats kommer automatiseringsskriptet att utföra några åtgärder på det baserat på testscenariot. Till exempel, du vill verifiera webbadressen till sidan som öppnas efter att du har klickat på en knapp.
Det är emellertid inte rakt framåt att hitta en unik adress / sökväg till ett webbelement eftersom det kan finnas liknande taggar, samma attributvärden, identiska sökvägar som gör det svårt att skapa exakt unik adress till ett webbelement som kallas 'XPATH'.
Här kommer vi att fördjupa oss i några fantastiska och effektiva tekniker för att skapa giltig och unik XPATH för alla typer av webbelement.
Rekommenderad läsning => Identifiera webbelement med XPath i Selen
Ibland kan du enkelt skapa XPaths med hjälp av webbläsartillägg men i min automatiseringstestning karriär har jag mött otaliga situationer där traditionella webbläsartillägg inte fungerar och du måste komma med dina egna skräddarsydda XPaths med din egen kreativitet. Jag är säker på att du har eller kommer att möta liknande situationer.
I den här handledningen kommer vi att ta en titt på de 20 bästa sätten att skapa ultimata XPath för ett webbelement, till exempel att även din kod ändras kommer din XPath att vara giltig hela tiden (om inte utvecklaren skriver om hela funktion / modul).
Genom att känna till alla dessa tekniker kommer du att bli en mästare i att skriva din egen XPath och skulle kunna skriva mördare XPaths med mycket få chanser att bli ogiltiga.
Låt oss börja med att förstå XPath-syntaxen och definiera var och en av dess delar.
Bilden nedan visar hur XPath kommer att se ut tillsammans med en beskrivning av varje del:
- //: Välj aktuell nod såsom inmatning, div etc.
- Taggnamn: Tagnamn för webbelementet / noden
- @: Välj attribut
- Attribut: Attributnamn för noden / det specifika webbelementet
- Värde: Attributets värde
Vill bara dela ett par tips här att 80% av tiden min automatik testskript misslyckades på grund av XPath. Detta orsakas av antingen att det finns flera webbelement för den angivna XPath eller XPath är inte giltig eller så har sidan inte laddats ännu.
Så när ditt testfall misslyckas:
- Kopiera din XPath.
- Sök i webbläsaren (F12 eller fönstret för utvecklarverktyg) i DOM för att verifiera om den är giltig eller inte (se bilden nedan).
Pro typ 1: Se till att den är unik och att inget annat webbelement visas när du söker två gånger i DOM.
Pro typ 2: Ibland finns det en tidsfråga, vilket innebär att ditt webbelement / sida ännu inte har laddats medan skriptet letade efter det, och lägg till lite väntetid och testa om.
Pro typ 3: Försök att skriva ut hela DOM innan du söker efter webbelementet. På detta sätt kan du se genom att titta in i Console om ditt webbelement finns i DOM eller inte.
Innan vi dyker djupt in i XPath-sökning, är en viktig sak som jag vill dela med mig av att om du har direkt tillgång till utvecklingsteamet eller om ditt team finns där du är, be ditt utvecklingsteam att ge dig unika ID: n i varje webbelement eller åtminstone de som du vill använda för automatisering och detta sparar mycket av din tid.
Om detta inte är möjligheten kan du behöva använda din kreativitet och komma med dina egna skräddarsydda XPaths och det är vad vi ska lära oss nu.
Topp 20 sätt att skriva XPath för alla webbelement
Låt oss djupt dyka in i att skapa de 20 bästa vägarna till en mördare XPath.
# 1) Omvänd sökning
Låt oss säga att du vill klicka på en knapp och det finns en liknande knapp. Båda knapparna har id-attribut, men de är dynamiska och inget av attributen är unikt i båda knappelementen.
I scenariot nedan vill vi klicka på 'Inställning' -knappen i 'Test Interactive'.
Koda
Om du tittar på inställningsknapparna är båda koderna lika. Genom att använda traditionella sätt som id, namn, värde, innehåller etc. fungerar ingen av dem till exempel.
// * (innehåller (text (), 'Inställning')), Detta kommer att resultera i två webbelement. Därför är det inte unikt.
Så här är den sista strategin,
>> Först, hitta den närmaste taggen som är unik och i det här fallet är den
XPATH: “//*(@id='rcTEST')
>> För det andra, hitta det närmaste webbelementet till det avsedda webbelementet som i detta fall innehåller (text (), 'TEST Interactive'). Nu befinner vi oss i samma läge där inställningsknappen finns, men för att klicka på den måste vi först gå till huvudmenyn med dubbla prickar som visas nedan.
XPATH: “//*(@id='rcTEST')//*(contains(text(), 'TEST Interactive'))/..
>> Som du kan se är vi på den nivå som har det andra webbelementet som inställningsknapp. Den här har två knappar och vi vill gå till den andra knappen som är inställningsknappen. Genom att lägga till “/ knapp (2)” i slutet kan vi få vår unika XPATH för inställningsknappen enligt nedan.
Slutlig XPATH:
“//*(@id='rcTEST')//*(contains(text(), 'TEST Interactive'))/../button(2)”
Här är ett annat sätt att generera om du tror att de kan ändra webbelementtypen från 'knapp' till något annat.
“//*(@id='rcTEST')//*(contains(text(), 'TEST Interactive'))/..//*(contains(text(), 'Setting'))”
eller med hjälp av 'följande syskon'
“//*(@id='rcTEST')//*(contains(text(), 'TEST Interactive'))/following-sibling::button”
# 2) Använda variabler och anpassade värden
Låt oss säga att det finns en webbapplikation som har FTP ('File Transfer Protocol') -funktion för att ladda upp / ladda ner filer och du har ett testfall för att ladda ner en specifik fil genom att klicka på nedladdningslänken.
Först kan vi definiera filnamnet som vi letar efter som en variabel.
Sträng förväntad filnamn = “Test1”;
Nu med XPATH kan vi hitta det faktiska filnamnet.
“String actualFileName = WebDriverAccess.getDriver().findElement (By.xpath('//*'+fileName +'/tr/td(1)')).getAttribute('title');”
I ovanstående XPath kommer ... ‘/ tr / td (1) .getAttribute (“ title ”)” att gå till den specifika raden och första kolumnen och få värdet på titelattributet. Vi kan lagra det faktiska filnamnet i en annan variabel.
När vi har både förväntade och faktiska filnamn kan vi jämföra båda och om båda matchar kan vi helt enkelt klicka på nedladdningslänken.
(if acutalFileName == expectedFileName) { WebDriverAccess.getDriver().findElement(By.xpath('//*'+fileName +'/tr/td(4)')).click(); }
Vi kan också skapa en slinga genom varje rad och fortsätta verifiera filnamnet tills du hittar det.
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++; }
Vi kan skapa unika XPATH med hjälp av anpassade taggar plus lägga till andra villkor.
Till exempel, låt oss säga att vårt avsedda webbelement finns i huvudtaggen, och det finns flera adresslappar, men du vill bara hitta en specifik. Alla adresslappar har ett klassattribut, så vi kan börja med.
testers-inc iptv fungerar inte
// address(@class='ng-scope ng-isolate-scope')
Vi märkte att vårt avsedda webbelement finns i en tagg som har en del text som heter ”Testing”.
// address(@class='ng-scope ng-isolate-scope')//div(contains(.,'Testing')
Vi räknade ut att det finns flera webbelement som hittades som ett resultat. Därför för att göra det mer unikt kan vi lägga till andra villkor som 'id' som äntligen kommer att peka på det webbelement som vi letar efter.
// address(@class='ng-scope ng-isolate-scope')//div(contains(.,Testing') and @id='msgTitle')
# 4) Använda attribut och tabell XPATH
Låt oss anta att vi vill skriva in ett webbelement som placeras i en tabell och bordet placeras i ett formulärelement.
Vi hittar alla former i DOM med namnet 'myForm'.
“//*(@name='myForm')”
Nu i alla former hittar du tabellen med id 'tbl_testdm'.
'//*(@name='myForm')//table(@id='tbl_ testdm’)”
Gå till en specifik rad och kolumn i tabellen.
'//*(@name='myForm')//table(@id='tbl_ testdm’)/tbody/tr/td(6)/”
Om det finns flera ingångar i cellen, leta reda på en ingång där värde = 'Öppna RFS', och detta ger oss den sista XPath i fältet.
//*(@name='myForm')//table(@id='tbl_ testdm’)/tbody/tr/td(6)/ input(@value='Open RFS')'
# 5) Använda attribut, tabeller och text
Antag att ditt avsedda webbelement ligger i paneltabellen och har en del vanlig text.
Börja först med en panel med ett unikt attribut som i det här fallet är 'TITEL'.
//*(@title=’Songs Lis Applet')
Navigera nu genom alla tabelltaggar.
//*(@title=’Songs Lis Applet')//table
Inom alla tabeller hittar du kolumnen som har texten ”Författare”.
Slutlig XPath skulle vara som:
//*(@title=’Songs List Applet')//table//td(contains(text(),'Author'))
# 6) Generera XPATH med kapslade attribut
Målwebelementets XPath kan också genereras med hjälp av de kapslade attributen. Till exempel, i det här fallet kommer det att leta efter ett specifikt attribut över DOM och sedan leta efter ett annat attribut inom det.
//*(@id='parameters')//*(@id='testUpdateTime')')
# 7) XPath Generation genom att kombinera attribut, Divs och Button
Till exempel, i XPath nedan kunde jag hitta mål-webbelementet med hjälp av ett id (relativ XPath), några div-taggar och en knapp.
“//*(@id='MODEL/PLAN')/div(1)/div(2)/div(1)/div(1)/widget/section/div(1)/div/div(1)/div/div/button(1)'
# 8) XPATH-generering med CONTAINS, REVERSE LOOKUP, etc.
En gång hade jag en rullgardinsmeny utan direkt identifiering. Jag var tvungen att använda CONTAINS, REVERSE, DIVs, attribut för att komma med den slutliga XPATH som visas nedan.
//*(contains(text(),'Watch Dial))/../div/select(@data-ng-model='context.questions (subqts.subHandleSubId)')'),
# 9) XPath-generation med Relativ, INNEHÅLLER, OMVÄNDNING, FÖLJANDE SYSTEM etc.
Jag hade en situation där applikationen visar ett diagram och varje grafvärde måste valideras. Men tyvärr hade varje värde ingen unik identifiering, så jag har kommit fram till den slutliga XPATH som visas nedan för ett grafvärde som kombinerar relativa, innehåller, omvända, följande syskon och div-taggar.
//*(@id='RESEARCH/PLAN')//*(contains(@id, 'A4'))/../../following-sibling::div(1)/div(1)/span(1)/span(1)
# 10) XPath-generation med hjälp av attribut, innehåller, omvänd, föregående syskon, divs och span
En gång var jag tvungen att validera olika larmdata och varje larmvärde har visats baserat på en specifik beräkning eller tidpunkter. För att fånga varje värde var jag tvungen att komma med nedanstående XPATH som använder attribut, innehåller, omvänd, föregående syskon, divs och span-taggar.
//*(@id='ALARMDATA')//*(contains(@id, 'AFC2'))/../../preceding-sibling::div(1)/div(1)/span(1)/span(1)
# 11) Använda attribut, XML-taggar etc.
I nedanstående XPATH, attribut och XML-taggar används en sekvens för att komma fram till den slutliga unika adressen till ett webbelement.
//*(@id='RESEARCH/REVIEW') //widget/section/div(1)/div/div(2)/div(1)/div(3)/div(1)//span(@class='details')
# 12) XPath Generation genom att inte titta på hela sidan utan att titta på alla länkar istället och innehåller
Nedanstående XPath letar bara efter länkar på en hel sida som innehåller texten som 'Parameter Data Manual Entry'.
//a(contains(.,'Parameter Data Manual Entry'))
# 13) Använda Innehåll och attribut
//*(contains(@style,'display: block; top:'))//input(@name='daterangepicker_end')
# 14) Använda attribut, efter syskon och efterkommande
//*(@id='dropdown-filter-serviceTools')/following-sibling::ul/descendant::a(text()='Notepad')
# 15) Använda attribut, följa syskon, ättling och text
//*(@id='dropdown-filter-service tools') /following-sibling::ul/descendant::a(text()='Trigger Dashboard')
# 16) Använda rubrik och text
Om webbelementet är en rubrik med en viss text kan XPath vara som visas nedan:
//h3(text()='Internal Debrief')
# 17) Använda rubriktext, följa syskon, väg osv.
//h3(contains(text(),'Helium Level'))/following-sibling::div/label/input
# 18) Använda attribut, innehåller och föregående syskon
När jag väl hade ett intervall som inte hade något unikt attribut hade jag skapat XPATH genom att kombinera absolut, Innehåller, föregående syskon och en annan absolut sökväg.
//div(div(p(contains(text(),'Status'))))/preceding-sibling::div/div/span(3)/span
# 19) Letar efter rullgardinsmeny med Id-attribut, viss specifik text och omvänd sökning
//*(@id='COUPLING')//*(contains(text(),'COUPLE Trend'))/../div/select
# 20) Kombinera “id” -attribut och leta efter en länk med specifik text
//*(@id='ffaHeaderDropdown')//a(contains(text(),'Start Workflow'))
Slutsats
När det gäller att skriva en mördare XPATH beror det verkligen på hur väl du förstår och analyserar koden. Ju mer du förstår koden desto mer kommer antalet sätt att hitta effektiva XPATH.
Det första steget i att skriva XPath är att hitta det unika webbelementet som ligger närmast ditt mål-webbelement och fortsätta komma närmare med hjälp av olika tekniker som diskuterats ovan, såsom attribut, DIV, följande, innehåller etc.
I slutändan skulle vi säga detta igen att det verkligen kommer att göra ditt liv enklare om du ber ditt utvecklingsteam att lägga till unika id: n i alla webbelement som du är intresserad av.
När en sprintcykel eller arbete med nya krav börjar och teamet delas med nya mockups, går jag alltid igenom alla mocks ups och tänker på potentiella automatiseringstestfall i mina tankar, förbereder en lista över alla potentiella webbelement som kommer att användas i automatiseringstest och förbereda mina egna id: n.
När en lista med alla webbelement tillsammans med mina föreslagna id: er är klar, skulle jag dela den till utvecklaren på förhand för att användas i utvecklingskoden. På det här sättet skulle jag alltid få unika ID: n genom att göra min XPATH-skrivkamp enkel.
Nedan följer en kombinerad lista över olika sätt att skriva XPATH:
- “// * (@ id =’ rcTEST ’) // * (innehåller (text (),‘ TEST interaktiv ’)) /../ knapp (2)”
- “// * (@ id =’ rcTEST ’) // * (innehåller (text (),‘ TEST interaktiv ’)) /..//* (innehåller (text (),‘ Inställning ’))”
- “// * (@ id =’ rcTEST ’) // * (innehåller (text (),‘ TEST interaktiv ’)) / följande syskon :: knapp”
- 'String actualFileName = WebDriverAccess.getDriver (). FindElement (By.xpath (' // * '+ filnamn +' / tr / td (1) ')). GetAttribute (' titel ');'
- WebDriverAccess.getDriver (). FindElement (By.xpath (“// *” + filnamn + ”/ tr / td (4)”)). Klicka ();
- '// adress (@ class = 'ng-scope ng-isolate-scope') // div (innehåller (., Testing ') och @ id =' msgTitle ')'
- “// * (@ name =’ myForm ’) // tabell (@ id =’ tbl_ testdm ’) / tbody / tr / td (6) /
- mata in (@ value = ’Open RFS’) ”
- “// * (@ title =’ Songs List Applet ’) // tabell // td (innehåller (text (),‘ Författare ’))”
- “// * (@ id =’ parametrar ’) // * (@ id =’ testUpdateTime ’)”) ”
- “// * (@ id = 'MODEL / PLAN') / div (1) / div (2) / div (1) / div (1) / widget / sektion / div (1) / div / div (1) / div / div / knapp (1) ”
- '// * (innehåller (text (), 'Watch Dial)) /../ div / välj (@ data-ng-model =' context.questions (subqts.subHandleSubId) ')'), '
- “// * (@ id = 'FORSKNING / PLAN') // * (innehåller (@id, 'A4')) /../../ följande syskon :: div (1) / div (1) / span (1) / span (1) ”
- “// * (@ id = 'ALARMDATA') // * (innehåller (@id, 'AFC2')) /../../ föregående syskon :: div (1) / div (1) / span ( 1) / span (1) ”
- “// * (@ id = 'FORSKNING / ÖVERSIKT') // widget / sektion / div (1) / div / div (2) / div (1) / div (3) / div (1) // span ( @ class = 'details') ”
- “//A (innehåller(.,’Parameter Data Manual Entry’)) ”
- “// * (innehåller (@ style,’ display: block; top: ’)) // input (@ name =’ daterangepicker_end ’)”
- “// * (@ id =’ dropdown-filter-serviceTools ’) / following-syskon :: ul / descendant :: a (text () =’ Notepad ’)”
- “// * (@ id =’ dropdown-filter-serviceTools ’) / following-syskon :: ul / descendant :: a (text () =‘ Trigger Dashboard ’)”
- “// h3 (text () =’ Internal Debrief ’)”
- “// h3 (innehåller (text (),‘ Heliumnivå ’)) / följande syskon :: div / label / input”
- '// div (div (p (innehåller (text (), 'Status')))) / föregående syskon :: div / div / span (3) / span'
- “// * (@ id =’ COUPLING ’) // * (innehåller (text (),‘ COUPLE Trend ’)) /../ div / select”
- “// * (@ id =’ ffaHeaderDropdown ’) // a (innehåller (text (), 'Starta arbetsflöde'))'
Hoppas att den informativa artikeln skulle ha berikat din kunskap om att skriva XPaths.
Författare Bio: Den här artikeln är skriven av Adnan Arif, en IT-expert som har olika erfarenheter och färdigheter i sin karriär som sträcker sig över 9 år.
Rekommenderad läsning
- Fördjupade förklaringar om förmörkelser för nybörjare
- Python DateTime-handledning med exempel
- Unix Cat Command Syntax, alternativ med exempel
- Unix Sortera kommando med syntax, alternativ och exempel
- Unix Shell Scripting Tutorial med exempel
- Selen Find Element by Text Tutorial med exempel
- Pythons huvudfunktionshandledning med praktiska exempel
- Xpath Extractor Post-Processor i JMeter