騰訊出品小程式自動化測試框架【Minium】系列（三）元素定位詳解

久曲健發表於2023-01-26
框架

寫在前面

昨天轉發這篇文章時，看到群裡有朋友這樣說：

這麼卷嗎？這個框架官方已經不維護了。

姑且不說卷不卷的問題，要是能卷明白，別說還真不錯；

不維護又怎樣？我想學習，想會，分享給很期待這系列的文章的人罷了。

元素定位

元素定位，應該是很多UI自動化測試入門學習必會的技能了，下面我將為大家舉例演示元素定位的幾種方法。

1、CSS選擇器

Minium 可以透過 WXSS 選擇器定位元素，如下圖所示：

image.png

如果有[CSS選擇器]基礎會上手更快 ，如沒有可參考

示例：

image.png

2、CSS方式定位

示例程式碼如下：

# class定位
self.page.get_element(".kind-list-item-hd").click()
# id定位
self.page.get_element("#view").click()
# 屬性定位（邏輯運算定位）
self.page.get_element("[id='view'][class='kind-list-item-hd']").click()
# 簡單選擇器格式 tageName + #id + .className
self.page.get_element("view#view.kind-list-item-hd").click()

3、XPATH方式定位

看到這裡，有的同學可能會條件反射性的想到，右鍵選擇 Copy，點選 Copy Xpath 或 Copy full Xpath？

沒錯，是支援的!

image.png

使用xpath語法定位，示例程式碼如下：

# 絕對定位
self.page.get_element("/page/scroll-view/view/view/view[2]/view/view[1]/view[1]").click()
# 相對定位
self.page.get_element("//view[@id='view']").click()
# 使用屬性定位
self.page.get_element("//view[@id='view' and @class='kind-list-item-hd']").click()
# 使用部分屬性定位
self.page.get_element("//view[contains(@id,'vi')]").click()
# 使用文字定位
self.page.get_element("//view[text()='檢視容器']").click()

個人感覺是完美相容Selenium的CSS 、XPATH定位方式的，參考學習CSS定位入門、XPATH定位入門這兩篇。

4、selector方式定位

推薦使用id/class/標籤+屬性。inner_text/text_contains/value為增強用法，實現本質還是透過selector獲取到元素標籤後再透過inner_text/text_contains/value篩選元素。
示例程式碼如下：

# 適合沒有屬性元素定位
self.page.get_element("view", inner_text="檢視容器").click()
self.page.get_element("navigator", inner_text="swiper").click()

5、跨自定義元件元素定位方式

怎樣識別自定義元件

  • 看wxml檔案或微信開發者工具的wxml pannel，標籤名字不在小程式官方元件列表中的都是 自定義元件
  • 看微信開發者工具的wxml pannel, 標籤下面有#shadow-root的, 則為 自定義元件 。例如小程式頁面wxml中mytest 、test2、 test22

image.png

定位 test2 標籤下的 text 的元素

示例程式碼如下：

# 沒有元素屬性，可以文字定位一試
self.page.get_element("text", inner_text="this is test2").click()
# 絕對對位（dom結構改變就完蛋，不推薦）
self.page.get_element("/page/mytest//test2//view/view/text")
# 使用跨自定義元件的後代選擇器
self.page.get_element("mytest>>>test2>>>text")  # 自定義元件 mytest元件節點下的test2元件節點下text標籤
# 逐層查詢定位
self.page.get_element("mytest").get_element("test2").get_element("#test2").get_element("text")

6、定位示例詳解

這裡我貼出原始碼給的註釋部分，個人覺得這個註釋寫的真好，一看就懂，如下圖所示：

image.png

image.png

7、總結

元素定位小結：

  • 不建議使用基礎標籤view、text方式定位元素，有時會因為dom載入不出來找不到元素，原始碼中引數max_timeout=0，有需要可自己指定超時時間。
  • 小程式發版頻繁不建議使用絕對定位，使用有一定標識性或屬性結合定位，可考慮選擇器定位
  • 若元素沒有屬性，則可考慮XPath，或標籤+文字定位
  • 自定義元件定位，可以考慮跨自定義元件的後代選擇器或逐層定位元素方法定位

寫到最後

最近又開始焦慮了，雖然家人沒催婚，但是到了這個年紀，想有個歸屬，無奈一直遇人不淑，家裡資源用盡，也沒人給我介紹物件，還不相信網路，感覺自己沒救了，略顯尷尬，尬到這些煩惱都不知道跟誰去說！

唉，與理想平等交易，同喧囂保持距離，事已至此，還是先吃飯吧。

相關文章