Flutter - การทดสอบ

การทดสอบเป็นขั้นตอนที่สำคัญมากในวงจรชีวิตการพัฒนาของแอปพลิเคชัน ช่วยให้มั่นใจได้ว่าแอปพลิเคชันมีคุณภาพสูง การทดสอบต้องมีการวางแผนและดำเนินการอย่างรอบคอบ นอกจากนี้ยังเป็นช่วงที่ใช้เวลานานที่สุดในการพัฒนา

ภาษา Dart และเฟรมเวิร์ก Flutter ให้การสนับสนุนอย่างกว้างขวางสำหรับการทดสอบแอปพลิเคชันอัตโนมัติ

ประเภทของการทดสอบ

โดยทั่วไปกระบวนการทดสอบมีสามประเภทเพื่อทดสอบแอปพลิเคชันอย่างสมบูรณ์ มีดังนี้ -

การทดสอบหน่วย

การทดสอบหน่วยเป็นวิธีที่ง่ายที่สุดในการทดสอบแอปพลิเคชัน มันขึ้นอยู่กับการตรวจสอบความถูกต้องของโค้ด (โดยทั่วไปของฟังก์ชัน) วิธีการ oa ของคลาส แต่ไม่ได้สะท้อนถึงสภาพแวดล้อมจริงและต่อมาเป็นตัวเลือกที่น้อยที่สุดในการค้นหาจุดบกพร่อง

การทดสอบวิดเจ็ต

การทดสอบวิดเจ็ตขึ้นอยู่กับการตรวจสอบความถูกต้องของการสร้างวิดเจ็ตการแสดงผลและการโต้ตอบกับวิดเจ็ตอื่น ๆ ตามที่คาดไว้ มันก้าวไปอีกขั้นและมอบสภาพแวดล้อมแบบเรียลไทม์เพื่อค้นหาจุดบกพร่องเพิ่มเติม

การทดสอบการผสานรวม

การทดสอบการรวมจะเกี่ยวข้องกับทั้งการทดสอบหน่วยและการทดสอบวิดเจ็ตพร้อมกับส่วนประกอบภายนอกของแอปพลิเคชันเช่นฐานข้อมูลบริการเว็บเป็นต้นโดยจะจำลองหรือล้อเลียนสภาพแวดล้อมจริงเพื่อค้นหาจุดบกพร่องเกือบทั้งหมด แต่เป็นกระบวนการที่ซับซ้อนที่สุด

Flutter รองรับการทดสอบทุกประเภท ให้การสนับสนุนอย่างกว้างขวางและพิเศษสำหรับการทดสอบวิดเจ็ต ในบทนี้เราจะพูดถึงการทดสอบวิดเจ็ตโดยละเอียด

การทดสอบวิดเจ็ต

เฟรมเวิร์กการทดสอบ Flutter ให้เมธอด testWidgets เพื่อทดสอบวิดเจ็ต ยอมรับสองข้อโต้แย้ง -

  • คำอธิบายการทดสอบ
  • รหัสทดสอบ
testWidgets('test description: find a widget', '<test code>');

ขั้นตอนที่เกี่ยวข้อง

การทดสอบวิดเจ็ตประกอบด้วยสามขั้นตอนที่แตกต่างกัน -

  • แสดงวิดเจ็ตในสภาพแวดล้อมการทดสอบ

  • WidgetTester เป็นคลาสที่จัดเตรียมโดยเฟรมเวิร์กการทดสอบ Flutter เพื่อสร้างและแสดงผลวิดเจ็ต เมธอด pumpWidget ของคลาส WidgetTester ยอมรับวิดเจ็ตใด ๆ และแสดงผลในสภาพแวดล้อมการทดสอบ

