javascript – Selenium IDE:如何从datepicker中选择下一个可用日期

前端之家收集整理的这篇文章主要介绍了javascript – Selenium IDE:如何从datepicker中选择下一个可用日期前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我希望我的selenium IDE测试用例像下面的步骤一样运行,以便自动选择日期:

>单击出发日期以打开日期选择器
>从当前选定的日期开始,循环显示日期,直到到达下一个可用日期(如果需要,请移至下个月或下一年以查找下一个可用日期)
>从日期选择器中选择可用日期

有人可以告诉我,因为我对selenium不熟悉如何为上述例子做这件事吗?我的所有脚本目前都可以打开日历.

下面是我设法收到的与上面截图匹配的html:

//Months drop down
    <select class="ui-datepicker-month" data-handler="selectMonth" data-event="change">
    <option value="2" selected="selected">Mar
    </option><option value="3">Apr</option>
    <option value="4">May</option>
    <option value="5">Jun</option>
    <option value="6">Jul</option>
    <option value="7">Aug</option>
    <option value="8">Sep</option>
    <option value="9">Oct</option>
    </select>
//Years drop down
    <select class="ui-datepicker-year" data-handler="selectYear" data-event="change">
    <option value="2016" selected="selected">2016</option>
    </select>
    <table class="ui-datepicker-calendar">
//days labels
    <thead>
    <tr>
    <th scope="col"><span title="Monday">Mo</span></th>
    <th scope="col"><span title="Tuesday">Tu</span></th>
    <th scope="col"><span title="Wednesday">We</span></th>
    <th scope="col"><span title="Thursday">Th</span></th>
    <th scope="col"><span title="Friday">Fr</span></th>
    <th scope="col" class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th>
    <th scope="col" class="ui-datepicker-week-end"><span title="Sunday">Su</span></th>
    </tr>
    </thead>
    <tbody>
//dates
    <tr>
    <td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td>
    <td class=" ui-datepicker-unselectable ui-state-disabled " title="No available flights on this date"><span class="ui-state-default">1</span></td>
    <td class=" ui-datepicker-unselectable ui-state-disabled " title="No available flights on this date"><span class="ui-state-default">2</span></td>
    <td class=" ui-datepicker-unselectable ui-state-disabled " title="No available flights on this date"><span class="ui-state-default">3</span></td>
    <td class=" ui-datepicker-unselectable ui-state-disabled " title="No available flights on this date"><span class="ui-state-default">4</span></td>
    <td class=" ui-datepicker-week-end ui-datepicker-unselectable ui-state-disabled " title="No available flights on this date"><span class="ui-state-default">5</span></td>
    <td class=" ui-datepicker-week-end ui-datepicker-unselectable ui-state-disabled " title="No available flights on this date"><span class="ui-state-default">6</span></td></tr>
    <tr>
    <td class=" ui-datepicker-unselectable ui-state-disabled " title="No available flights on this date"><span class="ui-state-default">7</span></td>
    <td class=" ui-datepicker-unselectable ui-state-disabled " title="No available flights on this date"><span class="ui-state-default">8</span></td>
    ...same process till last week of dates (bottom row of calendar in screenshot)
    <tr>
    <td class=" ui-datepicker-days-cell-over  ui-datepicker-current-day" title="Click to see flights on this date" data-handler="selectDay" data-event="click" data-month="2" data-year="2016"><a class="ui-state-default ui-state-active" href="#">28</a></td>
    <td class=" ui-datepicker-unselectable ui-state-disabled " title="No available flights on this date"><span class="ui-state-default">29</span></td>
    <td class=" ui-datepicker-unselectable ui-state-disabled " title="No available flights on this date"><span class="ui-state-default">30</span></td>
    <td class=" ui-datepicker-unselectable ui-state-disabled " title="No available flights on this date"><span class="ui-state-default">31</span></td>
    <td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td><td class=" ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td>
    <td class=" ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td>
    </tr>
    </tbody>
    </table>

解决方法

在Selenium IDE中自动执行此类任务将非常具有挑战性,因为在获取下一个可用日期时涉及非平凡的逻辑,您应该考虑 switching to Selenium WebDriver选择一种可用的selenium语言绑定.

这是使用Python language Selenium bindings制作的工作代码.这个想法是:

