How to select date from calendar using selenium webdriver

Question

I am newbie to Selenium webdriver . I am using Java programming language.

My problem is i am not able to call calendar element and select the date inside it.

Here is the link:

https://www.veltra.com/en/asia/malaysia/kuala_lumpur/a/139387

Any help is much appreciated.

List<WebElement> allDates=driver.findElements(By.xpath("//table[@class='ui-datepicker-calendar']//td"));

        for(WebElement selectDate:allDates)
        {       
            String date=selectDate.getText();

            if(date.equalsIgnoreCase("31"))
            {
                selectDate.click();
                break;
            }

        }

What I planned is, after I click "Book Now" button, I want to select 31st July in the calendar. The date will then display in the text box.

Answer 1

The text of the active dates is no just the day, it also contain the price. For example for July 31 the text is 31\\nUSD 266.67 .

You can either use startsWith()

if (date.startsWith("31")) {
    selectDate.click();
    break;
}

Or use locator that points to the date itself

By.xpath("//table[@class='ui-datepicker-calendar']//td//span")

Answer 2

To select the date 31 from the calander for the first item you need to induce WebDriverWait for the elementToBeClickable() and you can use the following Locator Strategies :

• Code Block:

   WebDriver driver = new ChromeDriver(options); driver.get("https://www.veltra.com/en/asia/malaysia/kuala_lumpur/a/139387"); new WebDriverWait(driver, 20).until(ExpectedConditions.elementToBeClickable(By.xpath("//div[@class='hltitle clearfix fclear price_note_wrapper']//following::a[2]"))).click(); new WebDriverWait(driver, 20).until(ExpectedConditions.elementToBeClickable(By.xpath("//div[@class='hltitle clearfix fclear price_note_wrapper']//following::a[starts-with(@id, 'book_now_btn_')][1]//following::table[1]//input[starts-with(@name, 'data')]"))).click(); new WebDriverWait(driver, 20).until(ExpectedConditions.elementToBeClickable(By.xpath("//table[@class='ui-datepicker-calendar']//span[text()='31']"))).click();

• Browser Snapshot: