CODEWITHSUNDEEP
javascripteclipseseleniumwebdriver
vishal gupta
vishal gupta

Reputation: 55

Selecting calendar date from JavaScriptExecutor in selenium

I am trying to select calendar date from JavaScriptExecutor in selenium but the date is not getting selected nor console is giving any error for that. I am not able to understand the reason behind this. Can anyone please help. Below is the selenium code that I have written.

package SeleniumSessions;

import java.util.concurrent.TimeUnit;

import org.openqa.selenium.By;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;

public class SelectCalendarByJS {

    public static void main(String[] args) {


        System.setProperty("webdriver.chrome.driver","F:\\Drivers\\chromedriver_win32\\chromedriver.exe");
        WebDriver driver = new ChromeDriver();

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

        driver.manage().timeouts().pageLoadTimeout(40, TimeUnit.SECONDS);
        driver.manage().timeouts().implicitlyWait(30, TimeUnit.SECONDS);

        driver.get("https://www.makemytrip.com/");

        //WebElement date = driver.findElement(By.xpath("//div[@class = 'fsw_inputBox dates inactiveWidget ']"));

        WebElement date = driver.findElement(By.xpath("//input[@id = 'departure']"));

        String dateVal = "Friday, 19 Jun 2020";

        selectDateByJS(driver, date, dateVal);

        //driver.quit();

    }

    public static void selectDateByJS(WebDriver driver , WebElement element , String dateVal) {
        JavascriptExecutor js = ((JavascriptExecutor)driver);
        js.executeScript("arguments[0].setAttribute('value','"+dateVal+"');", element);

    }
}

And below is the HTML DOM for the attribute I am selecting.

<input data-cy="departure" id="departure" type="text" class="fsw_inputField font20" readonly="" value="Friday, 19 Jun 2020">

Upvotes: 0

Views: 1605

Answers (1)

UnknownBeast
UnknownBeast

Reputation: 979

The problem with makemytrip departure date picker element is you can't send the keys to it. Your code could work for the Expedia application where you can change the value attribute of the text field and that will work. But in the case of makemytrip you will have to click on the element and then you will have to click on the date as shown in the below code. If you will see selection of date is happening in one element and it is displaying the selected date in the other element( if you will see the P tag then you will realize that it is displaying the selected date in the P tag and not in the same element).

  @Test
    public void test() throws InterruptedException {
         driver.manage().window().maximize();
         driver.manage().deleteAllCookies();

         driver.manage().timeouts().pageLoadTimeout(40, TimeUnit.SECONDS);
         driver.manage().timeouts().implicitlyWait(30, TimeUnit.SECONDS);
         WebElement date = driver.findElement(By.xpath("//*[@id=\"root\"]/div/div[2]/div/div/div[2]/div[1]/div[3]"));

         date.click();

        // System.out.println(driver.findElement(By.xpath()));

         Thread.sleep(3000);
         String dateVal = "Tue Jun 16 2020";
        selectDateByJS(driver, dateVal);

        Thread.sleep(3000);
    }

    public static void selectDateByJS(WebDriver driver, String dateVal) {

        JavascriptExecutor js = ((JavascriptExecutor)driver);
        js.executeScript("arguments[0].click();", driver.findElement(By.xpath("//div[@class='DayPicker-Day' and @aria-label='"+dateVal+ "']")));

    }

Upvotes: 1

Related Questions