>实例化WebDriver(在此示例中使用Firefox(),但也有其他选择)
>最大化浏览器窗口
>导航到URL(http://www.jet2.com)
>等到明确加载页面(docs)
>填写出发地和目的地
>单击“离开”字段以触发要显示的日历
>在日历中,找到当前日期 – 它具有ui-datepicker-current-day类
>使用“by XPath”定位技术和following axis检查本月是否有可用日期.如果是,请将其打印出来并单击.
>如果我们在本月没有找到下一个可用日期,请初始化并“无限”循环,然后单击“下一步”月份按钮,检查我们是否有可用日期.将其打印出来然后单击(如果找到)并退出循环.否则,单击“下一步”按钮.
>如果我们没有“下一步”按钮 – 那么我们在一年结束时,选择下一年的下拉菜单,继续循环
>完成后关闭驱动程序

代码

from selenium import webdriver
from selenium.common.exceptions import NoSuchElementException
from selenium.webdriver import ActionChains
from selenium.webdriver.common.by import By
from selenium.webdriver.support.select import Select
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC


FROM = "Leeds Bradford"
TO = "Budapest BUD"

driver = webdriver.Firefox()  # or,webdriver.Chrome(),or webdriver.PhantomJS() or etc.
driver.maximize_window()
driver.get("http://www.jet2.com")

wait = WebDriverWait(driver,10)
actions = ActionChains(driver)

# wait for the page to load
wait.until(EC.presence_of_element_located((By.ID,"departure-airport-input")))

# fill out the form
driver.find_element_by_id("departure-airport-input").send_keys(FROM)
wait.until(EC.presence_of_element_located((By.CSS_SELECTOR,"#ui-id-1 .ui-menu-item"))).click()

driver.find_element_by_id("destination-airport-input").send_keys(TO)
wait.until(EC.presence_of_element_located((By.CSS_SELECTOR,"#ui-id-2 .ui-menu-item"))).click()

# select date
datepicker = driver.find_element_by_id("departure-date-selector")
actions.move_to_element(datepicker).click().perform()

# find the calendar,month and year picker and the current date
calendar = driver.find_element_by_id("departureDateContainer")
month_picker = Select(calendar.find_element_by_class_name("ui-datepicker-month"))
year_picker = Select(calendar.find_element_by_class_name("ui-datepicker-year"))
current_date = calendar.find_element_by_class_name("ui-datepicker-current-day")

# printing out current date
month = month_picker.first_selected_option.text
year = year_picker.first_selected_option.text
print("Current date: {day} {month} {year}".format(day=current_date.text,month=month,year=year))

try:
    # see if we have an available date in this month
    next_available_date = current_date.find_element_by_xpath("following::td[@data-handler='selectDay' and ancestor::div/@id='departureDateContainer']")
    print("Found an available date: {day} {month} {year}".format(day=next_available_date.text,year=year))
    next_available_date.click()
except NoSuchElementException:
    # looping over until the next available date found
    while True:
        # click next,if not found,select the next year
        try:
            calendar.find_element_by_class_name("ui-datepicker-next").click()
        except NoSuchElementException:
            # select next year
            year = Select(calendar.find_element_by_class_name("ui-datepicker-year"))
            year.select_by_visible_text(str(int(year.first_selected_option.text) + 1))

        # reporting current processed month and year
        month = Select(calendar.find_element_by_class_name("ui-datepicker-month")).first_selected_option.text
        year = Select(calendar.find_element_by_class_name("ui-datepicker-year")).first_selected_option.text
        print("Processing {month} {year}".format(month=month,year=year))

        try:
            next_available_date = calendar.find_element_by_xpath(".//td[@data-handler='selectDay']")
            print("Found an available date: {day} {month} {year}".format(day=next_available_date.text,year=year))
            next_available_date.click()
            break
        except NoSuchElementException:
            continue

driver.close()

检测结果:

>利兹布拉德福德 – >安塔利亚AYT(下一个4月可用日期):

Current date: 28 Mar 2016
Processing Apr 2016
Found an available date: 4 Apr 2016

>利兹布拉德福德 – > Budapest BUD(下一个可用日期与当前日期相同):

Current date: 12 Feb 2016
Found an available date: 15 Feb 2016

>? (下一年的下一个可用日期)

猜你在找的JavaScript相关文章