第04课:亚马逊购物流程分析

第04课:亚马逊购物流程分析

本次针对上节用到的 Selenium 控件以及动作进行分析讲解,这部分知识需要读者掌握并理解,有些处理代码没有好的办法,请背下来。

控件分析

输入框 input

场景:亚马逊网站的登录界面如下所示。

其对应的 HTML 源码如下。

<div class="a-row a-spacing-base">
<label class="a-form-label" for="ap_email">                   邮箱地址或手机号码                 </label>
<input id="ap_email" class="a-input-text a-span12 auth-autofocus auth-required-field a-form-error" type="email" tabindex="1" name="email" maxlength="128"/>
<div id="auth-email-missing-alert" class="a-box a-alert-inline a-alert-inline-error auth-inlined-error-message a-spacing-none a-spacing-top-mini" style="display: block;">
<div class="a-box-inner a-alert-container">
<i class="a-icon a-icon-alert"/>
<div class="a-alert-content">   输入您的邮箱地址或手机号码 </div>
</div>
</div>
</div>

我们看某一被测试元素的源码,请注意我们感兴趣的两点分别是:

  • HTML 的层级结构,如果不知道什么是层级结构,建议看下 HTML 基础,当然也有笨方法,尖括号 < 里跟的第一个一般为一层,如 <HTML>、<body>、<div>、<input> 等等。
  • 看页签后跟着的属性,如果看到 id=''、class='' 等等会很兴奋,因为 xpath 定位肯定可以定位到这个被测试元素。

另外补充说明一点:因为 HTML 5 的引入,好多框架采用的是内联嵌套框架,对待这种框架,给大家一个认知,如果发现有一天定位一个元素,使用 id 属性定位不到,此时请记住果断换成 class 属性来定位。

方法

输入框常用的方法有两个 sendkeys(),其返回值为:void,即没有返回值。

clear(),清空输入框,返回值也为空。

按钮 Button

场景:亚马逊网站主页搜索按钮

HTML 源码
<input class="nav-input" type="submit" tabindex="22" value="搜索"/>
方法以及说明
  • 首先要强调的是不要被 input 所迷惑,认为其也是输入框,有些按钮的标签会注明 <butto </button>,但是有些不会注明,类似于这种,看起来像是 input 输入框,但是后面有个属性type="submit",这就说明其也是一个 button,只不过这种写法主要用在表单中。
  • 它的常用方法就是 click(),返回值为 void。结合上面的 input 类型的 button,调用此方法的含义就是提交表单。
  • 记住普通的 button 按钮的 HTML 源码示例,如下所示: <input class="button" type="button" value="Submit"/>。可见区别就在于 type 后面的值,是 button 就是普通按钮,这种按钮任何事件都必须手工书写。

超链接 Link

场景

亚马逊首页的"我的亚马逊",如下图所示:

当然 “Z秒杀”、“礼品卡”等也属于超链接。

HTML 源码
<a id="nav-your-amazon" class="nav-a nav_a" href="/gp/yourstore/home/ref=nav_cs_ys">我的亚马逊</a>
方法以及说明
  • 见到标签为<a>,一定要想到定位使用 xpath 中的 text()函数。比如定位我的 “亚马逊”,最好的定位方式为://a[text()='我的亚马逊']。

  • 见到超链接从某种意义讲它和按钮使用的基本方法一致,最最常用的方法即为:click()点击方法。

下拉菜单 select

场景

亚马逊首页的搜索处的“全部分类”,如下图所示:

当然此场景还有后面选择鞋的尺寸那里也是一个 select。

HTML 源码
<select id="searchDropdownBox" class="nav-search-dropdown searchSelect" title="搜索范围" tabindex="20" style="display: block; top: 0px;" name="url" data-nav-selected="0" data-nav-digest="R5BShSSKlVgH8ylNRKUtWaRKhc0" aria-describedby="searchDropdownDescription">
<option value="search-alias=aps" selected="selected">全部分类</option>
<option value="search-alias=digital-text">Kindle商店</option>
<option value="search-alias=mobile-apps">应用程序和游戏</option>
<option value="search-alias=amazon-global-store">亚马逊海外购</option>
...还有不在粘贴,自行去打开亚马逊进行观察
</select>
方法以及说明
  • 因为我们操作 Select,是为了定位其下拉框下的 option,所以必须引入 Select 类。即程序开头应该有如下代码import org.openqa.selenium.support.ui.Select;
  • 要想得到某一个 option 的值,方法有如下三个:

