原創開源項目 -- HierarchyViewer for iOS（2）

前文中，咱們介紹了HierarchyViewer for iOS的主要功能，這款工具能夠很是直觀的閱讀iOS應用的控件層次圖，以下圖所示：

 

還能夠右鍵點擊某個控件，來獲取它在UIAutomation中的調用路徑:

 

而後咱們在剪切板能夠獲得該控件的調用路徑：

target.frontMostApp().windows()[0].buttons()["Table"]

 

把它拷貝到Instruments中，就能夠直接調用這個控件了。

 

更多功能能夠參考上文，本文咱們將要介紹的是HierarchyViewer for iOS如何輔助生成iquery代碼並進行測試的。

 

什麼是iquery

iquery.js是咱們發佈的一個輔助iOS UIAutomation的javascript開源庫，它能夠很是方便的幫助咱們找到iOS上面的控件，在處理動態生成的控件時更是很是有效；它採用了相似jquery的語法，熟悉jquery的人員很容易入手。用法很是簡單，你能夠在https://github.com/vowei/iQuery/downloads 下載它，而後在iOS UIAutomation中引用它便可,例如：

#import "iquery.js"

 

咱們舉個例子來講明下iquery的語法吧。

$(">> [name = 'Table']")[0].tap()

 

以上代碼表示在整個頁面中查找name爲‘Table’的控件，並點擊它。咱們來分析它的語法：

>> -- 表示查找全部的子孫節點。因爲iquery默認是從UIAWindow開始查找的，因此這裏>>指的就是查找UIAWindow全部的子孫控件。

[name = ‘Table’] -- 表示在結果中查找name爲’Table’的控件。

 

這裏有個小技巧，讀者可能會感受執行上面的代碼速度會比較慢，這是因爲iOS UIAutomation自身的問題致使在遍歷控件的子控件時速度很慢形成的，解決辦法是在UIAutomation腳本前面加上下面的語句：

UIATarget.localTarget().setTimeout(0);

 

具體能夠參考stackoverflow對這個問題的回答。

 

iquery生成測試器

iquery爲咱們提供了強大的功能，可是手工編寫仍是一件有點麻煩的事，HierarchyViewer for iOS爲提供了友好的iquery生成測試工具來幫助咱們編寫和測試它。

在工具欄上點擊小圖標，將打開iquery生成測試器：

 

區域1是iquery編輯框；

區域2是結果列表，在點擊測試後，結果列表將顯示iquery語句找到的控件或者語法錯誤；

區域3列出了iquery支持的全部語法元素及簡短的語法介紹。

 

生成iquery語句

除了在iquery編輯框中鍵入iquery語句外，HierarchyViewer還提供2中很是編輯的生成方式

1，經過雙擊iQuery元素列表，把對應的元素添加到編輯框：

 

2，第二種方法是，在截屏視圖或者控件樹層次圖上，選中要查找的控件節點，而後在屬性列表中，雙擊你要匹配的屬性，將自動把該屬性添加到iQuery生成測試器的編輯框，以下圖：

 

測試iquery

寫好iquery後，咱們須要測試它。點擊「測試」按鈕，在下方的結果列表中將顯示找到的一個或者多個控件，若是iquery語法存在錯誤，結果列表中將提示語法錯誤。

 

雙擊結果列表中的任意控件，HierarchyViewer for iOS將經過氣泡，在截屏視圖中提示改控件的位置和屬性，以下圖所示：

 

最後，點擊」複製」按鈕，將把iquery語句的完整調用複製到剪貼板，內容爲：

$(" >> [name = 'Table'] ")[0]

 

混合語法支持

iquery的一個很是重要的語法特性是支持UIAutomation語法和iquery語法混合使用，以下代碼：

target.frontMostApp().windows()[0].navigationBars[]("TestUIDemo").$("> [value='TestUIDemo']")[0].tap()

 

以上調用的前一部分target.frontMostApp().windows()[0].navigationBars[]("TestUIDemo")-- 是標準的UIAutomation語法，後一部分.$("> [value='TestUIDemo']")[0]，是iquery語法。

 

以上語法的意義是，在name爲TestUIDemo的NavigationBar下面，查找value爲TestUIDemo的子控件，並tap它:

> 表示查找全部的子控件（注意，不是子孫控件），這裏因爲當前當前控件是NavigationBar，因此查找的是NavigationBar的全部子控件

[value=’TestUIDemo’] 表示查找value爲‘TestUIDemo’的控件。

 

那麼這種混合語法如何進行生成和測試呢?以下圖所示：

 

1，把iQuery生成測試器中的「查找開始位置」修改成「選定節點」。

2，在控件樹視圖中，選中iquery查詢的開始節點，咱們這裏選中UIANavigationBar做爲開始節點。

3，在iQuery編輯框中輸入iquery語句。這和前面的作法是同樣的。

 

而後，和以前同樣，咱們能夠點擊測試按鈕測試iquery了（注意，在測試前，保證控件樹視圖中，當前選中的節點就是查找開始節點，不然比較容易弄錯）。

 

最後，在測試經過後，咱們點擊「複製」按鈕。這時，複製的不僅是iquery語法，而是整個混合調用語句：

target.frontMostApp().windows()[0].navigationBars[]("TestUIDemo").$("> [value='TestUIDemo']")[0]

 

關於iquery的更多介紹，你能夠閱讀《類jQuery selector的控件查詢iQuery開源類庫介紹》。

 

下載地址：https://github.com/vowei/HierarchyViewer-4-iOS/downloads

 

本文由知平軟件的劉斌華原創，轉載請註明出處。

知平軟件致力於移動平臺自動化測試技術的研究，咱們但願經過向社區貢獻知識和開源項目，來促進行業和自身的發展。