|
進(jìn)行Web頁(yè)面自動(dòng)化測(cè)試，對(duì)頁(yè)面上的元素進(jìn)行定位和操作是核心。而操作又是以定位為前提的，因此，對(duì)頁(yè)面元素的定位是進(jìn)行自動(dòng)化測(cè)試的基礎(chǔ)。
頁(yè)面上的元素就像人一樣，有各種屬性，比如元素名字，元素id，元素屬性（class屬性，name屬性）等等。webdriver就是利用元素的這些屬性來(lái)進(jìn)行定位的。
可以用于定位的常用的元素屬性：
- id
- name
- class name
- tag name
- link text
- partial link text
- xpath
- css selector
對(duì)應(yīng)于webdriver中的定位方法分別是：
- driver.find_element_by_name()——最常用，簡(jiǎn)單
- driver.find_element_by_id()——最常用，簡(jiǎn)單
- driver.find_element_by_class_name()
- driver.find_element_by_tag_name()——最不靠譜
- driver.find_element_by_link_text()——定位文字連接好用
- driver.find_element_by_partial_link_text()——定位文字連接好用
- driver.find_element_by_xpath()——最靈活，萬(wàn)能
- driver.find_element_by_css_selector()
上面是定位一個(gè)元素的方法，相應(yīng)的webdriver也有定位一組元素的方法：
- driver.find_elements_by_name()
- driver.find_elements_by_id()
- driver.find_elements_by_class_name()
- driver.find_elements_by_tag_name()
- driver.find_elements_by_link_text()
- driver.find_elements_by_partial_link_text()
- driver.find_elements_by_xpath()
- driver.find_elements_by_css_selector()
那么問(wèn)題來(lái)了？怎么查看元素的name，id，class，tag，text，xpath，css選擇器呢？可以借助firefox瀏覽器的firebug插件（需要手動(dòng)安裝）中firepath工具或者chrome的開(kāi)發(fā)者工具（chrome自帶）。
打開(kāi)firefox 瀏覽器的firebug 插件，點(diǎn)擊插件左上角的鼠標(biāo)箭頭，再點(diǎn)擊頁(yè)面上的元素，firebug插件的HTML 標(biāo)簽頁(yè)將看到頁(yè)面代碼，鼠標(biāo)移動(dòng)到元素的標(biāo)簽上點(diǎn)擊一下。例如我們點(diǎn)擊百度首頁(yè)的“百度一下”按鈕：
從FirePath中可以看到該元素的id，tag，class等屬性。
- Chrome開(kāi)發(fā)者工具（F12）
打開(kāi)Chrome瀏覽器，按下鍵盤(pán)的F12，即可以打開(kāi)開(kāi)發(fā)者工具。從開(kāi)發(fā)者工具中可以得到和FirePath相同的結(jié)果：
那么問(wèn)題又來(lái)了，這么多屬性都可以用來(lái)定位，那么我們選擇哪種呢？其實(shí)，定位元素的方法沒(méi)有好壞之分，不同的場(chǎng)景有不同的適用方法，只要定位的唯一的一個(gè)元素的方法都是可以使用的。
這是簡(jiǎn)單的高效的方法。
比如定位百度首頁(yè)文本框的方法，我們可以使用id來(lái)定位（該元素提供的id屬性，可以唯一定位到它）：
driver.find_element_by_id('kw')
定位百度首頁(yè)右上角的“設(shè)置”鏈接，我們可以使用name來(lái)定位（該元素提供的name屬性，可以唯一定位到它）： driver.find_element_by_name('tj_trnews')
不是所有的前端開(kāi)發(fā)人員都喜歡為每一個(gè)元素添加id 和name 兩個(gè)屬性，但除此之外你一定發(fā)現(xiàn)了一個(gè)元素不單單只有id 和name，它還有class 屬性；而且每個(gè)元素都會(huì)有tag標(biāo)簽。 還是定位百度首頁(yè)的文本框，除了用id方法定位之外，我們還可以用class name來(lái)定位（該元素提供的class屬性，也可以唯一定位到它）。
driver.find_element_by_class_name("s_ipt")
tag name 定位應(yīng)該是所有定位方式中最不靠譜的一種了，因?yàn)樵谝粋€(gè)頁(yè)面中具有相同tag name 的元素極其容易出現(xiàn)，很少具有唯一性。不用學(xué)習(xí)它了。
- link text 與partial link text 定位
有時(shí)候需要操作的元素是一個(gè)文字鏈接，那么我們可以通過(guò)link text 或partial link text 進(jìn)行元素定位。
比如，定位百度首頁(yè)右上角的“新聞”，“hao123”，。。。。等等這些文字連接。就可以使用link text和partail link text定位方式?？梢韵仁褂肍ireBug看下網(wǎng)頁(yè)源碼：
通過(guò)linx text定位：
find_element_by_link_text("新聞") find_element_by_link_text("貼吧")
通過(guò)partail link text定位： find_element_by_link_text("新") find_element_by_link_text("貼")
XPath是一種文檔定位語(yǔ)言。因?yàn)镠TML可以看做是XML的一種實(shí)現(xiàn)，所以selenium用戶(hù)可使用這種強(qiáng)大的語(yǔ)言在web應(yīng)用中定位。 絕對(duì)路徑方法：
從根元素寫(xiě)起，當(dāng)元素層級(jí)很深的時(shí)候，路徑寫(xiě)的會(huì)很長(zhǎng)，閱讀性不好，也很難維護(hù)。不建議使絕對(duì)路徑這樣的方法。
相對(duì)路徑方法：
通過(guò)Firebug很容易得到相對(duì)路徑的xpath，打開(kāi)Firebug插件，在頁(yè)面上的搜索文本框，就可以顯示出xpath了：
<pre name="code" class="python">driver.find_element_by_xpath("http://*[@id='kw']").click()
上面的寫(xiě)法可以理解為，通過(guò)xpath尋找，任意（*代表）id屬性為’kw‘的元素。當(dāng)然我們也可以把*替換成input，即： driver.find_element_by_xpath("http://input[@id='kw']").click()
這種寫(xiě)法可以理解為，通過(guò)xpath尋找，任意id屬性為’kw‘的input元素。
有的時(shí)候，需要根據(jù)上級(jí)目錄的屬性來(lái)定位當(dāng)前元素： find_element_by_xpath("http://span[@id=’input-container’]/input") #通過(guò)上一級(jí)目錄的id 屬性定位 find_element_by_xpath("http://div[@id=’hd’]/form/span/input") #通過(guò)上三級(jí)目錄的id 屬性定位 find_element_by_xpath("http://div[@name=’q’]/form/span/input")#通過(guò)上三級(jí)目錄的name 屬性定位
這種定位方法是比較難理解的。TBD，當(dāng)前工作中也沒(méi)有遇到，必須使用這種方式才能定位到元素的情況。
- 關(guān)于自動(dòng)化的定位問(wèn)題
自動(dòng)化測(cè)試的元素定位一直是困擾自動(dòng)化測(cè)試新手的一個(gè)障礙，因?yàn)槲覀冊(cè)谧詣?dòng)化實(shí)施過(guò)程中會(huì)碰到各式各樣的對(duì)象元素。雖然XPath 和CSS 可以定位到復(fù)雜且比較難定位的元素，但相比較用id 和name 來(lái)說(shuō)增加了維護(hù)成本和學(xué)習(xí)成本，相比較來(lái)說(shuō)id/name 的定位方式更直觀和可維護(hù)，有新的成員加入的自動(dòng)化時(shí)也增加了人員的學(xué)習(xí)成本。所以，測(cè)試人員在實(shí)施自動(dòng)化測(cè)試時(shí)一定要做好溝通，規(guī)范前端開(kāi)發(fā)人員對(duì)元素添加id/name 屬性，或者自己有修改HTML 代碼的權(quán)限。 |
