Hur man klickar på bild i Selenium Webdriver
Krishna Rungta
⚡ Smart sammanfattning
Klicka på bilden i Selenium WebDriver kräver CSS-selektor eller XPath-strategier eftersom bildelement inte exponerar länktext. Den här artikeln förklarar hur man hittar bilden, utlöser klickåtgärden och verifierar att navigeringen lyckas.
Att klicka på en bild i Selenium WebDriver är en vanlig uppgift när en ikon, logotyp eller miniatyrbild fungerar som en navigeringslänk. Eftersom bilder inte har någon synlig text misslyckas traditionella länktextsökare och en mer pålitlig väljarstrategi krävs.
Åtkomst till bildlänkar
Bildlänkar är ankare på webbsidor som representeras av en bild som, när man klickar på den, navigerar webbläsaren till ett annat fönster eller en annan sida.
Eftersom de är bilder kan vi inte använda metoderna By.linkText() och By.partialLinkText() eftersom bildlänkar inte har någon länktext alls.
I det här fallet bör vi använda antingen By.cssSelector eller By.xpath. Den första metoden är generellt att föredra på grund av dess enkelhet och läsbarhet.
I exemplet nedan kommer vi åt "Facebook"-logotypen i den övre vänstra delen av Facebooks lösenordsåterställningssida.
.png)
Vi kommer att använda By.cssSelector och elementets attribut ”title” för att komma åt bildlänken. Vi kommer sedan att verifiera att webbläsaren har tagits till Facebooks startsida.
Java Code Exempelvis
Följande Selenium WebDriver-kodavsnittet startar Chrome, öppnar sidan för återställning av Facebooks lösenord, klickar på Facebook-logotypen och bekräftar den resulterande sidtiteln.
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
.png)
Bästa praxis för att klicka på bilder
Några vanor gör bildklickautomatisering mer tillförlitlig i alla webbläsare och skärmstorlekar.
- Föredra ett stabilt attribut som titel, alt, aria-label eller data-* framför djupt kapslade CSS-sökvägar.
- Lägg till en explicit WebDriverWait for ElementToBeClickable innan du utfärdar klicket.
- För bilder som laddas långsamt, skrolla elementet till vy med JavascriptExekutor först.
- Om ett transparent överlägg avlyssnar klicket, återgå till en JavaSkriptklick på det underliggande elementet.
- Validera navigeringen med driver.getTitle() eller ett unikt element på destinationssidan.
Hur AI förbättrar bildlokaliseringsstrategier
AI-assisterade testverktyg som till exempel Testim, Mabl och Healenium analyserar DOM:en runt en bild och föreslår självläkande positionerare. När ett klassnamn eller attribut ändras efter en utgåva byter ramverket automatiskt till det mest stabila alternativet, vilket minskar risken för ojämna fel vid ikonbaserad navigering.
Ingenjörer kan också använda ChatGPT eller GitHub Copilot för att generera WebDriver-kodavsnitt, föreslå robusta CSS- eller XPath-uttryck för en bild och utarbeta påståenden för sidan som laddas efter klicket. Genererad kod bör fortfarande granskas för korrekthet och för hantering av väntetider och överlagringar.
Slutsats
Klicka på bildlänkar i Selenium WebDriver är enkelt att använda när du väl valt en stabil locator. By.cssSelector med attributet title eller alt är den mest läsbara metoden, By.xpath är reservmetoden när markupen är obekväm, och explicita väntetider gör skriptet tillförlitligt över körningar.
