如何在动态完整日历中定位web元素

Question

我的Selenium设置是Java/Eclipse/TestNG，我的驱动程序是Chrome。

我想在我们的网页上的完整日历中找到一天，然后双击它，这反过来会打开一个单独的面板来创建当天的轮班。

我的问题是，当我使用xpath（使用Chrome的xpath Helper插件检索）在完整的日历中定位某一天，然后尝试双击它时，什么都不会发生。我在页面上的其他元素上尝试过xpath，它们都有效。我还在一个外部测试url上单独尝试了双击方法，它很有效。我有一个睡眠方法来确保页面加载。根据我的开发同事的说法，完整的日历是动态的。

所以问题一定是xpath无法在日历中找到特定的日期。有人知道如何绕过这个吗？xpath定位器有问题吗？这是我的代码：

@Test
public void Userstory1() {
    //Navigate to url and double-click on Monday on row 3 in calendar
    driver.navigate().to(”company/url”);
    try {
        Thread.sleep(3000);
    }
    catch(Exception e) {
    }
    WebElement element = driver.findElement
            (By.xpath("/html/body/div[@id='wrapper']/div[@id='main-container']/div[@id='single-column-row']/div"
                    + "[@id='main-content']/div[@id='schedule-container']/div[@id='js-company-schedule-wrapper']/div"
                    + "[@id='js-company-schedule-calendar']/div[@class='fc-view-container']/div[@class='fc-view fc-month-view fc-basic-view']"
                    + "/table/tbody[@class='fc-body']/tr/td[@class='fc-widget-content']/div[@class='fc-day-grid-container']/div"
                    + "[@class='fc-day-grid']/div[@class='fc-row fc-week fc-widget-content'][3]/div[@class='fc-content-skeleton']/table/tbody/tr/td[2]"));
    Actions action = new Actions(driver).doubleClick(element);
    action.build().perform();
}

日历部分的HTML代码（很抱歉格式不好，我不知道如何让它看起来更好）：

<div id="js-company-schedule-calendar" class="fc fc-ltr fc-unthemed"><div class="fc-view-container"><div class="fc-view fc-month-view fc-basic-view"><table><thead class="fc-head"><tr><td class="fc-widget-header"><div class="fc-row fc-widget-header"><table><thead><tr><th class="fc-week-number fc-widget-header" style="width: 18px;"><span>v.</span></th><th class="fc-day-header fc-widget-header fc-mon">måndag</th><th class="fc-day-header fc-widget-header fc-tue">tisdag</th><th class="fc-day-header fc-widget-header fc-wed">onsdag</th><th class="fc-day-header fc-widget-header fc-thu">torsdag</th><th class="fc-day-header fc-widget-header fc-fri">fredag</th><th class="fc-day-header fc-widget-header fc-sat">lördag</th><th class="fc-day-header fc-widget-header fc-sun">söndag</th></tr></thead></table></div></td></tr></thead><tbody class="fc-body"><tr><td class="fc-widget-content"><div class="fc-day-grid-container"><div class="fc-day-grid"><div class="fc-row fc-week fc-widget-content"><div class="fc-bg"><table><tbody><tr><td class="fc-week-number fc-widget-content" style="width: 18px;"></td><td class="fc-day fc-widget-content fc-mon fc-other-month fc-past" data-date="2016-04-25"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-tue fc-other-month fc-past" data-date="2016-04-26"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-wed fc-other-month fc-past" data-date="2016-04-27"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-thu fc-other-month fc-past" data-date="2016-04-28"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-fri fc-other-month fc-past" data-date="2016-04-29"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-sat fc-other-month fc-past" data-date="2016-04-30"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-sun fc-past" data-date="2016-05-01"><span class="day-plus-shift">+</span></td></tr></tbody></table></div><div class="fc-content-skeleton"><table><thead><tr><td class="fc-week-number" style="width: 18px;"><span>17</span></td><td class="fc-day-number fc-mon fc-other-month fc-past" data-date="2016-04-25">25</td><td class="fc-day-number fc-tue fc-other-month fc-past" data-date="2016-04-26">26</td><td class="fc-day-number fc-wed fc-other-month fc-past" data-date="2016-04-27">27</td><td class="fc-day-number fc-thu fc-other-month fc-past" data-date="2016-04-28">28</td><td class="fc-day-number fc-fri fc-other-month fc-past" data-date="2016-04-29">29</td><td class="fc-day-number fc-sat fc-other-month fc-past" data-date="2016-04-30">30</td><td class="fc-day-number fc-sun fc-past red-day" data-date="2016-05-01">1</td></tr></thead><tbody><tr><td class="fc-week-number" style="width:18px"></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr></tbody></table></div></div><div class="fc-row fc-week fc-widget-content"><div class="fc-bg"><table><tbody><tr><td class="fc-week-number fc-widget-content" style="width: 18px;"></td><td class="fc-day fc-widget-content fc-mon fc-past" data-date="2016-05-02"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-tue fc-past" data-date="2016-05-03"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-wed fc-past" data-date="2016-05-04"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-thu fc-past" data-date="2016-05-05"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-fri fc-past" data-date="2016-05-06"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-sat fc-past" data-date="2016-05-07"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-sun fc-past" data-date="2016-05-08"><span class="day-plus-shift">+</span></td></tr></tbody></table></div><div class="fc-content-skeleton"><table><thead><tr><td class="fc-week-number" style="width: 18px;"><span>18</span></td><td class="fc-day-number fc-mon fc-past" data-date="2016-05-02">2</td><td class="fc-day-number fc-tue fc-past" data-date="2016-05-03">3</td><td class="fc-day-number fc-wed fc-past" data-date="2016-05-04">4</td><td class="fc-day-number fc-thu fc-past red-day" data-date="2016-05-05">5</td><td class="fc-day-number fc-fri fc-past" data-date="2016-05-06">6</td><td class="fc-day-number fc-sat fc-past" data-date="2016-05-07">7</td><td class="fc-day-number fc-sun fc-past red-day" data-date="2016-05-08">8</td></tr></thead><tbody><tr><td class="fc-week-number" style="width:18px"></td><td></td><td></td><td></td><td></td><td class="fc-event-container"><a class="fc-day-grid-event fc-h-event fc-event fc-start fc-end fc-draggable shiftid_525_1 choose"><div class="fc-content"><span class="fc-time">10:00 - 22:00</span> <span class="fc-title">&nbsp;</span></div><div class="fc-content">
    Obemannat
