[Python知识库]Webdriver概述_八大元素定位方法

##WebDriver入门

###1. Webdriver概述

? Webdriver (Selenium2）是一种用于Web应用程序的自动测试工具，它提供了一套友好的API，与Selenium 1（Selenium-RC）相比，Webdriver 的API更容易理解和使用，其可读性和可维护性也大大提高。Webdriver完全就是一套类库，不依赖于任何测试框架，除了必要的浏览器驱动，不需要启动其他进程或安装其他程序，也不必像Selenium 1那样需要先启动服务。

####1.1 支持浏览器

• Firefox （FirefoxDriver）
• IE（InternetExplorerDriver）
• Opera（OperaDriver）
• Chrome （ChromeDriver）
• safari（SafariDriver）

####1.2 支持语言

• Java
• C#
• PHP
• Python
• Perl
• Ruby

####1.3 注意！

? 各个驱动下载地址： http://www.seleniumhq.org/download/

? 浏览器位数的版本和驱动版本要一致！ 如果是32bit浏览器而Driver是64bit则会导致脚本运行失败！

###2. 第一个自动化测试脚本

####2.1 案例：

启动谷歌浏览器，

首先打开百度，打印网页标题，等待3秒

打开淘宝，打印网页标题，再等待2秒

关闭浏览器。

\\加载浏览器驱动
System.setProperty("webdriver.chrome.driver","webdriver\\chromedriver.exe");
\\对象实例化
WebDriver driver=new ChromeDriver();
\\打开百度
driver.get("http://www.baidu.com");
\\获取网页标题
System.out.println(driver.getTitle());
\\休息3秒
sleep(3);
\\打开淘宝首页
driver.get("http://www.taobao.com");
\\获取网页标题
System.out.println(driver.getTitle());
\\休息3秒
sleep(3);
\\关闭浏览器
driver.quit() 

####2.2 浏览器操作

浏览器窗口大小设置

页面前进后退

页面刷新

截取当前窗口图片

\\加载浏览器驱动
System.setProperty("webdriver.chrome.driver","webdriver\\chromedriver.exe");
\\对象实例化
WebDriver driver=new ChromeDriver();
\\打开百度
driver.get("http://www.baidu.com");
\\窗口最大化
driver.manage().window().maximize();
sleep（2）；
\\刷新当前页面
driver.navigate().refresh();
\\ 返回上一页
driver.navigate().back();
\\返回下一页
driver.navigate().forward();
sleep（2）；
\\截取当前窗口图片
File screenShotFile = ((TakesScreenshot)driver).getScreenshotAs(OutputType.FILE);  
        FileUtils.copyFile(screenShotFile, new File("D:/test.png"));
driver.quit()

###3. 元素定位

元素的定位应该是自动化测试的核心，要想操作一个元素，首先应该识别这个元素。

selenium-webdriver提供了强大的元素定位方法，支持以下三种方法。

• 单个对象的定位方法

• 多个对象的定位方法

• 层级定位

####3.1 定位单个元素

在定位单个元素时,selenium-webdriver提示了如下一些方法对元素进行定位。

• By.className(className))
• By.cssSelector(selector)
• By.id(id)
• By.linkText(linkText)
• By.name(name)
• By.partialLinkText(linkText)
• By.tagName(name)
• By.xpath(xpathExpression)

? 注意：selenium-webdriver通过 findElement()\findElements()等find方法调用"By"对象来定位和查询元素。By类只是提供查询的方式进行分类。 findElement返回一个元素对象否则抛出异常，findElements返回符合条件的元素List，如果不存在符合条件的就返回一个空的 list。

#####3.1.1 使用className进行定位

当所定位的元素具有class属性的时候我们可以通过classname来定位该元素。

下面的例子定位了51.com首页上class为"username"的li。

Java代码

