Selenium Webdriver/Java: handling calendar

Question

I am new to Selenium. I am trying to handle a website calendar.

When I run the code displayed below, it returns "date did not match" ( else branch). When I use the contains function instead of equalsignorecase , it is selecting 12 th date instead of 31 .

The website which I'm trying to automatically test is https://www.dineout.co.in/delhi/boa-village-civil-lines-north-delhi-21335 . Can anyone help?

---

public void logged_in_user_booking() throws InterruptedException
{
    calender.click();
    Thread.sleep(4000);
    List<WebElement> dates= driver.findElements(By.cssSelector(".days"));

    System.out.println(dates);
    for(int i=0; i<dates.size(); i++)
    {
        datee = dates.get(i).getText();
        if(datee.equalsIgnoreCase("31"))
        {

            dates.get(i).click();
            break;
        }
        else
        {
            System.out.println("date did not match");
        }       
    }   
}

Answer 1

OK, so we agreed that the EASY/QUICK FIX was to get the entire list of <li> date WebElement s (eg: days): List<WebElement> dates= driver.findElements(By.cssSelector("ul.days li")); .

Yet, this is not the best solution to your problem. Learning Selenium is a enjoyable experience, especially if done properly. Most of the challenge comes from understanding why , how and when to choose a specific type of selector.

Problem: Select the last date from the calendar widget.

Your solution: Looping through the days WebElements of calendar and looking for the one which contains the last day (eg: 31 ).

Optimal solution: Using an xpath-selector which is better suited for this scenario as it removes the need to iterate through your entire list of monthly days.

Thus, our xpath-selector should be: //ul[contains(@class, "days")]/li/span[text() = 31] . See bellow a step-by-step breakdown of how I came to that result using the browser console:

Your code now should look like this:

public void logged_in_user_booking() throws InterruptedException
{
    calender.click();
    Thread.sleep(4000);
    List<WebElement> lastDay= driver.findElements(By.xpath("//ul[contains(@class, "days")]/li/span[text() = 31]"));

    lastDay.click();
}

Looks better, right?! :)

Next steps: Now that you know how to target a specific element based on text using xpath, you can fine-tune your program to check for the exceptions: 28 , 30 , etc.

Hope it helped you. Cheers!

Answer 2

Since you are learning Selenium, I would suggest a few things:

1. When you write code that will likely be reused, write a function. Picking a day on a site like this is something that you will likely use over and over. Think about what actions are likely to be repeated on the page and write functions for each. In this simple case, I would take in a day as a String and click the corresponding day.

    public static void setDay(String day) { driver.findElement(By.id("calendar")).click(); By dayLocator = By.xpath("//ul[@class='days']/li/span[.='" + day + "']"); new WebDriverWait(driver, 3).until(ExpectedConditions.visibilityOfElementLocated(dayLocator)).click(); } 

   Call it like

    driver.get("https://www.dineout.co.in/delhi/boa-village-civil-lines-north-delhi-21335"); setDay("31"); 

2. Don't use Thread.Sleep() . I won't go into all the details since you will find plenty of reasons by doing some googling but it's a bad practice. Use an explicit wait, WebDriverWait , instead. Look in ExpectedConditions and see all the different built-in things you can wait for and use it whenever needed. Sometimes you will have to be clever on what you wait for but there's almost always something.

3. Learn CSS selectors and XPath. They are both very powerful... but prefer CSS selectors because they are faster and better supported. XPath is good primarily for finding an element based on contained text since CSS selectors cannot.

   CSS Selectors reference

   CSS Selectors tips

   Advanced CSS Selectors

For bonus points... rewrite the function to:

1. take a Date parameter
2. pull out the day, month, and year
3. and select the correct date

It should be able to select a month from a different year/month.