无法在日期选择器中选择日期

Question

I'm testing a widget where I have to enter a start and end date using a calender. In real life use I select the option to enter dates from a drop down, a calender then appears where I have to click a start and an end date. Only after I click on 2 days the date fields are filled. I have no problems doing this manualy but automating the test is proofing difficult. Here's a few screenshots to illustrate what I'm trying to do. After selecting the option to enter dates the following screen appears:

Here I first click the From day (24), followed by the To day (31). Right after I click 31 the calender dissappears and the two date fields are filled with my selection:

I'm trying to automate this with the following code:

driver.findElement(By.xpath(".//span[@class='DateRangePicker__DateLabel'][contains(text(), '24')]")).click();
driver.findElement(By.xpath(".//span[@class='DateRangePicker__DateLabel'][contains(text(), '31')]")).click();

Here's part of the code I'm basing this on:

<span class="DateRangePicker__DateLabel" data-reactid=".0.1.1.0.1.1.1.0.0.2.0.1:$0-2016-4.1.1.$4.$1.2">24</span>

The code does not fail but the dates are not selected either.

Answer 1

使用日期选择器中的硒- LINK

Answer 2

You could inspect id of from and to field. THen execute this command using javascript

$('#id').datepicker("setDate", "date_you_want_in_right_format")

Note 1: You need to follow strictly date format that allowed by datePicker

Note 2: Tested with https://jqueryui.com/datepicker/

$('#datepicker').datepicker("setDate", "03/15/2016")