How to capture and assert the value populated via a datepicker using selenium

问题

I'm trying to test the date-picker to this site. and selected a date , which resulted in populating a text field with the selected date.

Now I wanted to validate, if the date selected is as expected. I was able to do up to selecting the date and populating the text field.

But when trying to validate the value, I'm getting back spaces from text field.

How can I capture the value populated by date-picker and assert the same ?

I have done to this below mentioned code, but it didn't help me.

driver.get(" https://www.jqueryui.com");
driver.findElement(By.linkText("Datepicker")).click();
WebElement element1 = driver.findElement(By.className("demo-frame"));
driver.switchTo().frame(element1);
driver.findElement(By.xpath(".//*[@id='datepicker']")).click();        
driver.findElement(By.xpath("//span[contains(text(),'Next')]")).click();
List<WebElement> element = driver.findElements(By.xpath(".//*[@id='ui-datepicker-div']/table/tbody/tr/td"));
int count = element.size();
for (int i = 0; i < count; i++) 
{
    String data = element.get(i).getText();
    if("2".equals(data))
    {
        element.get(i).click();
        break;
    }
}

driver.findElement(By.xpath(".//*[@id='datepicker']")).click();
WebElement element2 = driver.findElement(By.xpath(".//*[@id='datepicker']"));

String value = element2.getText();
Assert.assertEquals("04/02/2017",value);

My expectation is value will hold 04/02/2017, as 2 was selected. Apparently DOM is not updated. So, what should I be doing here to capture and assert the value selected ?

回答1:

Explanation: Use .getAttribute() to get the value of date selection and pass attribute as value For more details on this refer below code.

For Explanation refer below image also.

Try this below code, I have done this solution using array method.

driver.get("https://jqueryui.com/datepicker/");
driver.manage().window().maximize();
driver.manage().timeouts().implicitlyWait(15, TimeUnit.SECONDS);

WebElement iframe = driver.findElement(By.tagName("iframe"));        //Move inside iframe.
driver.switchTo().frame(iframe);
Thread.sleep(2000);

WebElement date_texbox = driver.findElement(By.id("datepicker"));    
date_texbox.click();                                             //Date-picker text-box element
Thread.sleep(2000);
WebElement date = driver.findElement(By.xpath("//a[@title='Next']/span"));  
date.click();                                                     //Move to the April Month 2017 from date picker.

int[] array_date = new int[]{1,2,3,4,5,6,7,8};   //Create int array for dates.

int k = 1;                                       //K refers to tr tag
int l = 7;                                       //l refers to td tag
for(int j=0;j<array_date.length;j++)
{
    if(l==8)
    {
        k++;
        l=1;        
    }

    if(k==2 & l==1)
    {
        System.out.println("Date = 04/02/2017");
        String second_april_2017 = driver.findElement(By.xpath("//table/tbody/tr[2]/td[1]/a")).getText();
        System.out.println(second_april_2017);  

        driver.findElement(By.xpath("//table/tbody/tr["+k+"]/td["+l+"]/a")).click();

        String get_date_value = driver.findElement(By.id("datepicker")).getAttribute("value");
        System.out.println("Date Selection Value = " +get_date_value);
        Assert.assertEquals("04/02/2017", get_date_value);                          //verify condition for this 04/02/2017 date.
    }

    System.out.println(k);
    System.out.println(l);

    if(!(k==2 & l==1))     //if date selection is 04/02/2017 then this condition will not execute.
    {
        driver.findElement(By.xpath("//table/tbody/tr["+k+"]/td["+l+"]/a")).click();     // pass array value of k and l to the xpath.
    }

    Thread.sleep(2500);
    date_texbox.click();
    Thread.sleep(2500);
    l++;
}

driver.switchTo().defaultContent();    //Move out side to the frame.

回答2:

Use JavascriptExecutor for getting value of selected date. Following piece of code should work in your case.

 WebElement element2 = driver.findElement(By.xpath(".//*[@id='datepicker']"));
 JavascriptExecutor jse = (JavascriptExecutor)driver;
 String date = (String) jse.executeScript("return arguments[0].value", element2);
 System.out.println("Date:- " + date);
 Assert.assertEquals("04/02/2017", date);

Thanks !

回答3:

Use driver.findElement(By.id("datepicker")).getAttribute("value");

Try something like this

        driver.get(" https://www.jqueryui.com");
        driver.findElement(By.linkText("Datepicker")).click();
        WebElement element1 = driver.findElement(By.className("demo-frame"));
        driver.switchTo().frame(element1);
        driver.findElement(By.xpath(".//*[@id='datepicker']")).click();
        driver.findElement(By.xpath("//span[contains(text(),'Next')]")).click();
        List<WebElement> element = driver.findElements(By.xpath(".//*[@id='ui-datepicker-div']/table/tbody/tr/td"));
        int count = element.size();
        for (int i = 0; i < count; i++) {
            String data = element.get(i).getText();
            if ("2".equals(data)) {
                element.get(i).click();
                break;
            }
        }

        String value=driver.findElement(By.id("datepicker")).getAttribute("value");
        System.out.println("value is" +value);
        Assert.assertEquals("04/02/2017", value);

来源：https://stackoverflow.com/questions/42570128/how-to-capture-and-assert-the-value-populated-via-a-datepicker-using-selenium

标签

jquery-ui

selenium-webdriver

datepicker