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")); Listrows=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; } } } }
Hi,
ReplyDeleteI am getting error at " " can u send full code @ srinivas30k@gmail.com
Remove the below lines at the end of code . They are just typo.
ReplyDeleteHi vamshi ,
ReplyDeletei am not able to select the date from the date picker , i tested this in firefox, i guess the problems is in the forloop, could you please have a look at it.
Thanks
Hi jack,
ReplyDeleteNow I have added wait after we click on "date picker edit box" . Now it is working fine. For loop code is fine.
Run the code and if it still fails please send your error console details.
Hi Vamshi ,is there a possible way to set the download path in chrome as i am automating a test case in which i have to download a file and then open it to verify it's contents.
ReplyDeleteAmit,
ReplyDeleteI couldn't find a way to do it programmatically. But manually if you set the download path in your default browser(one time) then the same will be carried forward to the browser that is going to be invoked by webdriver. So it will still works.
Hi Vamshi, i found a way to download the file to local directory and then view it on browser programmatically (applicable for notepad,html file and images,not for secure pdf and doc),can i post it in your site or do i send it to u ,others might get help from it. and thanks for the reply.
ReplyDeleteThanks Amit. Can you post it here :)
ReplyDeleteHope it Helps :)
ReplyDeleteCool :)
ReplyDeleteHi,
ReplyDeleteThe one which i am working is not an text box, its read only box, how do i automate?
Thanks in advance.
Even iQuery has readonly text box here.
ReplyDeletehttp://jqueryui.com/datepicker/
I hope above example code works for you .
Hi Vamshi
ReplyDeleteThe datepicker is displayed, but not selecting the date, i.e not entering the for loop.
Thanks
Babu
Can you send the console error message you are getting please ?
ReplyDeleteI tried and code is working fine for me.
One small note :
List rows=dateWidget.findElements(By.tagName("tr"));
List columns=dateWidget.findElements(By.tagName("td"));
should be
List rows=dateWidget.findElements(By.tagName("tr"));
List columns=dateWidget.findElements(By.tagName("td"));
I tried to change but the changes are not getting saved :)
Nice article...very useful
ReplyDeleteHi Friends
ReplyDeleteThis code works
Try following Link
http://bugreaper.blogspot.in/2013/09/selecting-date-from-calendarswebdriver.html
If u like the post pls comment and Join the site
very nice article...
ReplyDeletecan u tell me about Selecting a date from Bootstrap Datepicker in asp.net using Selenium WebDriver ???
I am struggling over this over from a week plz five solution
Thanks in advance...
Hi Sunil,
ReplyDeleteYou can the date using java script. Here is the sample script:
driver.get("http://dl.dropboxusercontent.com/u/143355/datepicker/datepicker.html");
driver.manage().timeouts().implicitlyWait(60, TimeUnit.SECONDS);
//Set the start date to "01/30/2013" using javascript
JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript("document.getElementsByClassName('small')[0].setAttribute('value', '01/30/2013')");
Code runs Perfect...! but not able to understand y u close web element tag ...?
ReplyDelete"rows" element is not required here.
ReplyDelete"" is also not required.I am using little buggy plugin :)
I am trying to delete it but couldn't , it is keep getting appended.
And y u close web element tag ...?
ReplyDeleteAbove statement is added by the plugin. I didnot add it. I tried to delete it but couldnot.