[Flutter] Unit Test 코드

An introduction to unit testing

📝 단위 테스트 시나리오

1. mickito & test 의존성 추가
2. 테스트할 함수 생성하기
3. http.Client Mock 객체와 함께 테스트 파일 생성하기
4. 각 조건마다 테스트 작성하기
5. 테스트 수행하기

1. 👨🏻‍💻 mockito의존성 추가하기

mockito 의존성을 추가하기 위해 pubspec.yaml 파일의 dev_dependencies 영역에 flutter_test 의존성과 함께 추가한다.

🚀 http 패키지도 사용해야 하기 때문에 dependencies영역에 추가한다.

dependencies:
  http: <newest_version>
dev_dependencies:
  test: <newest_version>
  mockito: <newest_version>

Tip : Flutter version에 따라 test의 버전이 달라질 수 있음.
저는 현재 1.17.3의 Flutter stable version을 사용하고 있고, test는 1.14.4버전이다.

http: ^0.12.2
...
test: ^1.14.4
mockito: ^4.1.1

2. 👨🏻‍💻 테스트할 함수 생성하기

본 예제에서는 인터넷에서 데이터 가져오기 예제의 fetchPost 함수를 단위 테스트한다. 이 테스트를 위해서 두가지 변경이 필요하다.

1. 함수에 http.Client를 제공해야한다.
2. mock 객체로 만들기 어려운 static http.get() method가 아닌, 제공된 client를 사용하여 서버로부터 데이터를 가져온다.

💢Post라는 class를 미리 정의해두어야 한다. 인터넷에서 데이터 가져오기에 보면 나옴.

Future<Post> fetchPost(http.Client client) async {
  final response =
      await client.get('https://jsonplaceholder.typicode.com/posts/1');

  if (response.statusCode == 200) {
    // 만약 서버로의 요청이 성공했다면, JSON으로 파싱합니다.
    return Post.fromJson(json.decode(response.body));
  } else {
    // 만약 요청이 실패하게 되면, 에러를 던집니다.
    throw Exception('Failed to load post');
  }
}

✅ https://jsonplaceholder.typicode.com/posts/1 의 결과값 :
{
"userId": 1,
"id": 1,
"title": "sunt aut facere repellat provident occaecati excepturi optio reprehenderit",
"body": "quia et suscipit\nsuscipit recusandae consequuntur expedita et cum\nreprehenderit molestiae ut ut quas totam\nnostrum rerum est autem sunt rem eveniet architecto"
}

3. 👨🏻‍💻 http.Client Mock 객체와 함께 테스트 파일 생성하기

이제 MockClient 클래스와 함께 테스트 파일을 만들 차례이다. 단위테스트 소개 예제를 따라 최상위 test 폴더 안에 fetch_post_test.dart 파일을 생성한다.

MockClient 클래스에서는 http.Client 클래스를 구현할 것이다. 이를 통해 MockClient를 fetchPost 함수에 전달할 수 있게 되며, 각 테스트마다 다른 http 응답을 반환할 수 있게 해준다.

import 'package:flutter_test/flutter_test.dart';
import 'package:http/http.dart' as http;
import 'package:mockito/mockito.dart';
// Mockito 패키지에서 제공되는 Mock 클래스를 사용하여 MockClient를 생성합니다.
// 각 테스트 마다 이 클래스의 새로운 인스턴스를 생성하세요.
class MockClient extends Mock implements http.Client {}

main() {
  // 테스트 코드는 여기에 위치합니다.
}

4. 각 조건마다 테스트 작성하기

위에서 작성한 fetchPost() 함수는 두 가지 일 중 하나를 수행하게 된다.

1. http 요청이 성공하면 Post를 반환한다.
2. http 요청이 실패하면 Exception을 던진다.

따라서 두가지 경우에 따라 테스트 코드를 작성해야 한다. MockClient 클래스를 사용하여 성공 케이스를 위해 OK 응답을 반환할 수도 있고, 실패 케이스를 위해 Error 응답 반환을 유도할 수 있다. 이러한 조건은 Mockito가 제공하는 when() 함수를 사용해서 테스트 할 수 있다.

main() {
  group('fetchPost', () {
    test('returns a Post if the http call completes successfully', () async {
      final client = MockClient();

      // 제공된 http.Client를 호출했을 때, 성공적인 응답을 반환하기 위해 
      // Mockito를 사용합니다.
      when(client.get('https://jsonplaceholder.typicode.com/posts/1'))
          .thenAnswer((_) async => http.Response('{"title": "Test"}', 200));

      expect(await fetchPost(client), isInstanceOf<Post>());
    });

    test('throws an exception if the http call completes with an error', () {
      final client = MockClient();

      // 제공된 http.Client를 호출했을 때, 실패 응답을 반환하기 위해 
      // Mockito를 사용합니다.
      when(client.get('https://jsonplaceholder.typicode.com/posts/1'))
          .thenAnswer((_) async => http.Response('Not Found', 404));

      expect(fetchPost(client), throwsException);
    });
  });
}

5. 테스트 수행하기

IDE를 사용한다면, run 버튼을 이용해서 테스트 가능하고
editor를 사용한다면 command line에서 다음 명령어를 입력하면 가능하다.

flutter test 파일명
ex) $flutter test test/unit_test/http_test_fetchPost.dart