Как найти веб-элемент в динамическом полном календаре?

Моя установка Selenium — это Java/Eclipse/TestNG, а мой драйвер — Chrome.

Я хочу найти день в полном календаре на нашей веб-странице и дважды щелкнуть его, что, в свою очередь, откроет отдельную панель для создания смены в этот день.

Моя проблема в том, что когда я использую xpath (полученный с помощью плагина XPath Helper для Chrome), чтобы найти определенный день в полном календаре, а затем пытаюсь дважды щелкнуть его, ничего не происходит. Я пробовал xpaths для других элементов на странице, и они работают. Я также пробовал метод двойного щелчка отдельно на внешнем тестовом 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>


fullcalendar selenium webdriver xpath double-click
person A. Warrby    schedule 10.05.2016    source источник
comment
С вашим XPath все не так :)) Вы должны использовать относительное XPath вместо абсолютного. Предоставьте образец кода html для целевого элемента   -  person Andersson    schedule 10.05.2016
comment
Спасибо за ответ, Андерссон. Добавлю, что я новичок в автоматизированных тестах, веб-драйвере и html-коде в целом. HTML-код элемента очень длинный, и я не знаю, как его весь сюда скопировать. Я проверю разницу между относительным и абсолютным xpath и посмотрю, что я могу узнать.   -  person A. Warrby    schedule 10.05.2016
comment
Вам не нужен полный код страницы HTML, только для таблицы, которая содержит элемент с требуемым значением (код для div[@class='fc-content-skeleton'] с его дочерней таблицей)   -  person Andersson    schedule 10.05.2016
comment
Чтобы получить HTML (в Firefox): щелкните правой кнопкой мыши элемент -> Проверить элемент -> Выбрать строки примера кода -> CTRL+C   -  person Andersson    schedule 10.05.2016
comment
Я использую Chrome на MacBook, и копирование одной строки с помощью CMD+C дало мне гораздо больше, чем просто одну строку. Вместо этого я попытался справиться с внешним html, где, кажется, начинается полный код календаря, но формат не работает.   -  person A. Warrby    schedule 10.05.2016
comment
Довольно сложно читать предоставленный html образец кода. Не могли бы вы показать более структурированный код? Также проверьте, действительно ли элемент, который вы найдете с помощью XPath, кликабельный (если исключений, таких как ElementNotFound, не происходит, тогда XPath может быть правильным, но вы путаете целевой элемент с чем-то другим)   -  person Andersson    schedule 10.05.2016

Ответы (2)


arrow_upward
0
arrow_downward

Календарь Selenium WebDriver DatePicker (youtube)

or

Как работать с Календарем в Selenium Webdriver

person Leon Barkan    schedule 10.05.2016
comment
Это хорошо, но, похоже, он обрабатывает средства выбора даты, а не полный календарь, поэтому, боюсь, это мне не поможет. - person A. Warrby; 10.05.2016
comment
используйте ту же логику! получите месяц, дни в общих списках, сравните их с тем, что вам нужно, нажмите на них и так далее... - person Leon Barkan; 10.05.2016
comment
Когда я перехожу на свою страницу, страница загружается с уже открытым полным календарем, показывающим текущий месяц. В моем тестовом примере я хочу всегда дважды щелкать первый день (понедельник для меня) в третьей строке. Тестовый пример не будет знать, какое сейчас число, месяц или год. Могу ли я тогда использовать ту же логику, что и в ваших ссылках? - person A. Warrby; 10.05.2016
comment
что, если driver.FindElement(By.Xpath(//div[@class='fc-content-skeleton']/table/tbody/tr/td[2])).Click(); - person Leon Barkan; 10.05.2016
comment
Щелчок по пустому дню в моем календаре ничего не дает, это должен быть двойной щелчок. Я пытался сделать это, как вы можете видеть в коде в моем посте, но это не работает, так как мой код xpath неверен. Я думаю, что ключ в том, чтобы сделать это правильно, и тогда это сработает. - person A. Warrby; 10.05.2016

arrow_upward
0
arrow_downward

Я вижу, что 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. В этом случае вам нужно сначала переключиться на фрейм.

person Breaks Software    schedule 10.05.2016