(1)selectByIndex(index),index 为元素所在的位置,从 0 开始。如要定位全部分类,就写为 selectByIndex(0)。

(2)selectByValue(Value),Value 是 option 标签的一个属性值,并不是显示在下拉框中的值,即 value= 后面的值,如要定位"亚马逊海外购"就写为 selectByValue("search-alias=amazon-global-store")。

(3)selectByVisibleText(text) 是在 option 标签中间的值,是显示在下拉框的值,即为<option</option> 之间的值,如要定位"亚马逊海外购"就写为:selectByVisibleText("亚马逊海外购")。

同时 selenium 还提供了 option 的反选的三个方法,与上面的方法相对应,分别为:

  • .deselectByVisibleText();
  • .deselectByValue();
  • .deselectByIndex();

并且增加了一个全部不选的方法:.deselectAll();

补充一点知识,我们选择 option 之后,想看看现在所选择的是不是我们需要的标签,所以可以将选中的内容进行打印输出,此时可以调用的方法如下:

  • .getAllSelectedOptions() 返回所有被选中的 options。
  • .getOptions() 返回当前这个 select 所有的 optiongs(不管选中不选中都返回)。
  • .getFirstSelectedOption() 返回第一个被选中的 option。

需要说明的是 .getOptions() 这个方法的返回值是一个 List 列表,这个列表的泛型为 WebElement。

核心代码为:

 //定位到下拉菜单的全部元素
  WebElement elements = driver.findElement(By.cssSelector("#searchDropdownBox"));
//把 elements 赋值给 select
Select select  = new Select(elements);
//以下代码实现循环输出当前 select 下所有的 options
List<WebElement> list = select.getOptions();
//先循环输出前获取下长度:
int wesize = list.size();
System.out.println(wesize);
//用 Iterator 进行 List 列表的循环输出
Iterator<WebElement> iter = list.iterator();
 while(iter.hasNext()){
String we = iter.next().getText();
System.out.println(we);
            }            

通过观察上一篇的示例以及上面的代码实现,大家应该还发现一个结论:定位 Select 时,最好采用 by.cssSelector 来进行定位。

需要记住的一个模式

时间等待

我们做跳转界面的时候,有时必须要设置等待时间,设置它的目的是为了 Windows 窗体跳转后可以使的新的界面加载完成,如果页面加载不完成,会导致定位不到界面上的元素。通常设置等到时间我们有两种方法。

Thread 等待

这种等待方式主要是运用 Thread 线程类的休眠方法,将正在运行的线程强制休眠一段时间,以达到等待的目的,即:Thread.sleep(1000) 表示休眠 1 秒钟,但是实际工作中这种休眠方式是不可取的,因为它具有随机性,但是为什么我还要介绍这种方式?因为它代码简单,调试的时候可以使用,记住此种方式适应于调试。

智能等待

这种方式的好处在于等待的时间按照程序的处理来进行调整,程序处理快、等待时间短、程序处理时间长、等到时间长。

实现的代码即为:

//实例化等待类对象
WebDriverWait wait = new WebDriverWait(driver, 10);  
//调用 until 方法,直到界面显示出某元素的位置,才返回成功,然后继续向下执行。
        wait.until(new ExpectedCondition<WebElement>(){
            public WebElement apply(WebDriver driver) {
                return driver.findElement(By.xpath("//select[@class='a-native-dropdown']")); 
            }
        }).isDisplayed();

上面的这部分代码的写法,最好背下来,这样以后定位一个控件,定位不到一定要最先想到 WebDriverWait 这个智能等待类的用法。

为什么使用跳转

不知道大家有没有注意到,在上一篇的实现代码中有下面一段代码:

//获得当前窗体的句柄
String strOldHandle = driver.getWindowHandle();

         for(String winHandle : driver.getWindowHandles())
            {    
            if (winHandle.equals(strOldHandle))
            {
            continue;
            }
            driver.switchTo().window(winHandle);
            break; 

上面这段代码的作用是为了判定窗口是不是已经顺利跳转,这个功能可以配合智能等待机智一起使用,都是为了保证新界面的顺利加载。

总结

  • 必须掌握常用的控件的用法,按钮、超链接、下拉框、输入框。
  • 需要掌握每个控件支持的常用方法有哪些。
  • 熟记智能等待机智的代码。
上一篇
下一篇
目录