要點(diǎn)
DOM的簡(jiǎn)單介紹
DOM在QTP中使用的時(shí)機(jī)
DOM對(duì)象與IE對(duì)象模型的結(jié)合應(yīng)用
DOM在Web測(cè)試中的具體應(yīng)用
DOM在Web測(cè)試中的顯著優(yōu)勢(shì)
1.DOM(Document Object Model)
DOM是Document Object Model文檔對(duì)象模型的縮寫(xiě)。根據(jù)W3C DOM規(guī)范,DOM是一種與瀏覽器，平臺(tái)，語(yǔ)言無(wú)關(guān)的接口，使得你可以訪問(wèn)頁(yè)面其他的標(biāo)準(zhǔn)組件。簡(jiǎn)單理解，DOM解決了Netscape的Javascript和 Microsoft的Jscript之間的沖突，給予web設(shè)計(jì)師和開(kāi)發(fā)者一個(gè)標(biāo)準(zhǔn)的方法，讓他們來(lái)訪問(wèn)他們站點(diǎn)中的數(shù)據(jù)、腳本和表現(xiàn)層對(duì)像。
DOM是以層次結(jié)構(gòu)組織的節(jié)點(diǎn)或信息片斷的集合。這個(gè)層次結(jié)構(gòu)允許開(kāi)發(fā)人員在樹(shù)中導(dǎo)航尋找特定信息。分析該結(jié)構(gòu)通常需要加載整個(gè)文檔和構(gòu)造層次結(jié)構(gòu)，然后才能做任何工作。由于它是基于信息層次的，因而 DOM 被認(rèn)為是基于樹(shù)或基于對(duì)象的。
HTML DOM是HTML Document Object Model(文檔對(duì)象模型)的縮寫(xiě)，HTML DOM則是專(zhuān)門(mén)適用與HTML/XHTML的文檔對(duì)象模型。熟悉軟件開(kāi)發(fā)的人員可以將HTML DOM理解為網(wǎng)頁(yè)的API。它將網(wǎng)頁(yè)中的各個(gè)元素都看作一個(gè)個(gè)對(duì)象，從而使網(wǎng)頁(yè)中的元素也可以被計(jì)算機(jī)語(yǔ)言獲取或者編輯。 例如Javascript就可以利用HTML DOM動(dòng)態(tài)的修改網(wǎng)頁(yè)。
2.DOM在QTP中使用的時(shí)機(jī)
在使用QTP測(cè)試Web頁(yè)面時(shí)，首先需要加載Web插件，隨后QTP就可以順利地識(shí)別一些標(biāo)準(zhǔn)的控件，但有些時(shí)候網(wǎng)頁(yè)中存在一些特殊控件或者存在大量的相同控件時(shí)，可以嘗試使用DOM的方式來(lái)進(jìn)行控制，因?yàn)镼TP只對(duì)一些標(biāo)準(zhǔn)的控件支持比較好，而有些特殊的控件QTP無(wú)法識(shí)別，導(dǎo)致無(wú)法對(duì)其進(jìn)行操作。DOM是一種最底層的對(duì)象操作模型，使用它來(lái)控制對(duì)象不但速度快，而且可以訪問(wèn)很多QTP本身無(wú)法訪問(wèn)的東西。
(1)修改控件自身接口
此方法其實(shí)已經(jīng)在第一章里詳細(xì)講解過(guò)它的應(yīng)用，原理就是調(diào)用了DOM對(duì)象接口來(lái)修改控件的自身接口屬性，這也是QTP本身所無(wú)法做到的。在實(shí)際測(cè)試過(guò)程也是一個(gè)非常有用的技術(shù)，關(guān)鍵時(shí)刻可以使問(wèn)題迎刃而解。
(2)DOM對(duì)象下CurrentStyle對(duì)象應(yīng)用
CurrentStyle 是一個(gè)可以與HTML 對(duì)象元素的style sheets進(jìn)行交互的接口，它可以獲取對(duì)象元素的字體名、字體大小、顏色、是否可見(jiàn)等。在Web測(cè)試中真對(duì)一些特殊的界面驗(yàn)證點(diǎn)時(shí)能夠發(fā)揮出很大的作用。
(3)性能提升
對(duì)于性能來(lái)說(shuō)，DOM的執(zhí)行速度會(huì)比QTP的對(duì)象庫(kù)執(zhí)行速度快上好幾倍，這是因?yàn)镈OM相當(dāng)于底層的對(duì)象接口，而QTP首先需要把對(duì)象屬性進(jìn)行封裝，然后在腳本運(yùn)行時(shí)調(diào)用對(duì)象庫(kù)中的對(duì)象，最后與頁(yè)面上的對(duì)象進(jìn)行比對(duì)，如果屬性匹配才可控制測(cè)試對(duì)象。而DOM卻是直接找對(duì)象進(jìn)行控制。所以，性能上相對(duì)于QTP的對(duì)象庫(kù)有很大的提升，不過(guò)此優(yōu)勢(shì)一般只有在大量的相同對(duì)象或者一些特殊情況的時(shí)候才能有明顯的區(qū)別。
注意：使用DOM時(shí)也需要注意一點(diǎn)，雖然DOM有很多優(yōu)勢(shì)，但是也不要過(guò)分依賴(lài)DOM，對(duì)象庫(kù)才是QTP的核心，過(guò)分使用DOM會(huì)導(dǎo)致腳本維護(hù)方面相對(duì)比較繁瑣，畢竟對(duì)象庫(kù)維護(hù)起來(lái)是最方便的。
(1)修改控件自身接口
此方法其實(shí)已經(jīng)在第一章里詳細(xì)講解過(guò)它的應(yīng)用，原理就是調(diào)用了DOM對(duì)象接口來(lái)修改控件的自身接口屬性，這也是QTP本身所無(wú)法做到的。在實(shí)際測(cè)試過(guò)程也是一個(gè)非常有用的技術(shù)，關(guān)鍵時(shí)刻可以使問(wèn)題迎刃而解。
(2)DOM對(duì)象下CurrentStyle對(duì)象應(yīng)用
CurrentStyle 是一個(gè)可以與HTML 對(duì)象元素的style sheets進(jìn)行交互的接口，它可以獲取對(duì)象元素的字體名、字體大小、顏色、是否可見(jiàn)等。在Web測(cè)試中真對(duì)一些特殊的界面驗(yàn)證點(diǎn)時(shí)能夠發(fā)揮出很大的作用。在后續(xù)的章節(jié)中會(huì)詳細(xì)對(duì)其進(jìn)行分析講解。
(3)性能提升
對(duì)于性能來(lái)說(shuō)，DOM的執(zhí)行速度會(huì)比QTP的對(duì)象庫(kù)執(zhí)行速度快上好幾倍，這是因?yàn)镈OM相當(dāng)于底層的對(duì)象接口，而QTP首先需要把對(duì)象屬性進(jìn)行封裝，然后在腳本運(yùn)行時(shí)調(diào)用對(duì)象庫(kù)中的對(duì)象，最后與頁(yè)面上的對(duì)象進(jìn)行比對(duì)，如果屬性匹配才可控制測(cè)試對(duì)象。而DOM卻是直接找對(duì)象進(jìn)行控制。所以，性能上相對(duì)于QTP的對(duì)象庫(kù)有很大的提升，不過(guò)此優(yōu)勢(shì)一般只有在大量的相同對(duì)象或者一些特殊情況的時(shí)候才能有明顯的區(qū)別，這個(gè)也會(huì)在后續(xù)章節(jié)詳細(xì)進(jìn)行講解。
3.DOM對(duì)象與IE對(duì)象模型的結(jié)合應(yīng)用
(1)利用DOM操作測(cè)試對(duì)象
'使用IE COM啟動(dòng)IE
Set oIE=CreateObject("InternetExplorer.Application")
oIE.Visible=True '設(shè)置可見(jiàn)
oIE.Navigate "http://www.baidu.com" '跳轉(zhuǎn)URL
'等待IE頁(yè)面加載完畢
While oIE.Busy
Wend
'獲取Document對(duì)象
Set oDoc=oIE.Document
'使用DOM對(duì)測(cè)試對(duì)象進(jìn)行操作
With oDoc
'輸入框輸入
.getElementByID("kw").value="谷歌"
'點(diǎn)擊搜索按鈕
.getElementByID("su").Click
End With
Set oDoc=Nothing
Set oIE=Nothing |
上面這個(gè)例子是通過(guò)getElementByID方法獲取定位對(duì)象，除此之外還能通過(guò)getElementByName和getElementByTagName方法來(lái)獲取定位對(duì)象。
(2)利用FORM名來(lái)獲取對(duì)象元素
'使用IE COM啟動(dòng)IE
Set oIE=CreateObject("InternetExplorer.Application")
oIE.Visible=True '設(shè)置可見(jiàn)
oIE.Navigate http://www.baidu.com '跳轉(zhuǎn)URL
'等待IE頁(yè)面加載完畢
While oIE.Busy
Wend
'獲取Document對(duì)象
Set oDoc=oIE.Document
'獲取FORM名為f下名為wd的元素并輸入
oDoc.f.wd.value="谷歌"
oDoc.f.su.Click
Set oDoc=Nothing
Set oIE=Nothing
(3)訪問(wèn)Web頁(yè)面的Script腳本變量
'使用IE COM啟動(dòng)IE
Set oIE=CreateObject("InternetExplorer.Application")
oIE.Visible=True '設(shè)置可見(jiàn)
oIE.Navigate http://www.baidu.com '跳轉(zhuǎn)URL
'等待IE頁(yè)面加載完畢
While oIE.Busy
Wend
'獲取Document對(duì)象
Set oDoc=oIE.Document
'獲取搜索框
Set oEdit=oDoc.parentWindow.k
'并對(duì)其進(jìn)行輸入
oEdit.value="谷歌"
'獲取FORM名為f下名為su的元素并點(diǎn)擊
oDoc.f.su.Click
Set oDoc=Nothing
Set oIE=Nothing |
這一部分主要介紹了利用IE的COM以及HTML DOM來(lái)自動(dòng)化IE瀏覽器，以及對(duì)瀏覽器的一些控件對(duì)象進(jìn)行自動(dòng)化的操作，包括啟動(dòng)IE、等待頁(yè)面加載、遍歷所有IE窗口、利用DOM操作測(cè)試對(duì)象、利用FORM名來(lái)獲取對(duì)象元素、訪問(wèn)Web頁(yè)面的Script腳本變量、Browser對(duì)象轉(zhuǎn)化Window窗口對(duì)象、自定義瀏覽器應(yīng)用程序，這些方法對(duì)于我們?cè)谧詣?dòng)化測(cè)試中也是起到比較重要的作用，并且能夠輔助我們更好地完成Web自動(dòng)化測(cè)試，當(dāng)QTP不能達(dá)到我們想要達(dá)到的目的時(shí)，就可以使用這些方法來(lái)代替或者說(shuō)來(lái)實(shí)現(xiàn)需要實(shí)現(xiàn)的方法，最終使Web自動(dòng)化測(cè)試變得更加的輕松和容易。
4.DOM在WEB測(cè)試中的應(yīng)用
當(dāng)編寫(xiě)QTP腳本時(shí)，首先該做的就是將需要控制的測(cè)試對(duì)象添加到對(duì)象庫(kù)，添加完畢后即可使用QTP的封裝方法來(lái)控制測(cè)試對(duì)象。
如果需要在QTP中訪問(wèn)DOM，就只需要使用Page對(duì)象，并調(diào)用Page對(duì)象的Object封裝屬性，QTP就能訪問(wèn)到頂層DOM對(duì)象。
QTP中訪問(wèn)DOM對(duì)象的方法：
Browser("micClass:=Browser").Page("micClass:=Page").Object
此處的Object屬性目前只支持IE，通過(guò)DOM，可以在QTP中修改HTML元素對(duì)象的屬性，調(diào)用其方法，當(dāng)在使用Web測(cè)試對(duì)象的Object屬性時(shí)，事實(shí)上就已經(jīng)自動(dòng)獲取到DOM對(duì)象的一個(gè)引用，這就意味著可以調(diào)用測(cè)試對(duì)象的DOM引用下的所有的屬性、方法。
實(shí)例1：以百度首頁(yè)為例
Set oDocument=Browser("micClass:=Browser").Page("micClass:=Page").Object
oDocument.getElementByID("kw").value="谷歌"
oDocument.getElementByID("su").Click
實(shí)例2：以百度高級(jí)搜索為例，www.baidu.com/gaoji/advanced.html
'QTP中使用DOM控制各類(lèi)HTML元素
'獲取DOM對(duì)象
Set oDocument=Browser("micClass:=Browser").Page("micClass:=Page").Object
Set allWebEdits=oDocument.getElementsByTagName("INPUT")
For each oWebEdit in allWebEdits
oWebEdit.value="谷歌"
Next |
5.DOM在WEB測(cè)試中的顯著優(yōu)勢(shì)
利用DOM完成QTP無(wú)法完成的任務(wù)
使用CurrentStyle驗(yàn)證對(duì)象
HTML源碼：
<style>
.class_visible{visibility:"visible"}
.class_hidden{visibility:"hidden"}
</style>
<div class=class_hidden id="ID_001">
<p>DHTML using DISPLAY</p>
</div>
QTP中代碼：
Set oElementDocument=Browser("micClass:=Browser").Page("micClass:=Page").WebElement("html id:=ID_001").Object
isVisible=oElementDocument.currentstyle.visibility
If isVisible="hidden" Then
msgbox "object is hidden"
Else
msgbox "object is visible"
End If |
此處如果用QTP的Exist方法，結(jié)果永遠(yuǎn)返回True。因?yàn)榇藢?duì)象的確是存在于網(wǎng)頁(yè)中，但是被設(shè)置了不可見(jiàn)，而Exist方法只能驗(yàn)證對(duì)象是否存在，卻不能驗(yàn)證是否隱藏。
而Document對(duì)象下的currentstyle可以直接訪問(wèn)style sheets。
利用DOM提升性能
當(dāng)對(duì)象較多時(shí)，使用DOM較為占優(yōu)勢(shì)，數(shù)量越多越明顯，比如有1000個(gè)文本框的HTML頁(yè)面，每個(gè)文本框的name屬性都由text_開(kāi)頭，之后由1到1000遞增，腳本如下：
<html>
<head>
<script language="vbscript">
function msg
for i=1 to 1000
tt=tt+"<input type='text' name='text_"+cstr(i)+"'>"
next
Document.getElementByID("aaa").innerHTML=tt
end function
</script>
</head>
<body>
<input type="button" value="click it" onclick="msg">
<div id="aaa"></div>
</body>
</html> |
把以上腳本保存成HTML，打開(kāi)此HTML，點(diǎn)擊按鈕生成1000個(gè)文本輸入框。比較QTP描述性編程和DOM操作腳本的性能。
QTP描述性編程腳本：
Services.StartTransaction "inputvalue"
For i=1 to 1000
Browser("micClass:=Browser").Page("micClass:=Page").WebEdit("name:=text_"+cstr(i)).Set "value"+cstr(i)
Next
Services.EndTransaction "inputvalue" |
結(jié)果：
DOM操作腳本：
Services.StartTransaction "inputvalue"
For i=1 to 1000
Browser("micClass:=Browser").Page("micClass:=Page").Object.getElementsByName("text_"+cstr(i))(0).value="value"+cstr(i)
Next
Services.EndTransaction "inputvalue" |
結(jié)果：
