java - Xpath 选择器不适用于(大概)Ajax 控制

Question

我正在尝试在 this 上选择 2 个地点之间的航类旅游网站。

我可以选择来源(LEAVING FROM 字段)，但目的地(GOING TO 字段)输入字段存在问题。

代码如下:

public class CathaypacificFlightSearch {
    static WebDriver driver=null;
    public static void main(String[] args) throws InterruptedException {
        System.setProperty("webdriver.gecko.driver", "D:\\bala back up\\personel\\selenium\\Jars\\Drivers\\geckodriver.exe");
        driver=new FirefoxDriver();
        driver.manage().window().maximize();
        driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);
        driver.get("https://www.cathaypacific.com/cx/en_IN.html");


        WebElement leavingFrom=driver.findElement(By.xpath("//*[@id='depart-label']"));
        leavingFrom.click();
        leavingFrom.sendKeys("Bengaluru"); // Entering the starting point

        WebElement cityList=driver.findElement(By.xpath("//*[contains(@id,'ui-id')]//a"));
        System.out.println(cityList.getText());
        cityList.click();  // Selecting the required option

        WebElement goingTo=driver.findElement(By.xpath("//*[@id='destination-label']"));
        goingTo.click();
        goingTo.sendKeys("Singapore");  //Entering the Destination point 

        WebElement gCityList=driver.findElement(By.xpath("//*[contains(@id,'ui-id')]//a")); //THIS IS WHERE XPATH IS NOT WORKING 
        System.out.println(gCityList.getText()); 
        gCityList.click();
}}

我还尝试使用下面的xpath和cssSelector，但没有运气。

 //WebElement gCityList=driver.findElement(By.cssSelector("li[id*='ui-id'] a"));
 //WebElement gCityList=driver.findElement(By.xpath("//ul[contains(@id,'ui-id')]//li//a"));

仅供引用，类似的 XPath 适用于源字段。只是在选择目的地城市时遇到问题。

Answer 1

好吧，我已将您的测试用例加载到我的自动化工具中，并且我已经看到了您的问题。你的逻辑很好，但你的选择者策略却导致了你的失败。

您正在使用"//*[contains(@id,'ui-id')]//a" XPath 选择器针对每个 <input> 的建议的城市选项字段值(离开/前往)。

它正在为cityList工作，但失败 gCityList 。这是因为您的选择器将匹配这两个建议(即使您的 cityList 现在已隐藏)。您可能已经知道，在 Selenium 中，如果您的选择器匹配多个 WebElements ，它将单击第一个，在您的情况下，单击 <li> <a>出发(出发)建议选项。

可能的修复:

• 1.) 让您的城市建议选择器更加具体(我使用了 CSS 选择器):

  // for 'Departure'
  WebElement cityList=driver.findElement(By.cssSelector("div.flight-depart li[id*='ui-id'] a"));
  System.out.println(cityList.getText());
  cityList.click();  // Selecting the required option
  
  // for 'Destiation'
  WebElement gCityList=driver.findElement(By.cssSelector("div.flight-destination li[id*='ui-id'] a")); 
  System.out.println(gCityList.getText()); 
  gCityList.click();
  

• 2.) 利用.sendKeys()方法:

  WebElement leavingFrom=driver.findElement(By.xpath("//*[@id='depart-label']"));
  leavingFrom.click();
  leavingFrom.sendKeys("Bengaluru"); // Entering the starting point
  
  // Now we are performing a TAB, or Enter to auto-complete the departure
  leavingFrom.sendKeys(Keys.TAB) //, or leavingFrom.sendKeys(Keys.ENTER)
  
  WebElement goingTo=driver.findElement(By.xpath("//*[@id='destination-label']"));
  goingTo.click();
  goingTo.sendKeys("Singapore");  //Entering the Destination point
  
  // Now we are performing a 'Tab', or 'Enter' to auto-complete the destination
  goingTo.sendKeys(Keys.TAB) //, or goingTo.sendKeys(Keys.ENTER)
  

注意:此方法 (2.) 仅在您将值插入 Departure/< 时才有意义目的地字段是唯一的(仅返回一个城市)，否则它将自动完成第一个 city在列表中。

注2:就我个人而言，我总是会选择 .sendKeys()方法，因为它比单击动态 ID WebElements 更安全。填充在容器中，例如下拉列表。然而，如果您想坚持使用方法 1.，那么您应该添加一些 Explicit Waits 到您的.click() s。

如果这对您有帮助，请告诉我。干杯!