Flutter - 測試

測試是應用程式開發生命週期中非常重要的階段。它確保應用程式具有高質量。測試需要仔細的計劃和執行。它也是開發中最耗時的階段。

Dart語言和Flutter框架為應用程式的自動化測試提供了廣泛的支援。

測試型別

通常，有三種類型的測試過程可用於完整測試應用程式。它們如下：

單元測試

單元測試是測試應用程式最簡單的方法。它基於確保一段程式碼（通常是函式）或類的方法的正確性。但是，它不反映真實環境，因此是查詢錯誤的選擇最少的方法。

元件測試

元件測試基於確保小部件的建立、呈現和與其他小部件的互動按預期進行。它更進一步，提供接近即時環境以查詢更多錯誤。

整合測試

整合測試包括單元測試和元件測試以及應用程式的外部元件，如資料庫、Web服務等。它模擬或模擬真實環境以查詢幾乎所有錯誤，但它是最複雜的過程。

Flutter支援所有型別的測試。它為元件測試提供了廣泛和獨有的支援。在本章中，我們將詳細討論元件測試。

元件測試

Flutter測試框架提供testWidgets方法來測試小部件。它接受兩個引數：

測試描述
測試程式碼

testWidgets('test description: find a widget', '<test code>');

涉及的步驟

元件測試涉及三個不同的步驟：

在測試環境中渲染小部件。
WidgetTester是Flutter測試框架提供的用於構建和渲染小部件的類。WidgetTester類的pumpWidget方法接受任何小部件並在測試環境中渲染它。

testWidgets('finds a specific instance', (WidgetTester tester) async { 
   await tester.pumpWidget(MaterialApp( 
      home: Scaffold( 
         body: Text('Hello'), 
      ), 
   )); 
});

查詢我們需要測試的小部件。

Flutter框架提供了許多選項來查詢在測試環境中渲染的小部件，它們通常稱為查詢器。最常用的查詢器是find.text、find.byKey和find.byWidget。

find.text查詢包含指定文字的小部件。

find.text('Hello')

find.byKey按其特定鍵查詢小部件。

find.byKey('home')

find.byWidget按其例項變數查詢小部件。

find.byWidget(homeWidget)

確保小部件按預期工作。
Flutter框架提供了許多選項來將小部件與預期的小部件匹配，它們通常被稱為*匹配器*。我們可以使用測試框架提供的expect方法來匹配我們在第二步中找到的小部件與我們選擇任何匹配器預期的我們的預期小部件。

findsOneWidget - 驗證找到單個小部件。

expect(find.text('Hello'), findsOneWidget);

findsNothing - 驗證未找到小部件。

expect(find.text('Hello World'), findsNothing);

findsWidgets - 驗證找到多個小部件。

expect(find.text('Save'), findsWidgets);

findsNWidgets - 驗證找到N個小部件。

expect(find.text('Save'), findsNWidgets(2));

完整的測試程式碼如下：

testWidgets('finds hello widget', (WidgetTester tester) async { 
   await tester.pumpWidget(MaterialApp( 
      home: Scaffold( 
         body: Text('Hello'), 
      ), 
   )); 
   expect(find.text('Hello'), findsOneWidget); 
});

在這裡，我們使用Text小部件在其主體中渲染帶有文字Hello的MaterialApp小部件。然後，我們使用find.text查詢小部件，然後使用findsOneWidget與之匹配。

工作示例

讓我們建立一個簡單的Flutter應用程式並編寫一個元件測試，以更好地理解所涉及的步驟和概念。

在Android Studio中建立一個新的Flutter應用程式flutter_test_app。
開啟測試資料夾中的widget_test.dart。它有一個示例測試程式碼，如下所示：

testWidgets('Counter increments smoke test', (WidgetTester tester) async {
   // Build our app and trigger a frame. 
   await tester.pumpWidget(MyApp()); 
   
   // Verify that our counter starts at 0. 
   expect(find.text('0'), findsOneWidget); 
   expect(find.text('1'), findsNothing); 
   
   // Tap the '+' icon and trigger a frame. 
   await tester.tap(find.byIcon(Icons.add)); 
   await tester.pump(); 
   
   // Verify that our counter has incremented. 
   expect(find.text('0'), findsNothing); 
   expect(find.text('1'), findsOneWidget); 
});

在這裡，測試程式碼執行以下功能：

使用tester.pumpWidget渲染MyApp小部件。
使用findsOneWidget和findsNothing匹配器確保計數器最初為零。
使用find.byIcon方法查詢計數器遞增按鈕。
使用tester.tap方法點選計數器遞增按鈕。
使用findsOneWidget和findsNothing匹配器確保計數器已增加。

讓我們再次點選計數器遞增按鈕，然後檢查計數器是否增加到二。

await tester.tap(find.byIcon(Icons.add)); 
await tester.pump(); 

expect(find.text('2'), findsOneWidget);

點選執行選單。
點選widget_test.dart選項中的測試。這將執行測試並在結果視窗中報告結果。

列印頁面