Mestring av XPath i Selenium: Hvordan finne elementer

Testingeniører er avgjørende i livssyklusen for programvareutvikling, da de sikrer at et team leverer feilfrie og fungerende applikasjoner. Disse ingeniørene tar applikasjonene gjennom forskjellige tester før de kan sendes eller erklæres klare for brukere.

Testere bør være dyktige og i stand til å lokalisere og samhandle med webelementer. Selenium er et av de mest brukte testautomatiseringsverktøyene av moderne utviklingsteam. Dette verktøyet har fire komponenter; Selenium Grid, Selenium WebDriver, Selenium IDE og Selenium RC.

Vårt fokus i dag vil være på Selenium WebDriver, siden den inneholder XPath. Denne artikkelen vil definere XPath, diskutere den grunnleggende XPath-syntaksen og illustrere hvordan du kan XPath i Selenium.

Hva er XPath

XPath (XML Path Language) er et spørringsspråk for å velge og navigere i attributter og elementer i XML-dokumenter. XPath definerer et baneuttrykk, og tilbyr en måte å adressere spesifikke deler av et XML-dokument og hente informasjon fra det.

Syntaksen ligner en filsystembane. Den har også funksjoner og symboler som gjør det enkelt å velge elementer basert på deres attributter og hierarki. Du kan bruke XPath med teknologier som XML, HTML og XSLT for å trekke ut og manipulere data.

Hvorfor bruke XPath?

  • Den er fleksibel: I motsetning til CSS-velgere som bare kan finne elementer ved å bruke tagnavn, ID eller klasse, lar XPath deg finne elementer ved å bruke andre attributter.
  • Gjenbrukbar: Du kan lagre XPathen din i variabler og gjenbruke dem i koden din.
  • Nøyaktig nodevalg: XPath gir en standardisert måte å målrette mot spesifikke elementer i et nettdokument.

Grunnleggende syntaks for XPath

XPath lar deg finne et hvilket som helst element på en nettside ved hjelp av DOM. Men før vi sjekker syntaksen, må vi forstå følgende XPath-uttrykk;

ExpressionDescriptionnodename/ tagnameVelger alle noder navnet «nodename’/ «tagname’/Velger fra rotnoden// Velger noder i gjeldende dokument fra gjeldende node som samsvarer med utvalget, uavhengig av hvor de er@Velger attributter..Velger overordnet til gjeldende node.Velger gjeldende node

  Hvordan endre språk i LoL

Standardsyntaksen for XPath er;

XPath=//tagname[@attribute="value"]

