Flutter Cookbook 링크

An introduction to integration testing

Unit tests와 widget tests는 개별 클래스, 함수, 위젯들을 테스트하기 위해 다뤄진다. 그러나 그들은 일반적으로 개별 조각들이 전체로 함께 작동하는 방식을 테스트하거나 실제 기기에서 작동하는 어플의 수행을 포착하지는 않는다. 이 작업들은 integration test와 함께 수행된다.

Integration tests는 SDK로 제공되는 integration_test 패키지로 작업된다.

이 레시피에서는 counter app을 어떻게 테스트하는지 배운다. 통합 테스트를 준비하는 방법, 구체적인 텍스트를 앱에 보여지는지 확인하는 방법, 상세 위젯을 탭하는 방법, 통합 테스트를 실행하는 방법을 보여준다.

1. 테스트 할 앱 만들기
2. integration_test 종속성 추가
3. 테스트 파일 생성
4. 통합 테스트 작성
5. 통합 테스트 실행

1. 테스트 할 앱 만들기

테스트 용도의 앱을 만들자. 이 예시에서는 flutter create 명령으로 생성된 counter 앱을 테스트한다. 이 앱을 사용하면 버튼을 탭해서 counter를 높일 수 있다.

import 'package:flutter/material.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      title: 'Counter App',
      home: MyHomePage(title: 'Counter App Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            const Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              // Provide a Key to this specific Text widget. This allows
              // identifying the widget from inside the test suite,
              // and reading the text.
              key: const Key('counter'),
              style: Theme.of(context).textTheme.headline4,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        // Provide a Key to this button. This allows finding this
        // specific button inside the test suite, and tapping it.
        key: const Key('increment'),
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: const Icon(Icons.add),
      ),
    );
  }
}

2. integration_test 종속성 추가

integration_test 및 flutter_test 패키지를 사용해서 통합 테스트를 작성하자. Flutter SDK를 패키지 위치로 지정해서 해당 종속성을 dev_dependencies 앱 파일의 pubspec.yaml에 추가한다.

dev_dependencies:
  integration_test:
    sdk: flutter
  flutter_test:
    sdk: flutter

3. 태스트 파일 생성

app_test.dart 빈 파일과 함께 integration_test 새로운 디렉토리를 생성한다.

counter_app/
  lib/
    main.dart
  integration_test/
    app_test.dart

4. 통합 테스트 작성

1. 물리 기기에서 테스트를 작동시키는 싱글통 서비스 IntegrationTestWidgetsFlutterBinding 초기화
2. WidgetTester 클래스를 사용해서 위젯 상호작용하고 테스트
3. 중요한 시나리오 테스트

import 'package:flutter_test/flutter_test.dart';
import 'package:integration_test/integration_test.dart';

import 'package:counter_app/main.dart' as app;

void main() {
  IntegrationTestWidgetsFlutterBinding.ensureInitialized();

  group('end-to-end test', () {
    testWidgets('tap on the floating action button, verify counter',
        (tester) async {
      app.main();
      await tester.pumpAndSettle();

      // Verify the counter starts at 0.
      expect(find.text('0'), findsOneWidget);

      // Finds the floating action button to tap on.
      final Finder fab = find.byTooltip('Increment');

      // Emulate a tap on the floating action button.
      await tester.tap(fab);

      // Trigger a frame.
      await tester.pumpAndSettle();

      // Verify the counter increments by 1.
      expect(find.text('1'), findsOneWidget);
    });
  });
}

• WidgetTester : 위젯 빌드 & 랜더링
  • pumpAndSettle함수: 더 이상 예약된 프레임이 없을 때까지 주어진 duration동안 pump를 반복하여 호출. (기본적으로 모든 애니메이션이 완료될 때까지 기다림)
  • tab함수 : 주어진 위젯의 중심을 클릭합니다.
• Finder : commonFinder를 이용해 WidgetTester로 생성한 위젯 트리 내의 위젯 검색
  • text함수 :인수와 동일한 문자열을 포함하는 Text 및 EditableText 위젯 찾기

#참고자료 - https://beomseok95.tistory.com/314

5. 통합 테스트 실행

통합 테스트를 실행하는 프로세스는 테스트 중인 플랫폼에 따라 다르다. 모바일 플랫폼이나 웹에서 테스트할 수 있다.

5a. 모바일

실제 iOS / Android 기기에서 테스트하려면 먼저 기기를 연결하고 프로젝트의 루트에서 명령을 실행.
flutter test integration_test/app_test.dart
또는 모든 통합 테스트 실행을 위한 디렉토리를 지정할 수 있다.
flutter test integration_test
해당 명령은 목표 기기에서 앱과 통합 테스트를 실행한다. 더 많은 정보를 위해서는 통합 테스트 페이지를 보자.

5b. 웹

웹 브라우저에서 테스트를 시작하려면 ChromeDriver를 다운로드한다.
test_driver 이름으로 지정된 integration_test.dart로 새 파일을 포함하는 디렉토리를 만든다.

import 'package:integration_test/integration_test_driver.dart';

Future<void> main() => integrationDriver();

chromedriver를 시작한다.
chromedriver --port=4444
프로젝트의 루트에서 명령을 실행한다.
flutter drive \ --driver=test_driver/integration_test.dart \ --target=integration_test/app_test.dart \ -d chrome
헤드리스 테스트 환경의 경우 대상 장치 식별자로 web-server과 함께 flutter drive 실행할 수 있다.
flutter drive \ --driver=test_driver/integration_test.dart \ --target=integration_test/app_test.dart \ -d web-server