</div>
<div class="fc-content">
    
    
    
    
    
    
    
</div></a></td><td></td><td></td></tr></tbody></table></div></div><div class="fc-row fc-week fc-widget-content"><div class="fc-bg"><table><tbody><tr><td class="fc-week-number fc-widget-content" style="width: 18px;"></td><td class="fc-day fc-widget-content fc-mon fc-past" data-date="2016-05-09"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-tue fc-today fc-state-highlight" data-date="2016-05-10"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-wed fc-future" data-date="2016-05-11"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-thu fc-future" data-date="2016-05-12"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-fri fc-future" data-date="2016-05-13"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-sat fc-future" data-date="2016-05-14"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-sun fc-future" data-date="2016-05-15"><span class="day-plus-shift">+</span></td></tr></tbody></table></div><div class="fc-content-skeleton"><table><thead><tr><td class="fc-week-number" style="width: 18px; background-color: rgb(255, 255, 255);"><span>19</span></td><td class="fc-day-number fc-mon fc-past" data-date="2016-05-09">9</td><td class="fc-day-number fc-tue fc-today fc-state-highlight" data-date="2016-05-10">Idag 10</td><td class="fc-day-number fc-wed fc-future" data-date="2016-05-11">11</td><td class="fc-day-number fc-thu fc-future" data-date="2016-05-12">12</td><td class="fc-day-number fc-fri fc-future" data-date="2016-05-13">13</td><td class="fc-day-number fc-sat fc-future" data-date="2016-05-14">14</td><td class="fc-day-number fc-sun fc-future red-day" data-date="2016-05-15">15</td></tr></thead><tbody><tr><td class="fc-week-number" style="width:18px"></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr></tbody></table></div></div><div class="fc-row fc-week fc-widget-content"><div class="fc-bg"><table><tbody><tr><td class="fc-week-number fc-widget-content" style="width: 18px;"></td><td class="fc-day fc-widget-content fc-mon fc-future" data-date="2016-05-16"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-tue fc-future" data-date="2016-05-17"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-wed fc-future" data-date="2016-05-18"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-thu fc-future" data-date="2016-05-19"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-fri fc-future" data-date="2016-05-20"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-sat fc-future" data-date="2016-05-21"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-sun fc-future" data-date="2016-05-22"><span class="day-plus-shift">+</span></td></tr></tbody></table></div><div class="fc-content-skeleton"><table><thead><tr><td class="fc-week-number" style="width: 18px; background-color: rgb(255, 255, 255);"><span>20</span></td><td class="fc-day-number fc-mon fc-future" data-date="2016-05-16">16</td><td class="fc-day-number fc-tue fc-future" data-date="2016-05-17">17</td><td class="fc-day-number fc-wed fc-future" data-date="2016-05-18">18</td><td class="fc-day-number fc-thu fc-future" data-date="2016-05-19">19</td><td class="fc-day-number fc-fri fc-future" data-date="2016-05-20">20</td><td class="fc-day-number fc-sat fc-future" data-date="2016-05-21">21</td><td class="fc-day-number fc-sun fc-future red-day" data-date="2016-05-22">22</td></tr></thead><tbody><tr><td class="fc-week-number" style="width:18px"></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr></tbody></table></div></div><div class="fc-row fc-week fc-widget-content"><div class="fc-bg"><table><tbody><tr><td class="fc-week-number fc-widget-content" style="width: 18px;"></td><td class="fc-day fc-widget-content fc-mon fc-future" data-date="2016-05-23"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-tue fc-future" data-date="2016-05-24"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-wed fc-future" data-date="2016-05-25"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-thu fc-future" data-date="2016-05-26"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-fri fc-future" data-date="2016-05-27"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-sat fc-future" data-date="2016-05-28"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-sun fc-future" data-date="2016-05-29"><span class="day-plus-shift">+</span></td></tr></tbody></table></div><div class="fc-content-skeleton"><table><thead><tr><td class="fc-week-number" style="width: 18px;"><span>21</span></td><td class="fc-day-number fc-mon fc-future" data-date="2016-05-23">23</td><td class="fc-day-number fc-tue fc-future" data-date="2016-05-24">24</td><td class="fc-day-number fc-wed fc-future" data-date="2016-05-25">25</td><td class="fc-day-number fc-thu fc-future" data-date="2016-05-26">26</td><td class="fc-day-number fc-fri fc-future" data-date="2016-05-27">27</td><td class="fc-day-number fc-sat fc-future" data-date="2016-05-28">28</td><td class="fc-day-number fc-sun fc-future red-day" data-date="2016-05-29">29</td></tr></thead><tbody><tr><td class="fc-week-number" style="width:18px"></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr></tbody></table></div></div><div class="fc-row fc-week fc-widget-content"><div class="fc-bg"><table><tbody><tr><td class="fc-week-number fc-widget-content" style="width: 18px;"></td><td class="fc-day fc-widget-content fc-mon fc-future" data-date="2016-05-30"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-tue fc-future" data-date="2016-05-31"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-wed fc-other-month fc-future" data-date="2016-06-01"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-thu fc-other-month fc-future" data-date="2016-06-02"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-fri fc-other-month fc-future" data-date="2016-06-03"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-sat fc-other-month fc-future" data-date="2016-06-04"><span class="day-plus-shift">+</span></td><td class="fc-day fc-widget-content fc-sun fc-other-month fc-future" data-date="2016-06-05"><span class="day-plus-shift">+</span></td></tr></tbody></table></div><div class="fc-content-skeleton"><table><thead><tr><td class="fc-week-number" style="width: 18px;"><span>22</span></td><td class="fc-day-number fc-mon fc-future" data-date="2016-05-30">30</td><td class="fc-day-number fc-tue fc-future" data-date="2016-05-31">31</td><td class="fc-day-number fc-wed fc-other-month fc-future" data-date="2016-06-01">1</td><td class="fc-day-number fc-thu fc-other-month fc-future" data-date="2016-06-02">2</td><td class="fc-day-number fc-fri fc-other-month fc-future" data-date="2016-06-03">3</td><td class="fc-day-number fc-sat fc-other-month fc-future" data-date="2016-06-04">4</td><td class="fc-day-number fc-sun fc-other-month fc-future red-day" data-date="2016-06-05">5</td></tr></thead><tbody><tr><td class="fc-week-number" style="width:18px"></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr></tbody></table></div></div></div></div></td></tr></tbody></table></div></div>
    </div>

Answer 1

Selenium WebDriver DatePicker日历（youtube）

或

如何在Selenium Webdriver 中处理日历

Answer 2

我看到html的结构相当好，并且有一些有用的样式可以利用。我已经确认，下面的CSS定位器/选择器将唯一标识"第三行"的第一天（我假设你的意思是第三周）。

div.fc-row.fc-week:nth-of-type(3) td.fc-day:nth-of-type(2)

这只是表中的列。你真的需要用+双击跨度吗？将该跨度添加到定位器：

div.fc-row.fc-week:nth-of-type(3) td.fc-day:nth-of-type(2) span.day-plus-shift

我更熟悉CSS路径，所以如果你想的话，我会让你把它翻译成xpath。

注意，HTML只是一个片段。请确保它没有被包裹在iframe里面。在这种情况下，您需要先切换到框架。