Sitemap
Flutter Formosa

Flutter lovers make Chinese community strong.

你知道 Maestro 嗎，兼具人性的自動化測試框架，Flutter 品質就靠它了 — Part 1: 介紹與使用

--

來自 Mobile.dev 出產的好物

Maestro 是一個完整的 End-to-End 測試框架，提供豐富的文件和 API 給開發者使用，其中的連續模式就很符合人性化，像是自動 hot-reload 一樣，能夠有效幫助撰寫測試，而且讓非開發者也能參與，這點非常加分，整體來說體驗很不錯。

本範例除了提供基本的測試範例，也有自己撰寫的 Script ，為了進行自動化多 flow 驗證，在最後提供結果報告，很適合與 CI 做整合。

如果好奇有關 Maestro 的其他文章，可以點下方連結跳轉：

Maestro 特點

  • E2E 測試框架，使用 yaml 定義測試流程
  • 容忍非同步和延遲，預設會自動等待操作完成，無需撰寫 sleep()
  • 運行後能夠持續監控測試文件的變動，並在它們發生變化時重新運行，不需要再次編譯
  • 主流 Mobile 平台都有支援，Android、iOS、Flutter、React Native
  • 支援 CI Integration，自動上傳到 Maestro 平台進行測試
  • 支援 Pull Request Integration，發 PR 後自動進行測試驗證以及性能分析
  • 支援 Crash Analysis，每個情況都附有螢幕錄影、Log、Stacktrace
  • 支援 APP Size Analysis，了解哪個部分容量佔比較大，可以進行特定優化
  • 支援 Memory Leaks Analysis，查看洩漏狀況與原因
  • 支援 Performance Analysis，測量啟動時間、執行時間，查看函式的呼叫以及耗時

安裝 Maestro CLI

curl -Ls "http://get.maestro.mobile.dev" | bash

iOS 設備的前置設定

  • 需要 Facebook IDB(iOS Debug Bridge) 工具，就像是 Android adb 工具，可以跟設備互動，查看資訊、安裝、監控還能模擬手勢操作，適合自動化測試
brew tap facebook/fb
brew install facebook/fb/idb-companion

查看設備清單與ID

 xcrun simctl list

透過 idb 啟動要運行測試的模擬器

idb_companion --boot <id of the iOS device>

透過 idb 連結測試模擬器，驗證是否正常，沒問題就可以將此運行關閉

idb_companion --udid <id of the iOS device>

透過 idb 關閉模擬器

idb_companion --shutdown F7CABB3C-DD6F-432D-A86F-5884287D2261

提醒：測試目前無法跑在實際的手機設備

運行 APP

在測試執行前要確保已經有安裝過 APP 到模擬器，Maestro 會根據 packageName 或 bundleId 自動尋找到指定 APP 並啟動執行測試驗證

  1. IDE 運行安裝 APP
  2. Android 指令安裝
  3. iOS 指令安裝

Android 安裝

adb install sample.apk

iOS 安裝

xcrun simctl install Booted Test.app

撰寫測試

請查看本文的第二章節，有講解所有的操作指令，點擊以下連結跳轉

執行 Debug 連續測試

  • 運行 Continuous Mode
  • 運行時皆為 Hot reload 模式，即時監聽 yaml 檔案的更新，不需要重新編譯即可重新運行
  • 測試過程的檢查條件會根據操作逐一確認
  • Enter → 點擊後刷新重來
maestro test -c flows/LaunchApp.yaml

當 yaml 檔的流程撰寫有誤時，會即時提醒

執行單一 Flow 測試

整個流程會自動執行操作，並完成驗證，最後顯示通過結果

maestro test maestro/flows/GoThirdAndScroll.yaml

執行完整多 Flow 測試

  • 測試整個資料夾，每個情境都驗證，並在運行後生成測試報告
  • 不包含子資料夾
  • 加上 --format junit 生成 XML 結果報告
  • 加上 —-output result.xml 修改匯出名稱
// 1.
maestro test flows/

// 2.
maestro test --format junit flows/

缺點

當需要驗證多個 flow 測試時會無法正常完成，從第二個 flow 開始不會自動操作，例如：點擊按鈕、滾動等互動行為，必須手動操作畫面讓 Maestro 檢查，是個很不方便的過程。

優化

這邊我透過撰寫 Shell Script 來解決問題，逐一進行個別的 flow 驗證，可以查看專案的 /scripts/run_test.sh 檔案。

主要的想法就是把測試目錄裡的每個 flow 檔案都進行逐一驗證，並記錄成功與失敗的數量，最後顯示我需要的結果報告，並附帶測試通過率。如果需要的話，後續就能夠接著整合 CI，測試沒問題才能進行後續的 APP 建置。

以下展示透過 script 驗證多個 flow 測試，最後提供結果

Maestro Studio 工作室

  • 方便的輔助工具
  • 抓取所有的 UI 元素，也可以搜尋關鍵字
  • 生成每個元素的基本測試指令，讓使用者可以直接複製使用

錄製影片

  • 方便的錄影功能，不需要清空桌面與調整視窗位置，它會幫你自動調整為合適位置並進行錄製，最後產出一個下載連結
  • 非常適合需要向外部展示、分享的時候
maestro record test.yaml

Maestro 錄製完成的影片，是不是非常方便，搭配簡潔好看的背景，一目了然

缺點

  • Maestro 無法在桌面應用以及網頁應用上運行

Conclusion

在本文中我們說明什麼是 Maestro E2E Testing，這個工具支援的功能與能做的事情很豐富，算是很棒的一套 solution。它透過 idb 對模擬器進行一些操作，驗證常見的使用者情境，而我透過自訂義的 Script 優化測試流程，並在最後取得最終報告，能幫我們解省許多時間。

另外 Maestro Studio 與錄製功能體驗下來感覺都很不錯，是其他測試框架比較沒有支援的功能，能夠給予一定的幫助，儘管不是開發者也能寫出完整的測試流程，這點就讓人很感興趣，推薦大家去了解它。

如果你在使用 Maestro 的過程中有遇到問題，也歡迎留言跟我說，我們來討論一下。本系列的其他章節會說明更詳細的資訊，以及如何用它來幫助專案，有時間的話快去看看吧!

Next

Source Code

Flutter Formosa
Flutter Formosa

Published in Flutter Formosa

Flutter lovers make Chinese community strong.

Yii Chen
Yii Chen

Written by Yii Chen

Believe what you believe | Organizer FlutterTaipei | Author, Speaker | wanna make Flutter strong in Chinese community.

No responses yet