在机票预定的页面,输入出发城市和到达城市输入框的时候, 发现直接使用sendkeys不好使,

大部分情况出现输入某城市后没有输入进去, 经过几天的研究,发现可以采取三种方式:

1. 先点击输入框,待弹出 城市选择框之后,点击相应的城市

2. 缓慢输入城市的缩略字母或者城市的名字的部分,会显示出待选城市的下拉列表,进而从下拉列表中选择相应的城市.

3. 直接执行 js脚本对input的value设置为想要的值

首先说一下第三种方式:

    JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript("arguments[0].value=\"北京\"", from_inpox);

执行效果最好,

22:35:34.885 INFO - Executing: [execute script: arguments[0].value="北京", [[[Ch
romeDriver: chrome on XP (6452a4a961be7bffa2af9d1b63f3d111)] -> xpath: //div[@id
='js_flighttype_tab_domestic']//input[@name='fromCity']]]])

如上图所演示,两种方式均是用户真实行为。

采取第一种方式:

  • 首先定位到输入框
  • 点击输入框
  • 从弹出的热门城市框中点击所需要的城市
WebElement from_inpox = driver
.findElement(By.xpath("//div[@id='js_flighttype_tab_domestic']//input[@name='fromCity']"));
Actions actions = new Actions(driver);
actions.moveToElement(from_inpox).click().perform();
driver.findElement(By
.xpath("//div[@data-panel='domesticfrom-flight-hotcity-from']//a[@class='js-hotcitylist' and text()='西安']"))
.click();

这里我并没有直接使用click, 而是使用Actions,原因是我在对到达城市操作时,发现经常报element can't be clicked这样的错误,

大意是,当要点击到达城市输入框,其实是被上层的元素遮挡,没法使用click方法,但是可以使用Actions的moveToElement方法之后可以click

或者采取滚动到该元素,调用JS

JavascriptExecutor jse = (JavascriptExecutor) driver;
jse.executeScript("arguments[0].scrollIntoView()",element);

之后就可进行click操作.

如果使用第二种方法,就会遇到一个很大的问题:

如何定位到JS生成的下拉列表的城市?Firebug定位之前列表就消失!

看上去很难哈,反复尝试无所成, 最后突然想起既然是JS生成的,何不使用浏览器的JS debug功能,设置断点一步一步

果不其然,药到病除。nice job~

思路有了,跟我一起做,点开firebug ,切换到“脚本”界面,首先在输入框输入单字母s,待弹出下拉列表后,单击左侧的插入断点操作

你会发现该下拉框被冻结,不错呦,之后切换到html界面进行定位。

不光是去哪网,像百度输入框也可以采取这样的办法,JS设置断点,js的弹出框,弹出菜单就会冻结.

接下来我的输入就是选择下拉菜单中所需城市:

        from_inpox.clear();
from_inpox.sendKeys("BJ");
Thread.sleep(8000);
By bj=new By.ByXPath("//div[@class='qcbox-fixed js-suggestcontainer']//td[contains(text(),'北京')]");
if(isElementPresent(driver,bj,20))
{
driver.findElement(bj).click();
}

所要注意的是,下拉菜单中未必弹出那么快,需要做一次等待,在选择下拉菜单的时候需要做一次判断,当然这个判断方法是使用WebDriverWait

/**
* @author Young
* @param driver
* @param by
* @param timeOut
* @return
*/
public static boolean isElementPresent(WebDriver driver, final By by, int timeOut) {
WebDriverWait wait = new WebDriverWait(driver, timeOut);
boolean isPresent = false;
isPresent = wait.until(new ExpectedCondition<WebElement>() {
@Override
public WebElement apply(WebDriver d) {
return d.findElement(by);
}
}).isDisplayed();
return isPresent; }

依然不够完美,为什么这么说,如果元素没有出现,并不是返回的false而是直接抛异常,并不是期望的,所以修改为findElements

如果找不到,返回List长度必然为0,进而返回false而不是抛出异常

/**
* @author Young
* @param driver
* @param by
* @param timeOut
* @return
* @throws InterruptedException
*/
public static boolean isElementPresent(WebDriver driver, final By by,
int timeOut) throws InterruptedException {
boolean isPresent = false;
Thread.sleep(timeOut * 1000);
List<WebElement> we = driver.findElements(by);
if (we.size() != 0) {
isPresent = true;
}
return isPresent;
}

测试步骤:

1.选择出发城市-> 北京

到达城市->上海

选择今天之后的七天

点击search button

2.选择某带“每段航班均需缴纳税费” 的订单

public static void main(String[] args) throws InterruptedException {
WebDriver driver = DriverFactory.getChromeDriver();
driver.get("http://flight.qunar.com/");
driver.manage().window().maximize();
driver.manage().timeouts().implicitlyWait(30, TimeUnit.SECONDS);
driver.manage().timeouts().pageLoadTimeout(30, TimeUnit.SECONDS);
WebElement from_inpox = driver
.findElement(By
.xpath("//div[@id='js_flighttype_tab_domestic']//input[@name='fromCity']"));
WebElement to_inpox = driver
.findElement(By
.xpath("//div[@id='js_flighttype_tab_domestic']//input[@name='toCity']"));
WebElement from_date = driver
.findElement(By
.xpath("//div[@id='js_flighttype_tab_domestic']//input[@name='fromDate']"));
WebElement sigleWayCheckBox = driver
.findElement(By
.xpath("//div[@id='js_flighttype_tab_domestic']//input[@class='inp_chk js-searchtype-oneway']"));
if (!sigleWayCheckBox.isSelected()) {
sigleWayCheckBox.click();
} from_inpox.clear();
from_inpox.sendKeys("BJ");
Thread.sleep(8000);
By bj = new By.ByXPath(
"//div[@class='qcbox-fixed js-suggestcontainer']//td[contains(text(),'北京')]");
if (isElementPresent(driver, bj, 20)) {
driver.findElement(bj).click();
} to_inpox.clear();
to_inpox.sendKeys("SH");
Thread.sleep(8000);
By sh = new By.ByXPath(
"//div[@class='qcbox-fixed js-suggestcontainer']//td[contains(text(),'上海')]");
if (isElementPresent(driver, sh, 20)) {
driver.findElement(sh).click();
} // Actions actions = new Actions(driver);
// actions.moveToElement(from_inpox).click().perform();
// driver.findElement(
// By.xpath("//div[@data-panel='domesticfrom-flight-hotcity-from']//a[@class='js-hotcitylist' and text()='西安']"))
// .click();
// driver.manage().timeouts().implicitlyWait(30, TimeUnit.SECONDS);
// driver.manage().timeouts().pageLoadTimeout(30, TimeUnit.SECONDS);
// actions.moveToElement(to_inpox).click().perform();
// driver.findElement(
// By.xpath("//div[@data-panel='domesticto-flight-hotcity-to']//a[@class='js-hotcitylist' and text()='北京']"))
// .click();
// driver.manage().timeouts().implicitlyWait(30, TimeUnit.SECONDS);
// driver.manage().timeouts().pageLoadTimeout(30, TimeUnit.SECONDS);
from_date.clear();
from_date.sendKeys(getDateAfterToday(7));
WebElement search = driver
.findElement(By
.xpath("//div[@id='js_flighttype_tab_domestic']//button[@class='btn_search']"));
search.submit();
driver.manage().timeouts().implicitlyWait(30, TimeUnit.SECONDS);
driver.manage().timeouts().pageLoadTimeout(30, TimeUnit.SECONDS);
WebElement page2 = driver.findElement(By
.xpath("//div[@id='hdivPager']/a[@value='2']"));
JavascriptExecutor jse = (JavascriptExecutor) driver;
jse.executeScript("arguments[0].scrollIntoView()", page2);
page2.click(); driver.manage().timeouts().implicitlyWait(30, TimeUnit.SECONDS);
driver.manage().timeouts().pageLoadTimeout(30, TimeUnit.SECONDS);
driver.findElement(
By.xpath("(//div[@class='avt_trans']//p[contains(text(),'每段航班均需缴纳税费')]/ancestor::div//div[@class='a_booking']/a)[3]"))
.click();
driver.findElement(
By.xpath("//div[@id='flightbarXI883']//div[@class='t_bk']/a"))
.click();
} public static String getDateAfterToday(int dateAfterToday) {
Calendar cal = Calendar.getInstance();
cal.add(Calendar.DATE, +dateAfterToday);
System.out.println(cal.getTime().toString());
Date date = cal.getTime();
SimpleDateFormat df = new SimpleDateFormat("yyyy-MM-dd");
System.out.println(df.format(date));
return df.format(date);
} /**
* @author Young
* @param driver
* @param by
* @param timeOut
* @return
* @throws InterruptedException
*/
public static boolean isElementPresent(WebDriver driver, final By by,
int timeOut) throws InterruptedException {
boolean isPresent = false;
Thread.sleep(timeOut * 1000);
List<WebElement> we = driver.findElements(by);
if (we.size() != 0) {
isPresent = true;
}
return isPresent;
}

效果如下:

    

去哪儿网输入框三种输入方式(selenium webdriver 干货)的更多相关文章

  1. 输入框三种输入方式(selenium webdriver 干货)

    在机票预定的页面,输入出发城市和到达城市输入框的时候, 发现直接使用sendkeys不好使, 大部分情况出现输入某城市后没有输入进去, 经过几天的研究,发现可以采取三种方式: 1. 先点击输入框,待弹 ...

  2. python中的三种输入方式

    python中的三种输入方式 python2.X python2.x中以下三个函数都支持: raw_input() input() sys.stdin.readline() raw_input( )将 ...

  3. 【转】vue.js三种安装方式

    Vue.js(读音 /vjuː/, 类似于 view)是一个构建数据驱动的 web 界面的渐进式框架.Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件.它不仅易于上手 ...

  4. vue.js三种安装方式

    Vue.js(读音 /vjuː/, 类似于 view)是一个构建数据驱动的 web 界面的渐进式框架.Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件.它不仅易于上手 ...

  5. 多对多三种创建方式、forms组件、cookies与session

    多对多三种创建方式.forms组件.cookies与session 一.多对多三种创建方式 1.全自动 # 优势:不需要你手动创建第三张表 # 不足:由于第三张表不是你手动创建的,也就意味着第三张表字 ...

  6. 多对多的三种创建方式-forms相关组件-钩子函数-cookie与session

    多对多的三种创建方式 1.全自动(推荐使用的**) 优势:第三张可以任意的扩展字段 缺点:ORM查询不方便,如果后续字段增加更改时不便添加修改 manyToManyField创建的第三张表属于虚拟的, ...

  7. MyEclipse中web服务器的三种配置方式

    初学Javaweb开发的人们都会遇到一个问题,就是服务器环境的搭建配置问题.下面介绍三种服务器的搭建方式. 直接修改server.xml文件 当你写了一个web应用程序(jsp/servlet),想通 ...

  8. SignalR代理对象异常:Uncaught TypeError: Cannot read property 'client' of undefined 推出的结论 SignalR 简单示例 通过三个DEMO学会SignalR的三种实现方式 SignalR推送框架两个项目永久连接通讯使用 SignalR 集线器简单实例2 用SignalR创建实时永久长连接异步网络应用程序

    SignalR代理对象异常:Uncaught TypeError: Cannot read property 'client' of undefined 推出的结论   异常汇总:http://www ...

  9. grub安装的 三种安装方式

    1. 引言 grub是什么?最常态的理解,grub是一个bootloader或者是一个bootmanager,通过grub可以引导种类丰富的系统,如linux.freebsd.windows等.但一旦 ...

随机推荐

  1. gradle项目中资源文件的相对路径打包处理技巧

    开发java application时,不管是用ant/maven/gradle中的哪种方式来构建,通常最后都会打包成一个可执行的jar包程序,而程序运行所需的一些资源文件(配置文件),比如jdbc. ...

  2. ReactNative新手学习之路07ListView_ renderHeader使用StaticContainer

    react native新手学习之路07ListView_ renderHeader使用StaticContainer 1.某些特殊场景需要用ScrollView滚动和ListView配合但是不幸运的 ...

  3. textarea去掉右侧滚动条,去掉右下角拖拽

    代码: <TEXTAREA style= "overflow:hidden; resize:none; "> </TEXTAREA> 当使用背景图片的时候, ...

  4. mac下需要安装旧 Java SE 6 才能打开程序解决办法

    今天我在mac系统下面安装myeclipse2014(myeclipse-pro-2014-GA-offline-installer-macosx.dmg)的时候,发现显示错误: 您需要安装旧 Jav ...

  5. NGUI Tween动画Scale与Transform冲突

    NGUI中我们要同时完成Scale与Transform的效果,会发现动画并不是同我们想的那样运行的. 原因就是Tween Scale与Tween Transform的冲突调用. Tween Scale ...

  6. Javascript知识点记录(二)

    Javascript入门易,精通难,基本上是共识的一个观点.在这个篇幅里,主要对一些难点进行记录. 鸭子类型 Javascript属于动态类型语言的一种.对变量类型的宽容,给了很大的灵活性.由于无需类 ...

  7. Alpha阶段第二次Scrum Meeting

    情况简述 Alpha阶段第一次Scrum Meeting 敏捷开发起始时间 2016/10/21 00:00 敏捷开发终止时间 2016/10/22 00:00 会议基本内容摘要 汇报了已经完成的任务 ...

  8. DOM0级事件处理和DOM2级事件处理

    转自:http://www.cnblogs.com/holyson/p/3914406.html 0级DOM 分为2个:一是在标签内写onclick事件  二是在JS写onlicke=function ...

  9. 一次完整的HTTP请求所经历的7个步骤

    HTTP通信机制是在一次完整的HTTP通信过程中,Web浏览器与Web服务器之间将完成下列7个步骤: 1. 建立TCP连接在HTTP工作开始之前,Web浏览器首先要通过网络与Web服务器建立连接,该连 ...

  10. RAID技术介绍

    RAID技术介绍 简介 RAID是一个我们经常能见到的名词.但却因为很少能在实际环境中体验,所以很难对其原理 能有很清楚的认识和掌握.本文将对RAID技术进行介绍和总结,以期能尽量阐明其概念. RAI ...