Som du kan se, starter syntaksen med en dobbel skråstrek (//), som starter med gjeldende node som definert av tag-/nodenavnet.

Absolutt XPath vs. relativ XPath

Vi har to veier når vi arbeider med XPath; Absolutt XPath og relativ XPath;

Absolutt XPath

En absolutt XPath er en direkte vei fra roten til ønsket element. Du starter med rotnoden og avslutter med målnoden.

Du kan ha et HTML-dokument med følgende innhold;

<!DOCTYPE html>
<html>
<head>
    <title>tipsbilk.net</title>
</head>
<body>
    <div>
        <h1>Welcome to tipsbilk.net</h1>
    </div>
</body>
</html>

Hvis vi ønsker å finne elementet med innholdet «Velkommen til tipsbilk.net», vil du følge denne stien;

/html/body/div/h1

I dokumentet ovenfor har vi;

  • HTML-en som rotnoden: /html
  • Brødteksten er en overordnet node: /html/body
  • Div-en som et barn av kroppsnoden: /html/body/div
  • H1 som underordnet div-noden: /html/body/div/h1

For å få det innerste elementet, må du følge den veien.

Når du skal bruke Absolute XPath

Absolutt XPath følger en «spesifikk» bane. Det vil derfor passe perfekt når du har flere elementer med lignende attributter på en side, og sikrer at du målretter mot de eksakte elementene i et dokument.

XPath er imidlertid overfølsom for endringer i HTML-dokumentets struktur. Som sådan kan en enkel endring ødelegge din Absolute XPath.

Relativ XPath

Relativ XPath starter fra en hvilken som helst node og slutter med målnoden. Denne banen påvirkes ikke av endringer i dokumentet, noe som gjør den å foretrekke i de fleste tilfeller. Med Relative XPath kan du finne elementer fra alle deler av dokumentet. Det relative XPath-uttrykket starter med doble skråstreker «//».

Hvis vi bruker HTML-dokumentet, kan vi finne vår H1 som sier «Velkommen til tipsbilk.net»;

<!DOCTYPE html>
<html>
<head>
    <title>tipsbilk.net</title>
</head>
<body>
    <div>
        <h1>Welcome to tipsbilk.net</h1>
    </div>
</body>
</html>

Vår relative XPath til h1 vil være;

//body/div/h1

Når skal du bruke Relative XPath

Du bør bruke Relative XPath når du ser etter en balanse mellom fleksibilitet og spesifisitet. Denne banen er motstandsdyktig mot endringer i HTML-dokumentet, gitt at forholdet mellom elementene forblir spesifikt.

Finn elementer ved hjelp av XPath i Selenium

Selenium er et åpen kildekode-rammeverk som lar brukere automatisere nettlesere. Rammeverket har en samling av biblioteker og verktøy som hjelper testere med å samhandle med webelementer automatisk og systematisk.

  Hvordan tilveiebringe et SIM-kort

Forutsatt at vi har et nettdokument som inneholder en liste over sanger som følger;

<!DOCTYPE html>
<html>
<head>
    <title>Song Library</title>
</head>
<body>
    <h1>Song Library</h1>
    <ul class="song-list">
        <li class="song" title="Song Title 1">Song 1 - Artist 1</li>
        <li class="song" title="Song Title 2">Song 2 - Artist 2</li>
        <li class="song" title="Song Title 3">Song 3 - Artist 1</li>
        <li class="song" title="Song Title 4">Song 4 - Artist 3</li>
    </ul>
</body>
</html>
  • Rotnoden vår er .
  • Vi har som vår overordnede node.
  • Vi har

    som barn av .

  • Vi har
      som barn av .
    • Vi har
    • som barn av
        .

      Vi kan bruke forskjellige XPath-lokaliser i HTML-dokumentet ovenfor. For eksempel kan vi finne elementer etter ID, navn, klassenavn, inneholder, tekster, slutter-med og starter-med, blant mange andre locatorer. Du kan bruke Selenium med forskjellige programmeringsspråk. Vi vil bruke Python til å demonstrere.

      Finn etter indeks

      Forutsatt at vi ønsker å finne sang nummer 3, kan vi ha denne koden;

      third_song = driver.find_element_by_xpath("//li[@class="song"][3]")
      print("Third Song:", third_song.text)
      

      Vi har brukt Relative XPath og starter med «li»-noden. Når Selenium finner den tredje sangen på listen vår, vil den skrive ut teksten.

      Finn etter attributt

      Vi kan ha en XPath som ser etter alle sangene fra «Artist 1» og skriver ut titlene deres. Koden vår kan være som følger;

      songs_by_artist1 = driver.find_elements_by_xpath("//li[contains(@class, 'song') and contains(text(), 'Artist 1')]")
      print("Songs by Artist 1:")
      for song in songs_by_artist1:
          print(song.text)
      

      Finn etter tekst

      Denne lokatoren hjelper deg med å finne elementer med spesifikk tekst. Vi kan se etter en sang med «Sang 4»-tekst og skrive ut teksten. Vi kan representere denne lokalisatoren ved å bruke denne koden;

      song_with_text = driver.find_element_by_xpath("//li[contains(text(), 'Song 4')]")
      print("Song with Text:", song_with_text.text)
      

      XPath-akser

      Tilnærmingene vi har diskutert så langt fungerer perfekt med enkle nettsider. Det er imidlertid tilfeller der XPath-elementsøkemetoder som etter tekst, ID, klassenavn og navn ikke vil fungere.

      XPath-akser brukes for dynamisk innhold der vanlige locatorer ikke fungerer. Her finner du elementer basert på deres forhold til andre elementer. Dette er noen av de vanlige XPath-aksene;

      Stamfar

      Ancestor Axis-metoden er perfekt for å håndtere XML-dokumenter med svært nestede elementer. Du kan velge alle stamfarelementer som besteforeldre og overordnede til gjeldende node fra den nærmeste til den lengste.

      Vi kan ha følgende kode;

      <bookstore>
        <book>
          <title>The Great Gatsby</title>
          <author>F. Scott Fitzgerald</author>
          <genre>Fiction</genre>
        </book>
        <book>
          <title>The Biggest Dilemma</title>
          <author>George Orwell</author>
          <genre>Dystopian</genre>
        </book>
      </bookstore>
      

      Hvis vi ønsker å velge alle forfedrene til elementet «tittel» for boken «The Biggest Dilemma», kan vi ha denne Ancestor Axis-metoden;

      //title[text() = '1984']/ancestor::*

      Følgende

      Følgende akse-metoden lokaliserer alle noder etter gjeldende nodes avsluttende tag. Denne metoden tar ikke hensyn til hierarkiet eller plasseringen av målnodene. Hvis du for eksempel har et XML-dokument eller en nettside med flere seksjoner, kan du identifisere et element som vises etter en bestemt seksjon uten å navigere i hele trestrukturen.

      Foreldre

      Parent Axis-metoden i XPath velger overordnet til gjeldende node. Du kan bruke følgende bane for å finne den overordnede noden;

      //tag[@attribute="value"]/parent::tagName

      Denne tilnærmingen fungerer når de underordnede elementene i gjeldende node har unike attributter som du enkelt kan finne, og du vil sjekke med den overordnede.

      Barn

      Child Axis-metoden i XPath velger alle underordnede av gjeldende node. Det er fortsatt en av de mest populære XPath Axis-metodene ettersom den hjelper til med å velge underordnede noder for et bestemt element.

      Tenk på denne kodebiten;

      <section id='text'>
          <p>Paragraph one</p>
          <p>Paragraph two</p>
          <p>Paragraph three</p>
          <p>Paragraph four</p>
      </section>

      Vi kan finne alle «p»-elementene i koden vår ved å bruke denne aksen;

      //section[@id='text']/child::p

      Vanlige spørsmål

      Hvorfor bruke XPath i stedet for CSS-velgere?

      CSS-velgere kan bare finne elementer basert på deres ID, kodenavn og klasse. På den annen side kan du bruke XPath til å finne elementer basert på deres plassering, tekstinnhold og andre attributter i HTML-strukturen. Du kan også lagre XPath-uttrykk i variabler og gjenbruke dem i applikasjonen din.

      Hvilke språk støtter XPath i Selenium?

      Du kan bruke XPath med alle språk som støtter Selenium. Du kan skrive skriptene dine i JavaScript, Java, Python, Ruby, C# og PHP.

      Hva er XPaths alternativer?

      Du kan bruke CSS-velgere, bildegjenkjenning eller Seleniums innebygde lokatorer som et alternativ til XPath. CSS-velgere er de vanligste; du kan finne elementer basert på tagnavn, ID eller klasse. Bildegjenkjenning lar deg finne elementer basert på bildene deres. Seleniums innebygde lokatorer er designet for å være enkle å bruke.

      Konklusjon

      Du kan nå definere XPath i Selenium, skille mellom Absolutt og Relativ XPath, og lokalisere elementer ved hjelp av forskjellige XPath-lokalisere. Valget av lokalisator vil avhenge av innholdets art og sluttmålene dine.

      Ta en titt på artikkelen vår om Selenium-intervjuspørsmål hvis du ønsker å bli det neste intervjuet ditt.