Appium上下文和H5測試(一)

堅持原創輸出，點擊藍字關注我吧

做者：清菡
博客：oschina、雲+社區、知乎等各大平臺都有。

目錄

• 1、混合應用-H5
  • 1.混合應用是什麼？
  • 2.怎麼樣分辨一個 App 頁面到底是原生的仍是 Web 的？
  • 3.若是 App 是 Web 的界面，那界面不會有佈局邊界顯示，若有則說明是原生的界面。
• 2、想要操做這個 Html 頁面
  • 1.想經過代碼點擊當即購買，那 Web 自動化中用到了什麼環境啊？
  • 2.寫代碼點擊全程班，進入全程班後該怎麼辦？
  • 3.要求
  • 4.Debug 模式怎麼來呢？
• 3、元素定位的 4 種方式及操做
  • 1.chrome://inspect，須要 fanqiang。
  • 2.使用 driver.page_source 獲取 Html 頁面。
  • 3.找開發人員要源代碼文件。
  • 4.uc-devtools 不須要 FQ。
  • 5.想定位一個元素怎麼操做？
• 4、代碼

1、混合應用-H5

微信小程序的前提都是基於 H5，沒有 H5 的狀況下來操做微信小程序您可能不太明白。H5 是混合應用，有原生應用和混合應用。

1.混合應用是什麼？

是在一個裏面有 Html 頁面，又有原生控件的標籤等等。

2.怎麼樣分辨一個 App 頁面到底是原生的仍是 Web 的？

1）在手機/模擬器中點擊關於手機中的版本號 5 下，出來開發者選項。

2）在開發者選項中勾選上顯示佈局邊界，再返回到 App 界面。

華爲榮耀 p30:設置-系統和更新-開發人員選項-顯示佈局邊界（開啓）。

開啓顯示佈局邊界，你看到的每個元素，它都把它框起來了。一個框表明一個原生控件中的一個元素（原生控件中的一個控件或者一個佈局）。

整屏能操做的地方都被這樣框起來了，證實全部的都是原生控件啊，也就是UiAutomator Viewer能夠識別的。

可是，你看這一整塊就是一整個框啊。包括當即購買、下載、打開這樣的東西都沒有。而是做爲中間整屏放在一塊兒的。

從圖片中能夠看出，上面是原生控件，下面是 Html 頁面。因此，這個就是混合應用。

3.若是 App 是 Web 的界面，那界面不會有佈局邊界顯示，若有則說明是原生的界面。

有時候，肉眼上的識別不是很信任，那麼就打開截屏工具：

若是看到這個地方是個 Web View，那麼絕對是個 Html 頁面。

UiAutomator Viewer不能識別 Html 頁面的。到了這個 Web View 就卡住了。它裏面的 Html 是跟它沒有關係的。

2、想要操做這個 Html 頁面

得像 Web 自動化同樣，先在這個界面找到當即購買的連接（也就是整個 Html 頁面）找到了以後才能去點擊。

1.想經過代碼點擊當即購買，那 Web 自動化中用到了什麼環境啊？

• 我想驅動網頁去作點事，就必需要把環境搭建好才能夠。安卓手機的不少 Api 都是谷歌開發的，因此基本上只能用谷歌 Web View 了。也得安裝 Chrome driver，得有驅動程序還得跟瀏覽器版本匹配。

• 從外面點擊進來的時候，外面是一個原生控件，從一個原生控件點擊以後，切換到一個 Html 頁面中操做，它們倆很顯然是不同的東西。一個是 Html，一個是安卓控件。因此要點擊當即購買，還要必須進行切換操做。

• 如今雖然識別了，可是不知道怎樣操做它。

2.寫代碼點擊全程班，進入全程班後該怎麼辦？

混合應用自動化方案

基於 UiAutomator+Chrome driver

原生控件部分則 Uiautomator，Web View 的部分走 Chrome driver，兩者結合。

3.要求：

• Android 4.4+
• Web View 必須爲 Debug 版本。

要從原生控件中切換到手機的 Html 頁面中，切換操做的前提是得知道切換的是誰，得知道切換到哪去，因此這裏也是同樣的。首先必須可以識別到 Web View。

識別到 Web View 的前提是：下載知乎或者豆瓣，去獲取全部當前能夠操做的上下文，會發現沒有 web view。也就是關閉了 Web View 的顯示。

Windows 切換必須獲取 Windows 的句柄，有才能切換。既然把 Web View 的識別給關閉了，就沒辦法切換到 Web View 這個元素。

因此這裏有個硬性條件，Web View 必須爲 Debug 版本。

瀏覽器除外，瀏覽器自己就是能夠識別的，本質上就是網頁性質的訪問。手機上的瀏覽器也是同樣的。

4.Debug 模式怎麼來呢？

解決方法：

一、App 打包的時候須要開啓 Web View 的 Debug 屬性setWebContentDebuggingEnabled(true)

這個直接讓開發加上就好，再去打包就能夠了；（測試階段讓他加上，通常上了應用商城中的，都是把它關閉的）。

二、開啓後，有些真機可能依然沒有辦法獲取到 Web View（模擬器的 contexts 中有 Web View，但有些手機沒有。）

官方給出的答案是：須要將手機 root，而後再去獲取。

