Drop-down doesn't select the value when visible

Question

When you select the family Room, you get 2 drop downs : 1.Asking number of adults 2.Asking number of child Once you select a number from 2nd dropdown, a 3rd dropdown gets visible. For that i use explicit wait, but still it doesn't get selected don't know why?

Website= https://www.trivago.in/?aDateRange[arr]=2018-06-16&aDateRange[dep]=2018-06-20&aPriceRange[to]=0&aPriceRange[from]=0&iPathId=84738&aGeoCode[lat]=10.850516&aGeoCode[lng]=76.27108&iGeoDistanceItem=0&aCategoryRange=0%2C1%2C2%2C3%2C4%2C5&aOverallLiking=1%2C2%2C3%2C4%2C5&sOrderBy=relevance%20desc&bTopDealsOnly=false&iRoomType=9&aRooms[0][adults]=2&aRooms[0][children][]=1&cpt=8473803&iIncludeAll=0&iViewType=0&bIsSeoPage=false&bIsSitemap=false&

  @Test
  public void familyRoomFeature() throws InterruptedException
  {
      //Selecting Family Room from the dropdown
      driver.findElement(By.xpath(".//*[@id='js-fullscreen-hero']/div/form/div[2]/div/div/ul/li               [3]/button")).click();
      Thread.sleep(7000);
      //Selecting Adult age & there is another dropdown where it asks how many kids a user would have
      Select adultSelect=new Select(driver.findElement(By.xpath(".//*[@id='select-num-adults-1']")));
      Select childSelect=new Select(driver.findElement(By.xpath(".//*[@id='select-num-children-1']")));     
      adultSelect.selectByIndex(2);
      childSelect.selectByIndex(1); 
          //So once you select Adult & child selection, another selection dropdown gets visible
      //I get an error here and it doesn't select the child's age inspite of explicit wait
      WebElement childAge =driver.findElement(By.id("select-ages-children-1-78"));
      WebElement childAgedrop = wait.until(ExpectedConditions.visibilityOf(childAge));
      Select childAgeFromSelect = new Select(childAgedrop);
      childAgeFromSelect.selectByIndex(3);
  }
}

Answer 1

The explicit wait is after the fact that you have already tried to find the child age element. Remove that line and the next one, and use the visibilityOfAllElementsLocatedBy(By locator) expected condition.

Also the id used in the locator is generated dynamically and will fail on next run. Use an xpath locator like this - "//select[starts-with(@id,'select-ages-children')]" which will return a list of child age webelements.

Answer 2

when dropdowns are dependent on each other, ie if options are populated in a dropdown only after a previous element is selected, following wait can be used.

new WebDriverWait(driver, 15).until(ExpectedConditions.numberOfElementsToBeMoreThan(By.xpath("//select[@id='select-ages-children-1-78']/option"), number))

The 'number' in the above code is variable. Some dropdowns show no text. In that case you can set it to 0. Where as some have just a '--Select--' option. In this case you can set it to 1.