webdriver(python) 学习笔记三

知识点：简单的对象定位

对象的定位应该是自动化测试的核心，要想操作一个对象，首先应该识别这个对象。一个对象就是一个人一样，他会有各种的特征（属性），如比我们可以通过一个人的身份证号，姓名，或者他住在哪个街道、楼层、门牌找到这个人。

定位对象的目的一般有下面几种

操作对象
获得对象的属性，如获得测试对象的class属性，name属性等等
获得对象的text
获得对象的数量

webdriver提供了一系列的对象定位方法，常用的有以下几种

id
name
class name
link text
partial link text
tag name
xpath
css selector

html代码 form.html

<html>
    <head>
      <meta http-equiv="content-type" content="text/html;charset=utf-8" />
      <title>Form</title>
      <script type="text/javascript" async="" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
      <link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet" />
      <script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
    </head>
    <body>
      <h3>simple login form</h3>
      <form class="form-horizontal">
        <div class="control-group">
          <label class="control-label" for="inputEmail">Email</label>
          <div class="controls">
            <input type="text" id="inputEmail" placeholder="Email" name="email">
          </div>
        </div>
        <div class="control-group">
          <label class="control-label" for="inputPassword">Password</label>
          <div class="controls">
            <input type="password" id="inputPassword" placeholder="Password" name="password">
          </div>
        </div>
        <div class="control-group">
          <div class="controls">
            <label class="checkbox">
              <input type="checkbox"> Remember me
            </label>
            <button type="submit" class="btn">Sign in</button>
            <a href="#">register</a>
          </div>
        </div>
      </form>
    </body>
  </html>

以上述代码为例，学习各种对象定位方法。

python代码 test1.py

#coding=utf-8

from selenium import webdriver
from time import sleep
import os

if 'HTTP_PROXY' in os.environ:del os.environ('HTTP_PROXY')

dr=webdriver.Firefox()

file_path='file:///'+os.path.abspath('form.html')

print file_path

dr.get(file_path)

#by id
dr.find_element_by_id('inputEmail').click()

#by name
dr.find_element_by_name('password').click()

#by tagname
print dr.find_element_by_tag_name('form').get_attribute('class')

#by class_name
e=dr.find_element_by_class_name('controls')
dr.execute_script('$(arguments[0]).fadeOut().fadeIn()',e)
sleep(1)

# by link text
link = dr.find_element_by_link_text('register')
dr.execute_script('$(arguments[0]).fadeOut().fadeIn()', link)
sleep(1)

# by partial link text
link = dr.find_element_by_partial_link_text('reg')
dr.execute_script('$(arguments[0]).fadeOut().fadeIn()', link)
sleep(1)

# by css selector
div = dr.find_element_by_css_selector('.controls')
dr.execute_script('$(arguments[0]).fadeOut().fadeIn()', div)
sleep(1)

# by xpath
dr.find_element_by_xpath('/html/body/form/div[3]/div/label/input').click()

sleep(2)
dr.quit()

上面例子里由于html文件中引用了jquery，所以在执行js时可以使用jquery的$()及fadeIn()等方法。如果你测试的页面没用包含jquery的话，这些方法是无效的。

再以百度搜索为例学习定位。

#coding=utf-8

from selenium import webdriver
import time

browser = webdriver.Firefox()

browser.get("http://www.baidu.com")
time.sleep(2)

#########百度输入框的定位方式##########

#通过id方式定位
browser.find_element_by_id("kw").send_keys("selenium")

#通过name方式定位
browser.find_element_by_name("wd").send_keys("selenium")

#通过tag name方式定位
browser.find_element_by_tag_name("input").send_keys("selenium")

#通过class name 方式定位
browser.find_element_by_class_name("s_ipt").send_keys("selenium")

#通过CSS方式定位
browser.find_element_by_css_selector("#kw").send_keys("selenium")

#通过xphan方式定位
browser.find_element_by_xpath("//input[@id='kw']").send_keys("selenium")

############################################

browser.find_element_by_id("su").click()
time.sleep(3)
browser.quit()

以每一项为例，具体学习。

id和name

