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

在机票预定的页面,输入出发城市和到达城市输入框的时候, 发现直接使用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;
    }

效果如下:

    

转载请注明出处:http://www.cnblogs.com/tobecrazy/

时间: 2024-10-08 03:42:06

输入框三种输入方式(selenium webdriver 干货)的相关文章

Selenium学习之==&gt;三种等待方式

在UI自动化测试中,必然会遇到环境不稳定,网络慢的情况,这时如果你不做任何处理的话,代码会由于没有找到元素,而报错.这时我们就要用到wait(等待),而在Selenium中,我们可以用到一共三种等待,每一种等待都有自己的优点或缺点,我们需要选择最优的等待方式.下面我们来介绍三种等待方式. 第一种:固定等待(time.sleep()) 在开发自动化框架过程中,最忌讳使用Python自带模块的time的sleep方法进行等待,虽然可以自定义等待时间,但当网络条件良好时,依旧按照预设定的时间继续等待,

Python Django 多对多三种创建方式 form组件 cookie和session

一 表中多对多关系三种创建方式 以Book表和Author表多对多关系例 1.第一种方式:全自动(推荐使用):models.ManyToManyField(to='类名') 优点:不需要你手动创建第三张表 缺点:第三张表不是你手动创建的,字段是固定的无法拓展 class Book(models.Model): title = models.CharField(max_length=32) price = models.DecimalField(max_digits=8,decimal_place

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

多对多三种创建方式.forms组件.cookies与session 一.多对多三种创建方式 1.全自动 # 优势:不需要你手动创建第三张表 # 不足:由于第三张表不是你手动创建的,也就意味着第三张表字段是固定的无法做扩展 class Book(models.Model): title = models.CharField(max_length=32) price = models.DecimalField(max_digits=8,decimal_places=2) authors = mode

Weblogic的三种部署方式

Weblogic的三种部署方式 在weblogic中部署项目通常有三种方式:第一,在控制台中安装部署:第二,将部署包放在domain域中autodeploy目录下部署:第三,使用域中配置文件config.xml 进行项目的部署. 控制台部署 1  启动weblogic服务,登录到weblogic控制台页面,输入用户名和密码,登录到控制台里面 2  点击左侧的部署 3  在右侧点击安装按钮,准备进行项目安装 4  看到路径输入框,可以在下面选择要部署的项目的位置 5  也可以直接输入要部署的包的位

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

初学Javaweb开发的人们都会遇到一个问题,就是服务器环境的搭建配置问题.下面介绍三种服务器的搭建方式. 直接修改server.xml文件 当你写了一个web应用程序(jsp/servlet),想通过浏览器直接去访问这个页面,需要在Tomcat中配置相关路径: 找到Tomcat下conf目录,你会看到有个server.xml,即服务器配置文件.用文本编译器打开,拉到Host标签,在它结束前加上我们的应用程序路径: <Context path="/HelloWeb" docBas

支付宝5月4日起将停止收款主页业务 保留三种收款方式

4月28日消息,支付宝近日发布公告称,将于5月4日起停止收款主页业务(产品功能将无法使用),但并未公布停止业务的具体信息. 据了解,收款主页业务是用户可以自己制作一个支付宝账号的链接,把这个链接发给付款人后,对方就可以输入金额给该用户付款. 支付宝收款主页截图 支付宝公告称,收款主页业务停止之后,用户可以有三种方式进行收款:生成专属支付宝收款账户码,将账户二维码图片分享出去:在电脑上使用我要收款:在手机上,使用支付宝钱包的我要收款. 以下为公告原文: 鉴于收款主页(https://me.alip

Servlet三种实现方式

Servlet三种实现方式:实现Servlet接口,继承GenericServlet ,继承HttpServlet. 1.实现Servlet接口: import javax.servlet.*; import java.io.*; public class Hello implements Servlet{ //执行条件:reload,关闭tomcat,关机 public void destroy() { // TODO Auto-generated method stub System.out

EF三种编程方式详细图文教程(C#+EF)

开始学习EF,从网上找了好多,都不是自己想要的,于是边学边把自己学习的过程写下来,以供参考. 操作环境:VS2013+SQLServer2012 Entity Framework4.1之前EF支持“Database First”和“Model First”编程方式,从EF4.1开始EF开始支持支持“Code First”编程方式,今天简单看一下EF三种编程方式. 开始介绍这三种EF操作方式之前,首先在Visual Studio 2013中建立一个数据库连接,这里我们以“EFDemo”数据库为例:

lamp平台三种实现方式

lamp平台的安装实现方式分为三种:rpm包的方式安装,以模块的方式编译安装,以fpm方式工作编译安装的php. 一.rpm包安装php: 在CentOS 6.5系统上以rpm包的方式安装httpd,php,mysq是最容易的一种,php在这种情况下做为httpd的模块来运行,在安装完php对应的rpm包以后,可以在httpd的配置文件目录中查看到php.conf文件,配置文件中定义了加载php模块对应的库文件的定义.当httpd启动进程响应客户的请求时,如果客户端请求的是php页面文件,那么h