Selenium Java：无法从日期选择器中选择日期
[英]Selenium Java: Unable to Select Date from Date Picker
问题描述
I tried to select a date from custom date picker but it does not work. 
我试图从自定义日期选择器中选择一个日期，但是它不起作用。
The HTML is pasted as below along with the screenshot of how it looks. 如下粘贴HTML以及其外观的屏幕截图。
HTML: HTML：
<div id="ui-datepicker-div" class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all ui-datepicker-multi ui-datepicker-multi-3" style="position: absolute; top: 546px; left: 331px; z-index: 1; display: block; width: 51em;">
<div class="ui-datepicker-group ui-datepicker-group-first">
<div class="ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-left"><a class="ui-datepicker-prev ui-corner-all" data-handler="prev" data-event="click" title="Prev"><span class="ui-icon ui-icon-circle-triangle-w">Prev</span></a>
<div class="ui-datepicker-title">
<select class="ui-datepicker-month" data-handler="selectMonth" data-event="change">
<option value="0">Jan</option>
<option value="1" selected="selected">Feb</option>
<option value="2">Mar</option>
<option value="3">Apr</option>
</select> <span class="ui-datepicker-year">2019</span></div>
</div>
<table class="ui-datepicker-calendar">
<thead>
<tr>
<th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th>
<th><span title="Monday">Mo</span></th>
<th><span title="Tuesday">Tu</span></th>
<th><span title="Wednesday">We</span></th>
<th><span title="Thursday">Th</span></th>
<th><span title="Friday">Fr</span></th>
<th class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th>
</tr>
</thead>
<tbody>
<tr>
<td class=" ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">1</a></td>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">2</a></td>
</tr>
<tr>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">3</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">4</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">5</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">6</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">7</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">8</a></td>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">9</a></td>
</tr>
<tr>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">10</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">11</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">12</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">13</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">14</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">15</a></td>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">16</a></td>
</tr>
<tr>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">17</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">18</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">19</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">20</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">21</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">22</a></td>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">23</a></td>
</tr>
<tr>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">24</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">25</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">26</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">27</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="1" data-year="2019"><a class="ui-state-default" href="#">28</a></td>
<td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
</tr>
</tbody>
</table>
</div>
<div class="ui-datepicker-group ui-datepicker-group-middle">
<div class="ui-datepicker-header ui-widget-header ui-helper-clearfix">
<div class="ui-datepicker-title"><span class="ui-datepicker-month">March</span> <span class="ui-datepicker-year">2019</span></div>
</div>
<table class="ui-datepicker-calendar">
<thead>
<tr>
<th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th>
<th><span title="Monday">Mo</span></th>
<th><span title="Tuesday">Tu</span></th>
<th><span title="Wednesday">We</span></th>
<th><span title="Thursday">Th</span></th>
<th><span title="Friday">Fr</span></th>
<th class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th>
</tr>
</thead>
<tbody>
<tr>
<td class=" ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">1</a></td>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">2</a></td>
</tr>
<tr>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">3</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">4</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">5</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">6</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">7</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">8</a></td>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">9</a></td>
</tr>
<tr>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">10</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">11</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">12</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">13</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">14</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">15</a></td>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">16</a></td>
</tr>
<tr>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">17</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">18</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">19</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">20</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">21</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">22</a></td>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">23</a></td>
</tr>
<tr>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">24</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">25</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">26</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">27</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">28</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">29</a></td>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">30</a></td>
</tr>
<tr>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="2" data-year="2019"><a class="ui-state-default" href="#">31</a></td>
<td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
</tr>
</tbody>
</table>
</div>
<div class="ui-datepicker-group ui-datepicker-group-last">
<div class="ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-right"><a class="ui-datepicker-next ui-corner-all ui-state-disabled" title="Next"><span class="ui-icon ui-icon-circle-triangle-e">Next</span></a>
<div class="ui-datepicker-title"><span class="ui-datepicker-month">April</span> <span class="ui-datepicker-year">2019</span></div>
</div>
<table class="ui-datepicker-calendar">
<thead>
<tr>
<th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th>
<th><span title="Monday">Mo</span></th>
<th><span title="Tuesday">Tu</span></th>
<th><span title="Wednesday">We</span></th>
<th><span title="Thursday">Th</span></th>
<th><span title="Friday">Fr</span></th>
<th class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th>
</tr>
</thead>
<tbody>
<tr>
<td class=" ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-current-day" data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default ui-state-active" href="#">1</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default" href="#">2</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default" href="#">3</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default" href="#">4</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default" href="#">5</a></td>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default" href="#">6</a></td>
</tr>
<tr>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default" href="#">7</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default" href="#">8</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default" href="#">9</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default" href="#">10</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default" href="#">11</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default" href="#">12</a></td>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default" href="#">13</a></td>
</tr>
<tr>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default" href="#">14</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default" href="#">15</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default" href="#">16</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default" href="#">17</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default" href="#">18</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default" href="#">19</a></td>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default" href="#">20</a></td>
</tr>
<tr>
<td class=" ui-datepicker-week-end " data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default" href="#">21</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default" href="#">22</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default" href="#">23</a></td>
<td class=" " data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default" href="#">24</a></td>
<td class=" ui-datepicker-today" data-handler="selectDay" data-event="click" data-month="3" data-year="2019"><a class="ui-state-default ui-state-highlight" href="#">25</a></td>
<td class=" ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">26</span></td>
<td class=" ui-datepicker-week-end ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">27</span></td>
</tr>
<tr>
<td class=" ui-datepicker-week-end ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">28</span></td>
<td class=" ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">29</span></td>
<td class=" ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">30</span></td>
<td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
</tr>
<tr>
<td class=" ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
<td class=" ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"> </td>
</tr>
</tbody>
</table>
</div>
<div class="ui-datepicker-row-break"></div>
</div>
I had tried as 我曾经尝试过
WebElement dateWidget = driver.findElement(By.className("ui-state-default"));
List columns=(List) dateWidget.findElements(By.tagName("ui-state-default"));
for (WebElement cell: columns){
//Select 13th Date
if (cell.getText().equals("13")){
cell.findElement(By.linkText("13")).click();
break;
}
}
and even tried to wait command so that the locator is found but no success. 甚至试图等待命令，以便找到定位器但没有成功。
WebDriverWait(driver,100).until(ExpectedConditions.elementToBeClickable(By.cssSelector
both didn't work as it failed to recognize the element can someone help me with this. 两者都无法正常工作，因为它无法识别该元素，有人可以帮助我。 If possible can we even click the previous and next so that we can click some previous dates as well? 如果可能，我们甚至可以单击上一个和下一个，以便我们也可以单击一些以前的日期？
2 个解决方案
解决方案1
1 已采纳 2019-04-25 07:40:19
You did mistake using By.tagName("ui-state-default") , ui-state-default is a class not tag and your code below find nothing: 您使用By.tagName("ui-state-default")确实犯了错误， ui-state-default是一个没有标签的类，您的下面的代码什么也没找到：
WebElement dateWidget = driver.findElement(By.className("ui-state-default"));
List columns=(List) dateWidget.findElements(By.tagName("ui-state-default"));
Code below return a with text 13 in the first month: 下面的代码在第一个月返回带有文本13的 a ：
driver.findElement(By.xpath("//div[@id='ui-datepicker-div']//a[.='13']")).click();
You can select last month if the date picker using findElements : 如果日期选择器使用findElements则可以选择上个月：
List<WebElement> dates = driver.findElements(By.xpath("//div[@id='ui-datepicker-div']//a[.='13']"));
dates.get(2).click();
Also you can use data-month attribute: 您也可以使用data-month属性：
driver.findElement(By.xpath("//div[@id='ui-datepicker-div']//td[@data-month='3']/a[.='13']")).click();
解决方案2
0 2019-04-25 07:49:33
Using following xpath you can solve your problem easily without any hassle 使用以下xpath，您可以轻松解决问题，而无需任何麻烦
//table[@class='ui-datepicker-calendar']//td[@data-month='2']//a[.='15']
Here i have select month 2 and date 15 to select the date. 在这里，我选择2月和15号来选择日期。 You can change data-month to select another.You can make it dynamic also. 您可以更改数据月以选择另一个，也可以使其动态化。
I have tested this in chrome console and my automation script it working fine for me 我已经在chrome控制台和自动化脚本中对其进行了测试，对我来说效果很好
To verify paste following code in chrome console and hit inter> 要验证将以下代码粘贴到chrome控制台中，然后按以下命令
$x("//table[@class='ui-datepicker-calendar']//td[@data-month='2']//a[.='15']")
It will return the element of date 15 of second month. 它将返回第二个月的日期15的元素。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.
相关问题
Selenium Java日期选择器 - Selenium Java Date Picker
如何使用Selenium和Java从Bootstrap Glyphicon日期选择器中选择日期 - How to select the date from Bootstrap Glyphicon date picker using Selenium and Java
如何从日期选择器离子硒网驱动器中选择日期？ - How to select date from date picker ion selenium web driver?
日期选择器-Selenium WebDriver Java - Date Picker - selenium webdriver java
如何在 Selenium WebDriver 中选择日期选择器 - How to select the Date Picker In Selenium WebDriver
无法从日期选择器中选择日期 - not able to select date from date picker
如何从硒的日期选择器中选择今天的日期和时间（+15 分钟） - How to select today date & time(+15mins) from a date picker in selenium
如何从黄瓜Java中的日期选择器中选择值 - how to select values from date-picker in Cucumber-java
日期选择器的硒代码 - selenium code for date picker
如何从Selenium-java中的JavaScript弹出式日历中选择日期 - How to select a date from javascript popup calendar in selenium-java
相关标签