Slik klikker du på bildet Selenium Webdriver

⚡ Smart oppsummering

Klikk på bildet i Selenium WebDriver krever CSS-selektor eller XPath-strategier fordi bildeelementer ikke eksponerer lenketekst. Denne artikkelen forklarer hvordan du finner bildet, utløser klikkhandlingen og bekrefter at navigasjonen lykkes.

  • 🖱️ Kjernehandling: Bruk driver.findElement(By.cssSelector(…)).click() for å klikke på et hvilket som helst bildeelement som gjengis i et anker.
  • 🎯 Valg av lokator: By.linkText og By.partialLinkText fungerer ikke for bilder, så By.cssSelector eller By.xpath er påkrevd.
  • 🧪 Verifiseringstrinn: Bekreft et vellykket klikk ved å hevde den nye sidetittelen med driver.getTitle() mot den forventede målstrengen.
  • 🤖 AI-hjelp: Moderne AI-pluginer foreslår stabile CSS-selektorer og automatiske reparasjonslokaliseringer når applikasjonsmarkup eller attributtverdier endres.
  • 🛠️ Vanlige fallgruver: Skjulte, sent lastede eller overlappende bilder krever ofte eksplisitte ventinger, rulling inn i visning eller JavaSkriptklikk for å registrere deg riktig.

Klikk på Bilde inn Selenium

Å klikke på et bilde i Selenium WebDriver er en vanlig oppgave når et ikon, en logo eller et miniatyrbilde oppfører seg som en navigasjonslenke. Fordi bilder ikke har synlig tekst, mislykkes tradisjonelle lenketekstsøkere, og en mer pålitelig selektorstrategi er nødvendig.

Få tilgang til bildelenker

Bildelenker er ankere på nettsider representert av et bilde som, når det klikkes på det, navigerer nettleseren til et annet vindu eller en annen side.

Fordi de er bilder, kan vi ikke bruke metodene By.linkText() og By.partialLinkText() fordi bildelenker ikke har noen lenketekst i det hele tatt.

I dette tilfellet bør vi ty til å bruke enten By.cssSelector eller By.xpath. Den første metoden er generelt foretrukket på grunn av dens enkelhet og lesbarhet.

I eksemplet nedenfor får vi tilgang til "Facebook"-logoen øverst til venstre på Facebooks passordgjenopprettingsside.

Få tilgang til bildelenker

Vi bruker By.cssSelector og elementets «title»-attributt for å få tilgang til bildelenken. Deretter bekrefter vi at nettleseren har blitt tatt til Facebooks hjemmeside.

Java Code Eksempel

Følgende Selenium WebDriver-kodebiten starter Chrome, åpner siden for gjenoppretting av Facebook-passord, klikker på Facebook-logobildet og bekrefter den resulterende sidetittelen.

package newproject;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;

public class MyClass {

    public static void main(String[] args) {
        String baseUrl = "https://www.facebook.com/login/identify?ctx=recover";
        System.setProperty("webdriver.chrome.driver", "G:\\chromedriver.exe");
        WebDriver driver = new ChromeDriver();

        driver.get(baseUrl);
        // click on the "Facebook" logo on the upper left portion
        driver.findElement(By.cssSelector("a[title=\"Go to Facebook home\"]")).click();

        // verify that we are now back on Facebook's homepage
        if (driver.getTitle().equals("Facebook - log in or sign up")) {
            System.out.println("We are back at Facebook's homepage");
        } else {
            System.out.println("We are NOT in Facebook's homepage");
        }
        driver.close();
    }
}

Resultat

Klikk på Bilde inn Selenium Webdriver

Beste fremgangsmåter for å klikke på bilder

Noen få vaner gjør automatisering av bildeklikk mer pålitelig på tvers av nettlesere og skjermstørrelser.

  • Foretrekk et stabilt attributt som title, alt, aria-label eller data-* fremfor dypt nestede CSS-stier.
  • Legg til en eksplisitt WebDriverWait for ElementToBeClickable før du utsteder klikket.
  • For bilder som lastes inn sent, bla elementet inn i visningen med JavascriptEksekutor først.
  • Hvis et gjennomsiktig overlegg avskjærer klikket, gå tilbake til en JavaSkriptklikk på det underliggende elementet.
  • Valider navigasjonen med driver.getTitle() eller et unikt element på målsiden.

Hvordan AI forbedrer strategier for bildelokalisering

AI-assisterte testverktøy som Testim, Mabl og Healenium analyserer DOM-en rundt et bilde og foreslår selvreparerende lokatorer. Når et klassenavn eller attributt endres etter en utgivelse, bytter rammeverket automatisk til det mest stabile alternativet, noe som reduserer ustabile feil på ikonbasert navigasjon.

Ingeniører kan også bruke ChatGPT eller GitHub Copilot til å generere WebDriver-kodebiter, foreslå robuste CSS- eller XPath-uttrykk for et bilde og utarbeide påstander for siden som lastes inn etter klikket. Generert kode bør fortsatt gjennomgås for korrekthet og for håndtering av ventinger og overlegg.

Konklusjon

Klikke på bildelenker i Selenium WebDriver er enkelt når du velger en stabil locator. By.cssSelector med title- eller alt-attributtet er den mest lesbare tilnærmingen, By.xpath er reserve når markupen er vanskelig, og eksplisitte ventetider gjør skriptet pålitelig på tvers av kjøringer.

Spørsmål og svar

Finn bildet med By.cssSelector eller By.xpath ved å bruke et stabilt attributt som title, alt eller aria-label, og kall deretter .click() på det returnerte WebElementet. Bekreft resultatet med driver.getTitle() eller et unikt element på målsiden.

Ja. Verktøy som Testim, Mabl og ChatGPT inspiserer den omkringliggende DOM-en og foreslår en stabil selektor basert på tittel, alt, aria-label eller dataattributter. Ingeniører bør fortsatt gjennomgå den genererte locatoren for unikhet og robusthet.

En selvreparerende lokator er en AI-funksjon som bytter inn en alternativ velger når originalen feiler. Rammeverk som Healenium og Mabl observerer attributtendringer rundt et bilde og velger den mest stabile erstatningen, noe som reduserer ustabile tester etter at brukergrensesnittet er oppdatert.

Begge locatorene samsvarer på den synlige teksten i et anker. En bildelenke pakker inn en img-tag og eksponerer ingen tekstnode, så treffet returnerer alltid ingenting. Bruk By.cssSelector eller By.xpath med title, alt eller aria-label i stedet.

Hvis et overlegg, en modal eller et verktøytips blokkerer bildet, blar du det inn i visningen med JavascriptUtfører og legg til en WebDriverWait for ElementToBeClickable. Som en reserve, utfør en JavaSkriptklikk på WebElement for å omgå overlappingenping lag.

Angi den nye sidetittelen med driver.getTitle(), den gjeldende URL med driver.getCurrentUrl(), eller tilstedeværelsen av et unikt element på destinasjonssiden. En kombinasjon av disse kontrollene gir testen sikkerhet for at klikket faktisk utløste navigasjon.

Oppsummer dette innlegget med: