Automation

Selenium WebDriver tutorial Step by Step

You are here: Home / Advance Selenium / How to handle calendar in Selenium Webdriver and web table

How to handle calendar in Selenium Webdriver and web table

by 45 Comments

JQuery Calendar

In my recent projects, I have handled a web table and calendar multiple times and in this article, I will show you how you can handle the calendar in Selenium Webdriver using the table approach.

I will use JQuery Date picker for example but you can take any example because the approach will remain the same. I will be using findElements methods to find all the dates and then will get the text and will click on the respective date.

The below image is an example of a Date picker which is a JQuery widget

JQuery Calendar

I have uploaded video handle calendar in Selenium Webdriver

 

 

 

 

 

Approach to handle calendar

Step 1- Click on calendar

Step 2- Get all td of tables using findElements method

Step 3- using for loop get the text of all elements

Step 4- using if else condition we will check the specific date

Step 5- If the date is matched then click and break the loop.

 

Program to handle calendar in Selenium Webdriver

package Blog;

import java.util.List;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.firefox.FirefoxDriver;

public class CalendarHandling {

	public static void main(String[] args) 
	{
		// Set the driver path
		System.setProperty("webdriver.firefox.marionette","G:\\Selenium\\Firefox driver\\geckodriver.exe");
		
                // start firefox
		WebDriver driver=new FirefoxDriver();

                // start application
		driver.get("http://seleniumpractise.blogspot.com/2016/08/how-to-handle-calendar-in-selenium.html");
		
                // click on date picker so that we can get the calendar in view 
		driver.findElement(By.id("datepicker")).click();
			
                // this will find all matching nodes in calendar		
		List<WebElement> allDates=driver.findElements(By.xpath("//table[@class='ui-datepicker-calendar']//td"));
		
                // now we will iterate all values and will capture the text. We will select when date is 28
		for(WebElement ele:allDates)
		{
			
			String date=ele.getText();
			
                        // once date is 28 then click and break
			if(date.equalsIgnoreCase("28"))
			{
				ele.click();
				break;
			}
			
		}
		
		
	}

}

 

There can be different approaches as well to handle calendar controls.

Approach 2- You can find the dates using XPath or CSSSelector and click on the dates directly.

import java.util.List;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.firefox.FirefoxDriver;

public class CalendarHandling {

public static void main(String[] args)
{
// Set the driver path
System.setProperty("webdriver.firefox.marionette","G:\\Selenium\\Firefox driver\\geckodriver.exe");

// start firefox
WebDriver driver=new FirefoxDriver();

// start application
driver.get("http://seleniumpractise.blogspot.com/2016/08/how-to-handle-calendar-in-selenium.html");

// click on date picker so that we can get the calendar in view
driver.findElement(By.id("datepicker")).click();

// this will find all matching nodes in calendar
List<WebElement> allDates=driver.findElements(By.xpath("//table[@class='ui-datepicker-calendar']//td"));

// Click on date 28 or any other date of your choice
driver.findElement(By.xpath("//a[text()='28']")).click();

}

}

Approach 3- You can also use JavaScriptExecutor which can set the date value directly in the date field. 

Hope you have enjoyed the article 🙂 Keep sharing and keep in touch.

Reader Interactions

Comments

  5. nayan kumar says

    Hi how can i check if login credential from excel sheet is looged in application or not ,in excel sheet suppose we have n no of userid and password.

    Reply

  6. Anvesh says

    Hi Mukesh, i am a plain fresher to selenium with Java knowledge.. i am learning selenium by using your blog and videos..
    i am trying to automate gmail registration, here in selecting birthday(Month), i know how to select a particular month.. but, my requirement is to display the names of all months on consol.. can you please help me how can i implement the same… thanks in advance.

    Reply

    • Mukesh Otwani says

      Hi Anvesh,

      In order to display all the month, first click on Month control then only all months will get visible. Now iterating through those div will give you months name. And this is not standard select control so here select won’t works.

      Reply

  7. Aarti says

    Hi,

    I have a case in which I have to always pick tomorrow’s date from the calendar, I have the calendar icon and can easily select the current date by the script. How to automate this case using selenium. I am using java with selenium for automation.

    Reply

  13. solai says

    Hi mukesh,

    I am not able open firefox browser using selenium code… it throws error.. what might be the proble??.. am using selenium 2.53.. initially it was working fine…

    Reply

  14. laksha says

    Hi Mukesh

    Pls help me to solve error in the below code in HANDLE CALENDAR CONCEPT

    in the below code it is not clicking and displaying date sep 30 in the returning date text box

    driver.manage().window().maximize();

    driver.get(“https://www.expedia.com/”);

    driver.findElement(By.id(“package-departing”)).click();
    Thread.sleep(3000l);
    List dates=driver.findElements(By.xpath(“//div[@class=’datepicker-cal’]”));

    for(WebElement ele:dates){
    String alldates=ele.getText();
    if(alldates.equalsIgnoreCase(“30”)){
    ele.click();
    break;
    }

    }

    Reply

    • Mukesh Otwani says

      Hi Laksha,

      Use below xpath .//*[@id=’hotel-checkin-wrapper’]/div/div/div[2]//td//button for all data and make below change

      old code
      String alldates=ele.getText();

      New code
      String alldates=ele.getAttribute(“innerHTML”);

      Reply

  15. Sukanya says

    Hi Vishal,
    Thanks for sharing. It surely helps. I was trying to automate a calendar control on “http://www.makemytrip.com”. The code snippet is as follows:
    List allDates = dr1.findElements(By.xpath(“//a[@class=’ui-state-default’]”));

    for (WebElement ele:allDates)
    {

    String current_date = ele.getText();
    System.out.println(current_date);
    if (current_date.equalsIgnoreCase(“16”))
    {
    ele.click();
    }
    }

    I am receiving “Element is no longer attached to the DOM ” at the “ele.click()” step. I am using SafariDriver for automation. Can you please advice.

    Thanks,
    Sukanya

    Reply

  16. Madhur says

    What if I wanted to select a specific date with a specific month and year?
    Will the month and year be handled as separate dropdown lists?

    Reply

  17. Manohar says

    hello Mukesh Otwani,
    Thank you for the tutorial(Handling Ca lender),But i question is You have written code for Date only.
    Can you explain code for Date-Month-Year(Ex-08-August-2017)

    Reply

  19. vishal Garg says

    Hi Mukesh,
    Hope you are doing good..

    I have one query just wanted to know which mozilla firefox version will be supported by webdriver version 2.47.0?

    I have Mozilla Version 45.0.0 it is not supported by webdriver 2.47.0. Please let me know if i have to go for lower version on Mozilla.

    Thanks &Regards
    Vishal Garg

    Reply

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.