appium01:appium定位H5頁面元素
阿新 • • 發佈:2019-01-25
目錄
[TOC]
# 擴充套件連線
https://blog.csdn.net/galen2016/article/details/53534366
# 一、 移動端的應用
在手機移動端,支援3種應用格式:Native應用、Web應用以及Hybird應用。
## 1.1 Native應用
Native,是安卓手機的原生應用,可以理解為普通的app;
## 1.2 Web應用
Web應用依託於瀏覽器展示,也就是我們所說的網頁;
## 1.3 Hybird應用
Hybird應用是介於Native和Web應用之間的應用模式,在Native應用中嵌入web頁面實現應用展示介面的個性化定製,也就是在應用中嵌入H5程式,比較常見的有微信小程式等,這些H5頁面再移動端通過Webview(Android提供的顯示網頁的系統控制元件 )訪問。通過uiautomatorviewer在定位元素時,只有一個UI WebView的介面,無法獲取元素細節,如圖1.1所示。
# 二、 Hybird應用H5元素獲取
## 2.1 思路
獲取Native應用的嵌入的H5頁面的元素,可以通過獲取該頁面的URL地址,然後在web端利用chrome瀏覽器,獲取該控制元件的定位語句,即可完成H5頁面元素的定位。
## 2.2 步驟
### 2.2.1 識別app中的H5檢視
識別app中的H5檢視,可以開啟手機的開發者模式,然後在開發者選項中開啟顯示佈局邊界的開關,開啟開關之後,app的各個應用的元件的邊界就會顯示出來。如果是H5介面,可以看到,如下檢視(圖2.2)
,安裝這個工具後,需要安裝WebviewDebugHook這個模組才能正常使用
需要注意,VirtualXposed是才釋出的一個軟體,可能有一些bug。VirtualXposed這個模組自帶了root環境,可以在非root的環境下執行Xposed,免去了手機root的麻煩,其下載地址如下https://github.com/android-hacker/VirtualXposed/releases,WebviewDebugHook的github地址如下https://github.com/feix760/WebViewDebugHook。上述兩個軟體都只需要下載apk包即可(如果使用Xposed,按安卓版本不同,會有兩個版本的Xposed安裝,在點選進入WebViewDebugHook的github下載地址後,在幫助文件中,有給適用於較低版本的Xposed的安裝地址http://repo.xposed.info/module/de.robv.android.xposed.installer,高版本地址在連結中有給出http://forum.xda-developers.com/showthread.php?t=3034811。)。需要注意的是,安裝了VirtualXposed之後,進入軟體後,VirtualXposed,會發現自動安裝了Xposed,而在安裝軟體時,會有兩個安裝選項,一個是VirtualXposed,一個是安卓系統上,對於上面提到的WebViewDebugHook模組,以及我們所需要使用的應用,都需要安裝到VirtualXposed中。安裝好應用後,如下圖所示:
**注意:** 對於騰訊系的應用(比如微信,預設使用的是X5核心),不是谷歌瀏覽器的核心,在使用Xposed+WebviewDebugHook的情況下(對於使用開啟webview的debug屬性的工程包或者VirtualXposed的環境,暫時不知道解決辦法),需要在手機根目錄下建立一個debug.conf目錄文字內容如下:
如果是H5介面,可以看到,如下檢視。
result_QProxy=false
result_systemWebviewForceUsed=true
setting_forceUseSystemWebview=true
③ 電腦安裝谷歌瀏覽器,在瀏覽器中輸入chorome://inspect/#devices,如下圖所示,可以顯示對應的H5頁面的url地址,但是顯示手機客戶端的url地址,需要進行一些設定:
a)電腦需要能翻牆
b) 如果電腦翻牆後,仍然沒有顯示對應app的url,需要修改C:\Windows\System32\drivers\etc\hosts
61.91.161.217 chrome-devtools-frontend.appspot.com
61.91.161.217 chrometophone.appspot.com
conf = ConfigParser()
conf.read("app.conf")
desired_caps_right = eval(conf.get("app", "desired_caps_right"))
driver = webdriver.Remote("http://127.0.0.1:4723/wd/hub", desired_caps_right)
time.sleep(5)
def getSize():
x = driver.get_window_size()['width']
y = driver.get_window_size()['height']
return (x, y)
try:
time.sleep(3)
winSize = getSize()
x1 = int(winSize[0] * 0.5)
y1 = int(winSize[1] * 0.9)
y2 = int(winSize[1] * 0.1)
# 不能加時間,加了會有點選操作
driver.swipe(x1, y1, x1, y2)
time.sleep(1)
# 找到檸檬班app位置,進入檸檬班app
app_ele = driver.find_elements_by_id("io.va.exposed:id/icon")[0]
app_ele.click()
time.sleep(5)
# 點選進入全程班
qcb_ele = driver.find_element_by_xpath("//android.widget.TextView[@text=\'全程班\']")
qcb_ele.click()
time.sleep(3)
# 列印contexts
print(driver.contexts)
except Exception as e:
print(e)
finally:
driver.quit()
contexts列印下圖所示(其 **格式為WEBVIRE_context名稱**),該H5頁面的context就是最後一項,需要注意的是,獲取H5頁面的context需要開發輔助進行一些設定,設定方式如下:
①需要開發在打包時,開啟webview的debug屬性setWebContentDebuggingEnabled(true);(這一步是獲取url的必須項)
②如果在手機模擬器中,可以列印該webview介面的context,但是在真機上沒有,此時,手機需要root;(如果使用了VirtualXposed,自帶root環境,也不需要進行設定)
![圖2.4 contexts列印結果](https://i.loli.net/2018/04/14/5ad203f15736a.png)
### 2.2.4 操作H5檢視介面元素
獲取到Hybird應用H5頁面的context後,可以通過driver.switch_to.context(“webview名”)進入H5頁面的context,之後就可以在這個介面,通過web頁面的定位方式對H5頁面的元素進行操作,由於web頁面,針對瀏覽器不同,會需要不同的驅動程式,非騰訊系應用,使用的是安卓自帶的谷歌瀏覽器解析以及渲染頁面的H5元素,所以需要安裝一個對應版本的谷歌驅動,將這個chromedriver放在appium安裝目錄下的\node_modules\appium\node_modules\appium-chromedriver\chromedriver\win下。(我的安卓系統核心谷歌瀏覽器為53版本,對應的驅動為2.23版本,各版本谷歌瀏覽器對應驅動版本如下:https://blog.csdn.net/huilan_same/article/details/51896672),總結檢視手機對應的谷歌瀏覽器版本有如下方法:
① 在chrome://inspect/#devices中可以檢視手機谷歌瀏覽器的版本;
![圖2.5 在谷歌瀏覽器中顯示手機谷歌瀏覽器版本](https://i.loli.net/2018/04/14/5ad20572508f1.png)
② (注意:這一操作在實操中並未找到) 在appium控制檯中可以顯示當前系統webview的版本(搜尋Webview version關鍵字,結果如圖2.6所示);
三、 appium操作H5元素程式碼示例
driver = webdriver.Remote('http://127.0.0.1:4723/wd/hub', desired_caps)
driver.implicitlt_wait(30)
# 前期操作,進入H5檢視介面
prep_ele = driver.find_element_by_xpath('//android.,widget.TextView[@text=\"全程班\"]')
prep_ele .click()
time.sleep(5)
# 列印H5介面的上下文
contexts = driver.contexts
print(contexts)
# 切換進webview檢視
view_context = 'WEBVIEW_com.lemon.lemoonban' #view_context的值由contexts的列印中獲取
driver.seitch_to.context(view.context)
# 操作H5頁面元素
fav_button_id = 'js-bottom-fav'
driver.find_element_by_id(fav_button_id ).click()
# 切換回預設context
driver.switch_to.context(None)
實際測試中,並沒有點選到WebView中的收藏按鈕,由於無法獲取到該app開啟Webview的debug屬性的工程包,猜測是在VirtualXposed環境環境上點選H5元素有問題導致的。
嘗試過使用夜神模擬器,開啟root後,安裝Xposed,並在Xposed中安裝WebViewDebugHook模組模組,但在chrome端並不能獲取到對應H5介面的url。