目前不少廠商，它的權限設置是不太同樣的。有的手機須要 root，有的手機不須要 root。

開啓 Web View 可見：

連接：https://developers.google.com/web/tools/chrome-devtools/remote-debugging/webviews

能夠識別 Web View 了，切換進來後就必須作到元素定位了。

3、元素定位的 4 種方式及操做

1.chrome://inspect，須要 fanqiang。

瀏覽器中輸入網址：chrome://inspect/#devices

打開網址後，點擊界面中的 inspect，彈出一個界面能夠看到完整的 Html 界面，可是大部分同窗沒有 fq 的權限。因此這種方式擱置。

2.使用 driver.page_source 獲取 Html 頁面。

driver 有個 page_source 選項，已經切換到 Html 頁面，怎麼切換的？

已經切換到 Html 頁面了，那咱們頁面源碼就是完整的 Html。經過 driver.page_source 獲得完整的 Html，而後將它保存在我本地的文件當中，再用瀏覽器去打開。這樣照樣能夠作元素定位和元素識別。

以前寫文件操做了。知道如何獲取頁面源碼，如何獲取 Html，你只要將它保存文件便可。

第二種方式有點累贅。

3.找開發人員要源代碼文件。

這個呢就要藉助開發的幫助，ta 要是不給你，你也沒辦法哦。

4.Uc-devtools 不須要 FQ。

Uc-devtools 這個工具很是好，它的效果和咱們在chrome://inspect/#devices看到的是很是像的。

下載地址：https://dev.ucweb.com/download/?spm=ucplus.11199946.0.0.53974692TtSluZ#DevTool

下載下來安裝的時候，直接下一步下一步就行了。

安裝完畢後，它是沒有桌面標識的，能夠在開始-你的應用程序中找到它。

注意：這個工具只識別 Web View，若是手機打開的頁面中有 Web View 網頁，能識別到的狀況下這裏纔會顯示。若是沒有 Web View，那這裏就什麼都不顯示。

第一次使用的時候，可能界面顯示不全，能夠設置成這樣：

這個是安卓手機內置的 Web View 版本，也就是安卓手機內置的瀏覽器版本。Web 自動化要下載瀏覽器驅動，那咱們這個地方並無操做的是瀏覽器，操做的是網頁。

怎麼知道下載哪一個驅動呢?

78.0.3904.108 表明瀏覽器的版本，其實是手機中內置的 Web View 版本。Web View 就表明了瀏覽器，不須要您真的安裝它。下載個能支持 78.0.3904.108 的谷歌驅動。

只截取了 Web View 的部分，沒有截取原生控件的。

只取了 Html 這塊：

這裏有個完整的 Html 頁面在這裏。

5.想定位一個元素怎麼操做？

跟咱們以前使用谷歌 F12 的套路是同樣的。

一個手機中除了這個 Web View 網頁，可能還有別的 Web View 網頁。若是是連續的操做，不須要回退到原生控件中，能夠在 Html 當中一直操做下去。Html 頁面，之前寫 Web 自動化的時候有寫過有 iframe 就切換，沒有 iframe 就不切換。都是同樣的道理。

這是 Web 自動化和 App 自動化混合使用版本。如今可以找到元素也可以識別到 Web View。怎麼切換？

4、代碼

driver.find_element_by_android_uiautomator(loc).click()

這個步驟以後進入到了全程班的頁面，進入全程班的頁面也是須要時間的。Web View 這個元素當中放的纔是 Html 頁面，是否是等到 Html 頁面加載出來以後再去獲取全部的相關內容這樣比較好。

萬一切過來的時候，Html 頁面尚未去加載就立刻獲取當前全部能夠操做的對象，這樣很容易丟失，因此同樣要有等待。

首先等到 Web View 這個元素的 class 控件出現。

from appium import webdriver
import time
from selenium.webdriver.support.wait import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
from appium.webdriver.common.mobileby import MobileBy


desired_caps={}
# 平臺類型
desired_caps["platformName"]="Android"
# 平臺版本號
desired_caps["platformVersion"]="10"
# 設備名稱
desired_caps["deviceName"]="2NSDU20410017297"
# app 包名
desired_caps["appPackage"]="填appPackage"
# app 入口 acitivity
desired_caps["appActivity"]="填appActivity"


# 鏈接Appium server。前提：appium desktop要啓動。有監聽端口。
# 將desired_caps發送給appium server。打開app
driver = webdriver.Remote('http://127.0.0.1:4723/wd/hub',desired_caps)

loc='new UiSelector().text("全程班")'
WebDriverWait(driver,20).until(EC.visibility_of_element_located((MobileBy.ANDROID_UIAUTOMATOR,locals())))
driver.find_element_by_android_uiautomator(loc).click()

# 等待Web View元素出現  -Web View裏面放的是Html
WebDriverWait(driver,20).until(EC.visibility_of_element_located(MobileBy.CLASS_NAME,'android.webkit.WebView'))
time.sleep(1)#稍微sleep 1秒，確保裏面的Html，全部的都能加載完成。

---

公衆號 「清菡軟件測試」 首發，更多原創文章：清菡軟件測試 96+原創文章，歡迎關注、交流，禁止第三方擅自轉載。