Selecting a date from Datepicker using Selenium WebDriver

Calendars look pretty and of course they are fancy too.So now a days most of the websites are using advanced jQuery Datepickers instead of displaying individual dropdowns for month,day,year. :P

If we look at the Datepicker, it is just a like a table with set of rows and columns.To select a date ,we just have to navigate to the cell where our desired date is present.

Here is a sample code on how to pick a 13th date from the next month.

import java.util.List;
import java.util.List;
import java.util.concurrent.TimeUnit;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.testng.annotations.BeforeTest;
import org.testng.annotations.Test;;

public class DatePicker {

 WebDriver driver;
 
 @BeforeTest
 public void start(){
 System.setProperty("webdriver.firefox.bin", "C:\\Program Files (x86)\\Mozilla Firefox\\firefox.exe");  
 driver = new FirefoxDriver();
 }
 
 @Test
 public void Test(){
 
  driver.get("http://jqueryui.com/datepicker/");
  driver.switchTo().frame(0);
  driver.manage().timeouts().implicitlyWait(60, TimeUnit.SECONDS);
  //Click on textbox so that datepicker will come
  driver.findElement(By.id("datepicker")).click();
  driver.manage().timeouts().implicitlyWait(60, TimeUnit.SECONDS);
  //Click on next so that we will be in next month
  driver.findElement(By.xpath(".//*[@id='ui-datepicker-div']/div/a[2]/span")).click();
  
  /*DatePicker is a table.So navigate to each cell 
   * If a particular cell matches value 13 then select it
   */
  WebElement dateWidget = driver.findElement(By.id("ui-datepicker-div"));
  List rows=dateWidget.findElements(By.tagName("tr"));
  List columns=dateWidget.findElements(By.tagName("td"));
  
  for (WebElement cell: columns){
   //Select 13th Date 
   if (cell.getText().equals("13")){
   cell.findElement(By.linkText("13")).click();
   break;
   }
  } 
 }
}