testWidgets('finds a specific instance', (WidgetTester tester) async { 
   await tester.pumpWidget(MaterialApp( 
      home: Scaffold( 
         body: Text('Hello'), 
      ), 
   )); 
});
  • ค้นหาวิดเจ็ตที่เราต้องทดสอบ

    • Flutter framework มีตัวเลือกมากมายในการค้นหาวิดเจ็ตที่แสดงผลในสภาพแวดล้อมการทดสอบและโดยทั่วไปเรียกว่า Finders ตัวค้นหาที่ใช้บ่อยที่สุดคือ find.text, find.byKey และ find.byWidget

      • find.text ค้นหาวิดเจ็ตที่มีข้อความที่ระบุ

find.text('Hello')
      • find.byKey ค้นหาวิดเจ็ตโดยใช้คีย์เฉพาะ

find.byKey('home')
      • find.byWidget ค้นหาวิดเจ็ตโดยใช้ตัวแปรอินสแตนซ์

find.byWidget(homeWidget)
  • ตรวจสอบให้แน่ใจว่าวิดเจ็ตทำงานตามที่คาดไว้

  • กรอบ Flutter มีตัวเลือกมากเพื่อให้ตรงกับเครื่องมือที่มีเครื่องมือที่คาดหวังและพวกเขาจะเรียกว่าปกติmatchers เราสามารถใช้วิธีการคาดหวังที่ให้ไว้โดยกรอบการทดสอบเพื่อจับคู่วิดเจ็ตซึ่งเราพบในขั้นตอนที่สองกับวิดเจ็ตที่เราคาดหวังของเราโดยเลือกตัวจับคู่ใด ๆ บางส่วนของการจับคู่ที่สำคัญมีดังนี้

    • findOneWidget - ตรวจสอบว่าพบวิดเจ็ตเดียว

expect(find.text('Hello'), findsOneWidget);
    • findNothing - ตรวจสอบว่าไม่พบวิดเจ็ต

expect(find.text('Hello World'), findsNothing);
    • findWidgets - ตรวจสอบว่าพบวิดเจ็ตมากกว่าหนึ่งรายการ

expect(find.text('Save'), findsWidgets);
    • findNWidgets - ตรวจสอบจำนวน 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); 
});

ที่นี่เราแสดงวิดเจ็ต MaterialApp พร้อมข้อความสวัสดีโดยใช้วิดเจ็ตข้อความในตัว จากนั้นเราใช้ find.text เพื่อค้นหาวิดเจ็ตแล้วจับคู่โดยใช้ findOneWidget

ตัวอย่างการทำงาน

ให้เราสร้างแอปพลิเคชัน Flutter ง่ายๆและเขียนการทดสอบวิดเจ็ตเพื่อทำความเข้าใจขั้นตอนที่เกี่ยวข้องและแนวคิดให้ดีขึ้น

  • สร้างแอปพลิเคชัน Flutter ใหม่ flutter_test_app ใน Android Studio

  • เปิด 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); 
});
  • ที่นี่รหัสทดสอบทำหน้าที่ดังต่อไปนี้ -

    • แสดงวิดเจ็ต MyApp โดยใช้ tester.pumpWidget

    • ตรวจสอบให้แน่ใจว่าตัวนับเริ่มต้นเป็นศูนย์โดยใช้ findOneWidget และ findNothing matchers

    • ค้นหาปุ่มเพิ่มตัวนับโดยใช้เมธอด find.byIcon

    • แตะปุ่มเพิ่มตัวนับโดยใช้วิธี tester.tap

    • ตรวจสอบให้แน่ใจว่าตัวนับเพิ่มขึ้นโดยใช้ findOneWidget และ findNothing matchers

  • ให้เราแตะปุ่มเพิ่มตัวนับอีกครั้งจากนั้นตรวจสอบว่าตัวนับเพิ่มเป็นสองหรือไม่

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

expect(find.text('2'), findsOneWidget);
  • คลิกเมนู Run

  • คลิกการทดสอบในตัวเลือก widget_test.dart การดำเนินการนี้จะเรียกใช้การทดสอบและรายงานผลลัพธ์ในหน้าต่างผลลัพธ์