ultimate xpath writing cheat sheet tutorial with syntax
Top 20 de moduri de a scrie XPATH final pentru ORICE tip de element web (XPATH nu va fi niciodată invalid):
O aplicație web este alcătuită din diferite tipuri de elemente web, cum ar fi elementul web pentru care un buton poate face clic, elementul web de intrare pentru a tasta text, meniul derulant, butoanele radio etc.
Aceste elemente web sunt numite și etichete sau noduri.
Când vine vorba de automatizarea aplicațiilor web, începe cu scrierea unui script de automatizare care va găsi elementul web, va efectua o acțiune asupra acestuia, cum ar fi, faceți clic pe un buton, introduceți text în caseta de introducere, selectați o casetă de selectare, selectați un buton radio, derulați în sus sau în jos și verificați în cele din urmă comportamentul așteptat la rândul său.
Ce veți învăța:
- Ce este XPath și cum arată?
- Top 20 de moduri de a scrie XPath pentru orice element web
- # 1) Căutare inversă
- # 2) Utilizarea variabilelor și a valorilor personalizate
- # 3) Utilizarea etichetelor „XML”, „ȘI” etc.
- # 4) Utilizarea atributelor și a tabelului XPATH
- # 5) Utilizarea atributelor, tabelelor și textului
- # 6) Generarea XPATH folosind atribute imbricate
- # 7) Generarea XPath prin combinarea atributelor, divizărilor și butonului
- # 8) Generarea XPATH folosind CONTAINS, INVERSARE CĂUTARE etc.
- # 9) Generarea XPath folosind Relative, CONTAINS, INVERSE, URMĂTOARE SIBLING etc.
- # 10) Generarea XPath folosind atribute, conține, inversă, anterioară-frate, divizi și span
- # 11) Utilizarea atributelor, etichetelor XML etc.
- # 12) Generarea XPath nu căutând în întreaga pagină, ci căutând în schimb toate linkurile și conține
- # 13) Utilizarea conține și atribute
- # 14) Utilizarea atributelor, urmărirea fraților și descendenților
- # 15) Utilizarea atributelor, urmărirea fraților, descendentului și textului
- # 16) Utilizarea antetului și a textului
- # 17) Utilizarea textului antetului, urmărirea fraților, calea etc.
- # 18) Utilizarea atributelor, conține și frați anteriori
- # 19) Căutați o listă derulantă utilizând atributul de identificare, un text specific și căutarea inversă
- # 20) Combinarea atributului „id” și căutarea unui link cu text specific
- Concluzie
- Lectură recomandată
Ce este XPath și cum arată?
Găsirea unui element este ca și cum ai găsi casa cuiva pe hartă. Singurul mod în care putem găsi casa unui prieten fără niciun ajutor extern este că ar trebui să avem o hartă și să știm ce să găsim (casa).
Pentru a pune această analogie în cazul nostru, harta va fi utilizată ca DOM (etichete HTML, JavaScript etc.) unde există toate elementele web, împreună cu elementul web specific pe care dorim să îl găsim.
Odată găsită adresa sau calea unică a unui element, scriptul de automatizare va efectua apoi câteva acțiuni pe baza acestuia, pe baza scenariului de testare. De exemplu, doriți să verificați adresa URL a paginii care se deschide după ce faceți clic pe un buton.
Cu toate acestea, nu este simplu să găsiți o adresă / cale unică a unui element web, deoarece ar putea exista etichete similare, aceleași valori ale atributelor, căi identice făcând dificilă crearea unei adrese unice exacte pentru un element web numit „XPATH”.
Aici, ne vom scufunda în câteva tehnici excelente și eficiente pentru a genera XPATH valid și unic pentru orice tip de element web.
Citiți recomandat => Identificați elemente web folosind XPath în seleniu
Uneori puteți crea cu ușurință XPaths folosind extensii de browser, dar în my testarea automatizării carieră, m-am confruntat cu nenumărate situații în care extensiile tradiționale de browser nu funcționează și trebuie să îți creezi propriile XPath-uri personalizate folosind propria creativitate. Sunt sigur că aveți sau vă veți confrunta cu situații similare.
În acest tutorial, vom arunca o privire la cele mai bune 20 de modalități de a crea XPath final pentru un element web, astfel încât chiar și atunci când codul dvs. este modificat, XPath-ul dvs. va rămâne valabil tot timpul (cu excepția cazului în care dezvoltatorul rescrie întregul caracteristică / modul).
Cunoscând toate aceste tehnici, veți deveni un maestru în scrierea propriului XPath și veți putea scrie XPaths ucigași cu foarte puține șanse de a deveni invalizi.
În primul rând, să începem cu înțelegerea sintaxei XPath și să definim fiecare dintre părțile sale.
Imaginea de mai jos va arăta cum va arăta XPath împreună cu o descriere a fiecărei părți:
- //: Selectați nodul curent, cum ar fi intrarea, div etc.
- Nume eticheta: Tagname al elementului / nodului web
- @: Selectați atributul
- Atribut: Numele atributului nodului / elementului web particular
- Valoare: Valoarea atributului
Vreau doar să împărtășesc câteva sfaturi aici că 80% din timp scriptul meu de test de automatizare a eșuat din cauza XPath. Acest lucru cauzat fie de existența mai multor elemente web pentru XPath furnizat, fie XPath nu este valid sau pagina nu a fost încă încărcată.
Deci, ori de câte ori cazul dvs. de testare eșuează:
- Copiați XPath.
- Căutați-l în browser (F12 sau fereastra instrumentului pentru dezvoltatori) din DOM pentru a verifica dacă este valid sau nu (Vedeți imaginea de mai jos).
Pro Tip 1: Asigurați-vă că este unic și că nu apare niciun alt element web atunci când căutați de două ori în DOM.
Pro Tip 2: Uneori există o problemă de sincronizare, ceea ce înseamnă că elementul / pagina dvs. web nu este încă încărcat în timp ce scriptul îl căuta, prin urmare adăugați ceva timp de așteptare și retestați.
Pro Tip 3: Încercați să imprimați întregul DOM înainte de a căuta elementul web. În acest fel puteți afla căutând în Consolă dacă elementul dvs. web există sau nu în DOM.
Înainte de a ne adânci în privința XPath, un lucru important pe care vreau să-l împărtășesc este că, dacă aveți acces direct la echipa de dezvoltare sau dacă echipa dvs. se află acolo unde vă aflați, atunci cereți echipei de dezvoltare să vă ofere ID-uri unice în fiecare element web sau cel puțin cele pe care doriți să le utilizați pentru automatizare și acest lucru vă va economisi mult timp.
Dacă aceasta nu este posibilitatea, atunci este posibil să fie nevoie să vă folosiți creativitatea și să veniți cu propriile XPath-uri personalizate și care este ceea ce vom învăța acum.
Top 20 de moduri de a scrie XPath pentru orice element web
Să ne scufundăm profund în crearea celor mai bune 20 de moduri către un XPath ucigaș.
# 1) Căutare inversă
Să presupunem că doriți să faceți clic pe un buton și că există un buton similar. Ambele butoane au atribute id, dar sunt dinamice și niciunul dintre atribute nu este unic în ambele elemente ale butonului.
În scenariul de mai jos vrem să facem clic pe butonul „Setare” din „Test interactiv”.
Cod
Dacă vă uitați la butoanele „Setare”, ambele coduri sunt similare. Folosind moduri tradiționale precum id, nume, valoare, conține etc., niciuna dintre ele nu va funcționa, de exemplu.
// * (conține (text (), „Setare”)), Acest lucru va duce la două elemente web. Prin urmare, nu este unic.
Iată deci strategia finală,
>> Mai întâi, găsiți cea mai apropiată etichetă care este unică și, în acest caz, este
XPATH: “//*(@id='rcTEST')
>> În al doilea rând, Găsiți cel mai apropiat element web de elementul web dorit care conține în acest caz (text (), „TEST Interactive”). Acum suntem în același loc în care există butonul „Setare”, dar pentru a face clic pe el, trebuie mai întâi să mergem la principal folosind puncte duble așa cum se arată mai jos.
XPATH: “//*(@id='rcTEST')//*(contains(text(), 'TEST Interactive'))/..
>> După cum puteți vedea, suntem la nivelul care are al doilea element web ca butonul „Setare”. Acesta are două butoane și dorim să mergem la al doilea buton, care este butonul „Setare”. Adăugând „/ butonul (2)” la final putem obține XPATH-ul nostru unic pentru butonul „Setare”, așa cum se arată mai jos.
XPATH final:
“//*(@id='rcTEST')//*(contains(text(), 'TEST Interactive'))/../button(2)”
Iată o altă modalitate de a genera dacă credeți că ar putea schimba tipul elementului web de la „buton” la altceva.
“//*(@id='rcTEST')//*(contains(text(), 'TEST Interactive'))/..//*(contains(text(), 'Setting'))”
sau folosind „următorul-frate”
“//*(@id='rcTEST')//*(contains(text(), 'TEST Interactive'))/following-sibling::button”
# 2) Utilizarea variabilelor și a valorilor personalizate
Să presupunem că există o aplicație web care are funcția FTP („File Transfer Protocol”) pentru a încărca / descărca fișiere și că aveți un caz de testare pentru a descărca un anumit fișier dând clic pe linkul de descărcare.
În primul rând, putem defini numele fișierului pe care îl căutăm ca o variabilă.
String expectedfileName = „Test1”;
Acum folosind XPATH putem găsi numele fișierului real.
“String actualFileName = WebDriverAccess.getDriver().findElement (By.xpath('//*'+fileName +'/tr/td(1)')).getAttribute('title');”
În XPath de mai sus, ... ‘/ tr / td (1) .getAttribute („ title ”)’ va merge la rândul specific și la prima coloană și va obține valoarea atributului title. Putem stoca numele real al fișierului într-o altă variabilă.
Odată ce avem atât numele de fișiere așteptate, cât și cele reale, le putem compara pe ambele și, dacă ambele se potrivesc, putem face clic pe linkul de descărcare.
(if acutalFileName == expectedFileName) { WebDriverAccess.getDriver().findElement(By.xpath('//*'+fileName +'/tr/td(4)')).click(); }
De asemenea, putem crea o buclă prin fiecare rând și putem continua să verificăm numele fișierului până îl găsiți.
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++; }
Putem genera XPATH unic folosind etichete personalizate plus adăugăm alte condiții.
De exemplu, să presupunem că elementul nostru web intenționat există în eticheta principală și există mai multe etichete de adresă, dar doriți să găsiți doar una specifică. Toate etichetele de adresă au un atribut de clasă, astfel putem începe cu.
// address(@class='ng-scope ng-isolate-scope')
Am observat că elementul nostru web intenționat se află într-o etichetă care are un text numit „Testare”.
// address(@class='ng-scope ng-isolate-scope')//div(contains(.,'Testing')
Ne-am dat seama că sunt rezultate multiple elemente web. Prin urmare, pentru ao face mai unic, putem adăuga celelalte condiții, cum ar fi „id”, care ne vor indica în cele din urmă către elementul web pe care îl căutăm.
// address(@class='ng-scope ng-isolate-scope')//div(contains(.,Testing') and @id='msgTitle')
# 4) Utilizarea atributelor și a tabelului XPATH
Să presupunem că dorim să tastăm într-un element web care este plasat în interiorul unui tabel, iar tabelul este plasat într-un element de formular.
Putem găsi toate formularele din interiorul DOM cu numele „myForm”.
“//*(@name='myForm')”
Acum, în toate formularele, găsiți tabelul cu ID-ul ‘tbl_testdm’.
'//*(@name='myForm')//table(@id='tbl_ testdm’)”
În tabel mergeți la un anumit rând și coloană.
'//*(@name='myForm')//table(@id='tbl_ testdm’)/tbody/tr/td(6)/”
În interiorul celulei, dacă există mai multe intrări, găsiți o intrare unde value = „Open RFS”, iar acest lucru ne va oferi XPath-ul final al câmpului.
//*(@name='myForm')//table(@id='tbl_ testdm’)/tbody/tr/td(6)/ input(@value='Open RFS')'
# 5) Utilizarea atributelor, tabelelor și textului
Să presupunem că elementul web dorit se află în Tabelul panoului și că are un text comun.
Mai întâi începeți cu un panou care are un atribut unic care în acest caz este „TITLU”.
//*(@title=’Songs Lis Applet')
Navigați acum prin toate etichetele tabelului.
//*(@title=’Songs Lis Applet')//table
În toate tabelele găsiți coloana care are textul „Autor”.
XPath final ar fi ca:
//*(@title=’Songs List Applet')//table//td(contains(text(),'Author'))
# 6) Generarea XPATH folosind atribute imbricate
XPath-ul elementului web țintă poate fi generat, de asemenea, utilizând atributele imbricate. De exemplu, în acest caz, va căuta un atribut specific în DOM și apoi va căuta un alt atribut în cadrul acestuia.
//*(@id='parameters')//*(@id='testUpdateTime')')
# 7) Generarea XPath prin combinarea atributelor, divizărilor și butonului
De exemplu, în XPath de mai jos, am reușit să găsesc elementul web țintă folosind un id (XPath relativ), niște etichete div și un buton.
“//*(@id='MODEL/PLAN')/div(1)/div(2)/div(1)/div(1)/widget/section/div(1)/div/div(1)/div/div/button(1)'
# 8) Generarea XPATH folosind CONTAINS, INVERSARE CĂUTARE etc.
Odată am avut un meniu drop-down fără nicio identificare directă. A trebuit să folosesc CONTAINS, REVERSE, DIVs, atribute pentru a veni cu XPATH final așa cum se arată mai jos.
//*(contains(text(),'Watch Dial))/../div/select(@data-ng-model='context.questions (subqts.subHandleSubId)')'),
# 9) Generarea XPath folosind Relative, CONTAINS, INVERSE, URMĂTOARE SIBLING etc.
Am avut o situație în care aplicația afișează un grafic și fiecare valoare a graficului a trebuit validată. Dar, din păcate, fiecare valoare nu avea nicio identificare unică, așa că am venit cu XPATH-ul final așa cum se arată mai jos pentru o valoare a graficului care combină etichete relative, conține, inversă, următoare-frate și div.
//*(@id='RESEARCH/PLAN')//*(contains(@id, 'A4'))/../../following-sibling::div(1)/div(1)/span(1)/span(1)
# 10) Generarea XPath folosind atribute, conține, inversă, anterioară-frate, divizi și span
Odată ce a trebuit să valid diferite date de alarmă și fiecare valoare de alarmă a fost afișată pe baza unui anumit calcul sau temporizări. Pentru a capta fiecare valoare, a trebuit să vin cu XPATH-ul de mai jos care folosește atribute, conține, invers, frate precedent, divs și etichete span.
//*(@id='ALARMDATA')//*(contains(@id, 'AFC2'))/../../preceding-sibling::div(1)/div(1)/span(1)/span(1)
# 11) Utilizarea atributelor, etichetelor XML etc.
În XPATH, atribute și etichete XML de mai jos, se utilizează o secvență pentru a găsi adresa finală unică a unui element web.
//*(@id='RESEARCH/REVIEW') //widget/section/div(1)/div/div(2)/div(1)/div(3)/div(1)//span(@class='details')
# 12) Generarea XPath nu căutând în întreaga pagină, ci căutând în schimb toate linkurile și conține
XPath-ul de mai jos ar căuta numai link-uri într-o pagină întreagă care conțin textul ca „Parameter Data Manual Entry”.
//a(contains(.,'Parameter Data Manual Entry'))
# 13) Utilizarea conține și atribute
//*(contains(@style,'display: block; top:'))//input(@name='daterangepicker_end')
# 14) Utilizarea atributelor, urmărirea fraților și descendenților
//*(@id='dropdown-filter-serviceTools')/following-sibling::ul/descendant::a(text()='Notepad')
# 15) Utilizarea atributelor, urmărirea fraților, descendentului și textului
//*(@id='dropdown-filter-service tools') /following-sibling::ul/descendant::a(text()='Trigger Dashboard')
# 16) Utilizarea antetului și a textului
Dacă elementul web este un antet cu un anumit text, atunci XPath ar putea fi așa cum se arată mai jos:
//h3(text()='Internal Debrief')
# 17) Utilizarea textului antetului, urmărirea fraților, calea etc.
//h3(contains(text(),'Helium Level'))/following-sibling::div/label/input
# 18) Utilizarea atributelor, conține și frați anteriori
Odată ce am avut un interval care nu avea niciun atribut unic, am creat XPATH combinând absolut, conține, frați anteriori și o altă cale absolută.
//div(div(p(contains(text(),'Status'))))/preceding-sibling::div/div/span(3)/span
# 19) Căutați o listă derulantă utilizând atributul de identificare, un text specific și căutarea inversă
//*(@id='COUPLING')//*(contains(text(),'COUPLE Trend'))/../div/select
# 20) Combinarea atributului „id” și căutarea unui link cu text specific
//*(@id='ffaHeaderDropdown')//a(contains(text(),'Start Workflow'))
Concluzie
Când vine vorba de scrierea unui killer XPATH, depinde într-adevăr de cât de bine înțelegeți și analizați codul. Cu cât înțelegeți mai mult codul, cu atât va fi mai mult numărul de moduri pe care le veți găsi în scrierea XPATH-urilor eficiente.
Primul pas în scrierea XPath este să găsiți cel mai apropiat element web unic de elementul dvs. web țintă și să vă apropiați în continuare folosind diferite tehnici discutate mai sus, cum ar fi atributele, DIV-urile, următoarele, conține etc.
În cele din urmă, am spune din nou că vă va ușura viața dacă solicitați echipei dvs. de dezvoltare să adauge coduri unice în toate elementele web care vă interesează.
diferența dintre planul de testare și strategia de testare
Ori de câte ori începe un ciclu de sprint sau lucrează la o nouă cerință și echipa este împărtășită cu noi machete, trec mereu prin toate machetele și mă gândesc la potențialele cazuri de testare a automatizării în mintea mea, pregătesc o listă cu toate elementele web potențiale care vor fi utilizate în teste de automatizare și pregătesc propriile mele id-uri.
Odată ce o listă cu toate elementele web împreună cu ID-urile mele sugerate este completată, aș distribui-o în prealabil dezvoltatorului pentru a fi folosită în codul de dezvoltare. În acest fel, aș obține întotdeauna ID-uri unice, facilitând bătălia mea de scriere XPATH.
Mai jos este o listă combinată a diferitelor moduri de a scrie XPATH-uri:
- „// * (@ id =’ rcTEST ’) // * (conține (text (),‘ TEST Interactive ’)) /../ butonul (2)”
- „// * (@ id =’ rcTEST ’) // * (contains (text (),‘ TEST Interactive ’)) /..//* (contains (text (),‘ Setting ’))”
- „// * (@ id =’ rcTEST ’) // * (conține (text (),‘ TEST Interactive ’)) / following-sibling :: button”
- „String actualFileName = WebDriverAccess.getDriver (). FindElement (By.xpath („ // * ”+ FileName +” / tr / td (1) ”)). GetAttribute („ title ”);”
- WebDriverAccess.getDriver (). FindElement (By.xpath („// *” + FileName + ”/ tr / td (4)”)). Click ();
- '// adresa (@ class = 'ng-scope ng-isolate-scope') // div (conține (., Testare ') și @ id =' msgTitle ')'
- „// * (@ name =‘ myForm ’) // table (@ id =’ tbl_ testdm ’) / tbody / tr / td (6) /
- input (@ value = ’Open RFS’) ”
- „// * (@ title =’ Applet Listă melodii ’) // tabel // td (conține (text (),‘ Autor ’))”
- „// * (@ id =’ parametri ’) // * (@ id =’ testUpdateTime ’)”) ”
- „// * (@ id = 'MODEL / PLAN') / div (1) / div (2) / div (1) / div (1) / widget / section / div (1) / div / div (1) / div / div / butonul (1) ”
- „// * (conține (text (),„ Urmăriți cadranul)) /../ div / selectați (@ data-ng-model = ’context.questions (subqts.subHandleSubId)’) ”),”
- „// * (@ id = 'CERCETARE / PLAN') // * (conține (@id, 'A4')) /../../ following-sibling :: div (1) / div (1) / span (1) / span (1) ”
- „// * (@ id = 'ALARMDATA') // * (conține (@id, 'AFC2')) /../../ preceding-sibling :: div (1) / div (1) / span ( 1) / span (1) ”
- „// * (@ id = 'CERCETARE / REVizuire') // widget / secțiune / div (1) / div / div (2) / div (1) / div (3) / div (1) // span ( @ class = 'details') ”
- „//A(contains(.,’Parameter Data Manual Introduction’)) ”
- „// * (conține (@ stil,’ display: block; top: ’)) // input (@ name =’ daterangepicker_end ’)”
- „// * (@ id =’ dropdown-filter-serviceTools ’) / following-sibling :: ul / descendant :: a (text () =’ Notepad ’)”
- „// * (@ id =’ dropdown-filter-serviceTools ’) / following-sibling :: ul / descendant :: a (text () =‘ Trigger Dashboard ’)”
- „// h3 (text () = 'Debrief intern’) ”
- „// h3 (conține (text (),„ Helium Level ”)) / following-sibling :: div / label / input”
- „// div (div (p (contains (text (),‘ Status ’)))) / preceding-sibling :: div / div / span (3) / span”
- „// * (@ id =’ COUPLING ’) // * (contains (text (),‘ COUPLE Trend ’)) /../ div / select”
- „// * (@ id =’ ffaHeaderDropdown ’) // a (contains (text (),‘ Start Workflow ’))”
Sper că acest articol informativ v-ar fi îmbogățit cunoștințele despre scrierea XPaths.
Autor autor: Acest articol este scris de Adnan Arif, un IT profesionist care are experiență și abilități diverse în cariera sa de peste 9 ani.
Lectură recomandată
- Tutoriale detaliate pentru eclipsă pentru începători
- Tutorial Python DateTime cu exemple
- Sintaxa de comandă Unix Cat, Opțiuni cu exemple
- Comanda de sortare Unix cu sintaxă, opțiuni și exemple
- Tutorial Unix Shell Scripting cu exemple
- Tutorial Selenium Find Element By Text cu exemple
- Tutorial de funcții principale Python cu exemple practice
- Post-procesor Xpath Extractor în JMeter