它两个是最常用的定位方式，控件一般都会有这两项，而且取的名字也比较有意义。通过这两项个属性可以直接查找页面上的元素。

通过firebug工具，可以看到百度搜索输入框的源码如下：

<input id="kw" class="s_ipt" type="text" maxlength="100" name="wd" autocomplete="off">

id="kw"

通过find_element_by_id("kw") 函数可以捕获到百度输入框

name="wd"

通过find_element_by_name("wd")函数可以捕获百度输入框

tag name和class name

<input>

为标签名，可以通过find_element_by_tag_name("input")获取

class="s_ipt"

为class名，可以通过find_element_by_class_name("s_ipt")获取

但是如果遇到标签名或class名重复，则就无法使用这两项。如下面的一组控件：

<th width="95"></th>
<th width="">文件名</th>
<th class="c1">创建时间</th>
<th class="c1">状态</th>
<th class="c1">文件大小</th>
<th class="c1">时长</th>

CSS定位

CSS是一种语言，它被用来描述HTML和XML文档的表现。CSS使用选择器来为页面元素绑定属性。这些选择器可以被selenium用作另外的定位策略。

CSS的比较灵活可以选择控件的任意属性，上面的例子中：

取id属性

find_element_by_css_selector("#kw")

通过find_element_by_css_selector( )函数，选择取百度输入框的id属性来定义

也可以取name属性

<a href="http://news.baidu.com" name="tj_news">新 闻</a>

driver.find_element_by_css_selector("a[name="tj_news"]").click()

可以取title属性

<a onclick="queryTab(this);" mon="col=502&pn=0" title="web" href="http://www.baidu.com/">网页</a>

driver.find_element_by_css_selector("a[title="web"]").click()

也可以是取..:

<a class="RecycleBin xz" href="javascript:void(0);">

driver.find_element_by_css_selector("a.RecycleBin").click()

扩展阅读：

http://www.w3.org/TR/css3-selectors/

http://www.w3school.com.cn/css/css_positioning.asp

xpath

什么是XPath：http://www.w3.org/TR/xpath/

XPath基础教程：http://www.w3schools.com/xpath/default.asp

selenium中被误解的XPath ： http://magustest.com/blog/category/webdriver/

XPath是一种在XML文档中定位元素的语言。因为HTML可以看做XML的一种实现，所以selenium用户可是使用这种强大语言在web应用中定位元素。

XPath扩展了上面id和name定位方式，提供了很多种可能性，比如定位页面上的第三个多选框。

xpath:attributer （属性）

driver.find_element_by_xpath("//input[@id='kw']").send_keys("selenium")

#input标签下id =kw的元素

 

xpath:idRelative （id相关性）

driver.find_element_by_xpath("//div[@id='fm']/form/span/input").send_keys("selenium")

#在/form/span/input 层级标签下有个div标签的id=fm的元素

driver.find_element_by_xpath("//tr[@id='check']/td[2]").click() 

# id为'check' 的tr ，定闪他里面的第2个td

 

xpath:position （位置）

driver.find_element_by_xpath("//input").send_keys("selenium") 

driver.find_element_by_xpath("//tr[7]/td[2]").click()

#第7个tr 里面的第2个td

 

xpath: href （水平参考）

driver.find_element_by_xpath("//a[contains(text(),'网页')]").click()

#在a标签下有个文本（text）包含（contains）'网页' 的元素

 

xpath:link

driver.find_element_by_xpath("//a[@href='http://www.baidu.com/']").click()

#有个叫a的标签，他有个链接href='http://www.baidu.com/ 的元素

link

文字链接时使用。

#coding=utf-8

from selenium import webdriver
import time

browser = webdriver.Firefox()

browser.get("http://www.baidu.com")
time.sleep(2)
    
browser.find_element_by_link_text("新闻").click()
time.sleep(2)
browser.quit()

partial link text

通过部分链接来定位。只用链接的一部分文字定位。

browser.find_element_by_partial_link_text("新").click()

#通过find_element_by_partial_link_text() 函数，我只用了“新”字，脚本一样找到了"新闻" 的链接

百度首页如果文字链接有“图片”、“地图”，同样使用此操作，未定位出元素。