[flutter] get_it를 사용하여 플러터 UI 테스트를 작성하는 방법은?

30 Nov 2023

flutter

Flutter는 플랫폼 간 애플리케이션 개발을 위한 인기있는 프레임워크입니다. 앱의 UI를 테스트하기 위해서는 테스트 중에 필요한 서비스나 의존성을 쉽게 주입할 수 있어야 합니다. get_it은 Flutter 앱에서 의존성을 관리하고 주입하는 데 사용되는 간편한 패키지입니다.

이 튜토리얼에서는 get_it를 사용하여 플러터 UI 테스트를 작성하는 방법에 대해 알아보겠습니다.

get_it 패키지 설치하기

먼저, pubspec.yaml 파일에 get_it 패키지를 추가해야 합니다. 이를 위해 다음과 같이 dependencies 섹션에 get_it 패키지를 추가합니다.

dependencies:
  flutter:
    sdk: flutter
  get_it: ^7.0.3

그런 다음, 터미널에서 다음 명령을 실행하여 패키지를 설치합니다.

flutter pub get

get_it를 사용하여 의존성 주입하기

의존성 주입을 사용하려면 먼저 get_it을 초기화해야 합니다. 일반적으로 앱의 진입점인 main 함수에서 get_it을 초기화하는 것이 좋습니다.

import 'package:flutter/material.dart';
import 'package:get_it/get_it.dart';

void main() {
  runApp(MyApp());
  setupLocator();
}

void setupLocator() {
  GetIt.instance.registerSingleton<MyService>(MyServiceImpl());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Get It Example',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  final MyService _myService = GetIt.instance<MyService>();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter Get It Example'),
      ),
      body: Center(
        child: Text(_myService.getData()),
      ),
    );
  }
}

abstract class MyService {
  String getData();
}

class MyServiceImpl extends MyService {
  @override
  String getData() {
    return 'Hello World!';
  }
}

위의 코드에서 setupLocator 함수는 get_it을 초기화하는데 사용됩니다. 여기에서 GetIt.instance.registerSingleton 메소드를 사용하여 MyService 클래스의 인스턴스를 등록합니다.

MyHomePage 위젯에서 MyService의 인스턴스를 GetIt.instance<MyService>()로 가져올 수 있습니다.

플러터 UI 테스트 작성하기

이제 플러터 UI 테스트를 작성해보겠습니다. Flutter 테스트 프레임워크를 사용하여 MyHomePage 위젯을 테스트하고, get_it을 사용하여 필요한 의존성을 주입할 것입니다.

import 'package:flutter/material.dart';
import 'package:flutter_test/flutter_test.dart';
import 'package:get_it/get_it.dart';
import 'package:my_app/main.dart';

void main() {
  setUp(() {
    // get_it 초기화
    setupLocator();
  });

  testWidgets('MyHomePage 테스트', (WidgetTester tester) async {
    // MyHomePage 실행
    await tester.pumpWidget(MyApp());

    // MyService 인스턴스 가져오기
    final MyService myService = GetIt.instance<MyService>();

    // MyService의 getData() 호출 결과 확인
    expect(find.text(myService.getData()), findsOneWidget);
  });
}

위의 테스트 코드에서 setUp 함수를 사용하여 get_it을 초기화합니다. 그런 다음 testWidgets를 사용하여 MyHomePage 위젯을 실행하고, 주입된 MyService의 getData()를 테스트합니다.

테스트를 실행하려면 터미널에서 다음 명령을 실행하면 됩니다.

flutter test

이제 get_it를 사용하여 플러터 UI 테스트를 작성하는 방법을 알게 되었습니다. get_it은 테스트 중에 플러터 앱에 필요한 의존성을 손쉽게 주입할 수 있도록 도와줍니다.

더 자세한 내용은 get_it 패키지 문서를 참고하세요. Happy coding!