1. 1. import org.openqa.selenium.WebDriver;` 
   2. import org.openqa.selenium.WebElement; 
   4. import org.openqa.selenium.By; 
   5. public class ByClassName { 
   6. public static void main(String[] args) { 
   7.       System.setProperty("webdriver.chrome.driver","webdriver\\chromedriver.exe");
   8.       WebDriver dr=new ChromeDriver();
   9.        driver.get("http://www.51.com"); 
   10.         WebElement element = driver.findElement(By.className("usxername")); 
   11         System.out.println(element.getTagName()); 
   12.   } 
   13. }
   

输出结果：

1. li

#####3.1.2 使用id属性定位

51.com首页的帐号输入框的html代码如下：

   <input id="passport_51_user" type="text" value="" tabindex="1" title="用户名/彩虹号/邮箱" name="passport_51_user"> 

在下面的例子中我们用id定位这个输入框，并输出其title,借此也可以验证代码是否工作正常。

  // Java代码
   1. import org.openqa.selenium.By; 
   2. import org.openqa.selenium.WebDriver; 
   3. import org.openqa.selenium.WebElement; 
   4. import org.openqa.selenium.firefox.FirefoxDriver; 
   5.  
   6. public class ByUserId { 
   7. public static void main(String[] args) {            
   8.       System.setProperty("webdriver.chrome.driver","webdriver\\chromedriver.exe");
   9.       WebDriver dr=new ChromeDriver();
   10.      dr.get("http://www.51.com"); 
   11.     WebElement element = dr.findElement(By.id("passport_51_user")); 
   12.     System.out.println(element.getAttribute("title")); 
   13.     }   
   14. } 

输出结果：

? 用户名/彩虹号/邮箱

#####3.1.3 使用name属性定位

51.com首页的帐号输入框的html代码如下：

  <input id="passport_51_user" type="text" value="" tabindex="1" title="用户名/彩虹号/邮箱"     name="passport_51_user"> 

使用name定位

     WebElement e = dr.findElement(By.name("passport_51_user")); 

#####3.1.4 使用XPath定位

? XPath即为XML路径语言，它是一种用来确定XML文档中某部分位置的语言。XPath基于XML的树状结构，提供在数据结构树中找寻节点的能力。

######xpath绝对与相对定位

// 绝对路径定位
driver.findElement(By.xpath("/html/body/div[2]/div[1]/div/div[1]/div/form/span[1]/input")）.send_keys("selenium")；
// 利用元素熟悉定位--定位到input标签中为kw的元素
driver.findElement(By.xpath("//input[@id='kw']").send_keys("Selenium")；
//定位input标签中name属性为wd的元素*
driver.findElement(By.xpath("//input[@name='wd']")).send_keys("Selenium")；
// 定位所有标签元素中，class属性为s_ipt的元素*
driver.findElement(By.xpath("//*[@class='s_ipt']")).send_keys("java")；

######Xpath层级与逻辑定位

// 层级和属性结合定位--首页输入用户和名密码

driver.findElement(By.xpath("//form[@id='loginForm']/ul/input[1]")).send_keys("test")；

driver.findElement(By.xpath("//form[@id='loginForm']/ul/input[2]")).send_keys("66666")；

 
// 逻辑运算组合定位

driver.findElement(By.xpath(("//input[@class='loinp' and @name='username']")).send_keys("test");

#####3.1.5 使用css属性定位

Selenium极力推荐使用CSS 定位，而不是XPath来定位元素，原因是CSS 定位比XPath 定速度快，语法也更加简洁。 常见用法：

1. find_element_by_css_selector（）
2. id id选择器，根据id属性来定位元素
3. .class class选择器，根据class属性值来定位元素
4. [attribute=‘value’] 根据属性来定位元素
5. element element 根据元素层级来定位 父元素>子元素

   System.setProperty("webdriver.chrome.driver","webdriver\\chromedriver.exe");  
   WebDriver driver=new ChromeDriver();
   driver.get("http://www.baidu.com")
  \\根据id来定位
  driver.findElement(By.cssSelector(('#kw')).send_keys("selenium");
  \\根据class定位
   driver.findElement(By.cssSelector(('.s_ipt').send_keys('selenium');
 \\通过属性来定位
  driver.findElement(By.cssSelector(("[autocomplete='off']")).send_keys("selenium");
 \\通过元素层级来定位
 driver.**find_element_by_css_selector**("form #login Form ul input").send_keys("selenium")

#####3.1.6 使用link属性定位

? link_text定位就是根据超链接文字进行定位。

例如百度首页：

1. import org.openqa.selenium.By; 
2. import org.openqa.selenium.WebDriver; 
3. import org.openqa.selenium.WebElement; 
4. import org.openqa.selenium.firefox.FirefoxDriver; 
5.  
6. public class ByUserId { 
7. public static void main(String[] args) {            
8.       System.setProperty("webdriver.chrome.driver","webdriver\\chromedriver.exe");
9.       WebDriver dr=new ChromeDriver();
10.      dr.get("http://www.51.com"); 
11.      dr.findElement(By.linkText("新闻")).click();           
12.      dr.findElement(By.partialLinkText("中国")).click();

####3.2 定位多个元素

上面提到findElements()方法可以返回一个符合条件的元素List组。看下面例子。

Java代码

   1. import java.util.List;   
   2. import org.openqa.selenium.By; 
   3. import org.openqa.selenium.WebDriver; 
   4. import org.openqa.selenium.WebElement; 
   5. import org.openqa.selenium.firefox.FirefoxBinary; 
   6. import org.openqa.selenium.firefox.FirefoxDriver;   
   7. public class FindElementsStudy { 
   
   8.     publicstaticvoid main(String[] args) { 
   9.      System.setProperty("webdriver.chrome.driver","webdriver\\chromedriver.exe");
   10          WebDriver driver=new ChromeDriver();  
   11         driver.get("http://www.51.com"); 
   12.        //定位到所有<input>标签的元素，然后输出他们的id 
   13.        List<WebElement> element = driver.findElements(By.tagName("input")); 
   14.         for (WebElement e : element){ 
   15.            System.out.println(e.getAttribute("id")); 
   16.         } 
   17.          
   18.         driver.quit(); 
   19.     } 
   20. } 

输出结果：

   1. passport_cookie_login 
   2. gourl 
   3. passport_login_from 
   4. passport_51_user 
   5. passport_51_password 
   6. passport_qq_login_2 
   7. btn_reg 
   8. passport_51_ishidden 
   9. passport_auto_login    

上面的代码返回页面上所有input对象。很简单，没什么可说的。

####3.3 层级定位

? 层级定位的思想是先定位父元素，然后再从父元素中精确定位出其我们需要选取的子元素。

? 层级定位一般的应用场景是无法直接定位到需要选取的元素，但是其父元素比较容易定位，通过定位父元素再遍历其子元素选择需要的目标元素，或者需要定位某个元素下所有的子元素。

? 下面的代码演示了如何使用层级定位class为"login"的div，然后再取得它下面的所有label，并打印出他们的文本

Java代码

   1. import java.io.File; 
   2. import java.util.List; 
   3. import org.openqa.selenium.By; 
   4. import org.openqa.selenium.WebDriver; 
   5. import org.openqa.selenium.WebElement; 
   6. import org.openqa.selenium.firefox.FirefoxBinary; 
   7. import org.openqa.selenium.firefox.FirefoxDriver; 
   8. public class LayerLocator {  
   9.     public static void main(String[] args) { 
   10.      
   11.      System.setProperty("webdriver.chrome.driver","webdriver\\chromedriver.exe");
   12.     WebDriver driver=new ChromeDriver();        
   13.         driver.get("http://www.51.com"); 
   14.          
   15.         //定位class为"login"的div，然后再取得它下面的所有label，并打印出他们的值 
   16.         WebElement element = driver.findElement(By.className("login")); 
   17.          List<WebElement> el = element.findElements(By.tagName("label")); 
   18.          for(WebElement e : el) 
   19.         System.out.println(e.getText());   
   20.     }      
   21. } 

输出结果：

   1. 帐号： 
   2. 密码： 
   3. 隐身 
   4. 下次自动登录