鑒於很多新手測試(UI自動化小白)對如何獲取和驗證XPath一無所知一頭霧水,
特地寫此篇文章分享下最簡單的獲取xpath和驗證xpath正確不正確的方法。
.
.
一、如何獲取XPath
1、准備工作
電腦一台(包括左右鍵正常的鼠標)
電腦上有谷歌瀏覽器(火狐瀏覽器也可以哦)
測試員(視力正常,十指健全)
2、操作步驟
2.1打開瀏覽器,進入你要獲取元素的網頁,找到你要獲取的元素,右鍵點擊之后選擇檢查
這里用騰訊網為例,例如你想獲取【習大大出席歡迎儀式】這個文本的XPath,
那么需要做的就是右鍵點擊它,然后選擇檢查;
可以看到,頁面下方出現了一個工具欄,它就是chrome瀏覽器的開發者工具,默認顯示的是Elements這個標簽頁
還可以看到,有一行已經被置灰的,沒錯,那個就是你想獲取的元素的html代碼
2.2接下來,你需要做的就是在這行html代碼上繼續點擊右鍵,選擇Copy,選擇Copy XPath
2.3 找個地方粘貼就完事啦
復制到的xpath為://*[@id=“tab-news-01”]/ul[1]/li[2]/a[1]
.
.
.
二、如何驗證XPath
有時候直接復制的xpath太長了,或者不合適(怎么個不合適,又是另一個話題,等我找時間另開一篇),想用自己寫的。
那么,問題又來了,怎么驗證自己寫的xpath能定位到元素么?
請聽我慢慢道來……
1、准備工作
電腦一台(包括左右鍵正常的鼠標,還有正常使用的鍵盤)
電腦上有谷歌瀏覽器
測試員(視力正常,十指健全)
2、操作步驟
2.1打開瀏覽器,進入你要獲取元素的網頁,按下F12
(或者ctrl+shift+I(i的大寫),如果不嫌麻煩,我還是喜歡F12),當然,隨便找個元素點右鍵檢查也是可以的。
可以看到,頁面下方出現了一個工具欄,沒錯,又是它,chrome瀏覽器的開發者工具,這次它默認顯示的是Network這個標簽頁
2.2 切換到Elements標簽,然后按下ctrl+F
這時候,細心並且視力正常的你就會觀察到,Elements標簽的最下面出現了一條輸入框,通過提示你也可以知道輸入框可以通過字符串、CSS選擇器和Xpath進行搜索
2.3 接下來就是把你自己寫的xpath粘貼進去,然后回車就可以啦
這里還是用騰訊網,用上面的教程復制的xpath進行驗證
可以看到,頁面和Elements標簽中的代碼都高亮顯示出了找到的相應的元素
並且輸入框的最后面的【1 of 1】,后面的1表示找到了多少個,前面的1表示當前高亮的是第幾個。
咱們修改下xpath看看下圖,現在找到了4個a標簽的元素,高亮的是第二個。
怎么樣,你學會了么?
不會的話可以在評論區說哪里看不明白,我繼續修改下教程。