🧀 API 테스트를 위한 mockito 사용 해보기

Testing Flutter Apps | Flutter
mockito | Dart Package

Flutter 앱 테스트 유형 및 방법 살펴보기

이전 글에서는 Flutter에서 앱 테스팅을 하는 방법 및 테스트 유형에 대해서 기본적인 내용을 다뤄봤는데, 이번 글에서는 단위테스트에 대한 좀 더 실용적인 부분을 적용하여 자세한 내용을 다뤄보려고 한다.

실제로 운영되는 대부분의 서비스는 API 통신을 사용해 상호작용 하도록 개발이 되어 있기 때문에 원활한 단위테스트를 진행하려면 테스트 단계에서도 API 통신 및 데이터베이스로 부터 데이터를 가져와야 할 것이다.

만일, 이 부분을 제외하고 단위테스트가 진행이 되면 사실 단위테스트를 하는 의미가 없을뿐더러 정확한 단위테스트 진행이 안되게 된다.

지금부터 API 통신이나 데이터베이스 등의 외부 리소스를 사용해 테스트를 진행하는 방법에 대해서 살펴보도록 하자.

mockito

실제 구동되는 서비스에서 API 통신, 데이터베이스 사용 등은 거의 대부분의 필수 요소일 것이다.

API 통신과 같은 외부 의존성을 테스트하기 위해 Flutter에서 사용하는 패키지가 바로 mockito이다.

테스트 코드를 작성하지 않았다면 생소한 패키지일 것이다.

mockito는 모의 객체(Mock Object)를 사용하여 의존성 주입과 외부 리소스 호출을 시뮬레이션함으로써 테스트를 쉽게 작성할 수 있게 해주는 패키지라고 생각하면 된다.

dependencies

mockito 패키지를 추가하고, 코드 자동생성을 위한 build_runner도 추가해주자.

API 단위테스트를 위해 http도 추가해 주자.

dependencies:
  http: ^1.2.0

dev_dependencies:
  build_runner: ^2.4.9
  flutter_test:
    sdk: flutter
  mockito: ^5.4.4

Helper

먼저 mockito 코드를 생성해주기 위해 helper_test.dart 파일을 test 폴더 아래에 생성해 주도록 하자.

@GenerateMocks 어노테이션을 사용해 http 패키지의 Client 객체에 대한 모의 객체 코드를 자동으로 생성시켜 주자.

helper_test.dart

import 'package:mockito/annotations.dart';
import 'package:http/http.dart' as http;

@GenerateMocks(
  [],
  customMocks: [MockSpec<http.Client>(as: #MockHttpClient)],
)
void main() {}

이제 Code generator를 사용해야 하는데, 명령어는 아래와 같다.

build_runner 패키지가 추가되어 있어야만 생성기에 의해 자동으로 코드가 작성되니 패키지 추가 여부를 반드시 확인하여야 한다.

flutter pub run build_runner build

Code generator를 개발 중에 계속 실행하면서, 변경 사항이 있을시 자동으로 build_runner가 실행되길 원한다면 아래 명령어를 사용하면 된다.

flutter pub run build_runner watch --delete-conflicting-outputs

정상적으로 자동 생성기에 의해 test_helper.mocks.dart 파일이 생성되었을 것이다.

위에 helper 코드의 어노테이션 부분에 대해 추가적인 설명을 하도록 하겠다.

mockito 패키지는 모의 객체를 사용해 테스트를 하는 방법이기 때문에, 모의 객체를 코드 제너레이터를 사용해 생성해 주는 것이다.

여기서 모의 객체를 생성하는 기준이 바로 어노테이션에 추가된 객체이다.

@GenerateMocks(
  [
  	// 모의 객체
  ],
)

customMocks 파라미터는 모의 객체가 자동 생성되어 질 때에 클래스 명을 원하는 이름으로 명명하고자 할 때에 사용할 수 있다.

그렇기 때문에, http 패키지의 Client 객체의 모의객체의 이름은 우리가 직접 지정한 MockHttpClient로 생성되도록 하려고 customMocks에서 생성하였다.

@GenerateMocks(
  [],
  customMocks: [MockSpec<http.Client>(as: #MockHttpClient)],
)

이렇게 생성했다면, 모의 객체 이름은 MockClient가 된다.

@GenerateMocks(
  [
  	http.Client,
  ],
)

이 부분은 추가적인 모의 객체를 생성해 보면서 더 살펴보도록 하자.

API에 사용할 경로에 대한 객체를 생성해주자.

class Urls {
  static const String base = "https://picsum.photos";
  static String currentImageByNo(int no) => "$base/id/$no/info";
}

이제 API 통신시 성공, 실패에 대한 케이스를 테스트하기 위한 테스트 코드를 작성해 보도록 하자.

test 폴더 안에 test 파일을 생성해서 코드를 추가해주자.

void main() {
  late MockHttpClient mockHttpClient;
  late ImageRepository imageRepository;

  setUp(() {
    mockHttpClient = MockHttpClient();
    imageRepository = ImageRepository(mockHttpClient);
  });
}

setUp 함수를 사용해 인스턴스를 초기화 해주자.

우리는 아직 image를 가져오는 코드가 구현되어 있지 않으니, ImageRepository 객체를 생성해 주자.

class ImageRepository {
  final http.Client client;

  const ImageRepository(this.client);

  Future<void> fetch(int no) async {
    try {
      await client.get(Uri.parse(Urls.currentImageByNo(no)));
    } catch (_) {}
  }
}

다시 테스트 파일로 와서 성공시에 대한 테스트 코드를 작성해주자.

when 함수를 사용해 모의 객체의 메서드를 실행시켜 준 뒤, thenAnswer를 사용해 응답이 200인 상태를 가져와 주도록 하자.

verifyNever는 API가 호출되지 았은 상태인지에 대한 테스트이다.

verify는 몇 번 호출된 상태인지를 테스트할 때에 사용하면 된다.

void main() {
	...
    const int testId = 3;

  test("fetch completes successfully when the HTTP call returns 200", () async {
    when(mockHttpClient.get(Uri.parse(Urls.currentImageByNo(testId))))
        .thenAnswer((_) async => http.Response("", 200));

    verifyNever(mockHttpClient.get(Uri.parse(Urls.currentImageByNo(testId))));

    await imageRepository.fetch(testId);

    verify(mockHttpClient.get(Uri.parse(Urls.currentImageByNo(testId))));
  });
}

imageRepository.fetch(testId)를 사용해 API를 호출하기 전이기에 verifyNever 테스트를 통과하고, 호출 후 verify 테스트를 진행하게 된다.

verify는 called를 사용해 몇 번 호출된 상태인지를 테스트 할 수 있다.

verify(mockHttpClient.get(Uri.parse(Urls.currentImageByNo(testId))))
        .called(3);

이어서 에러 케이스에 대한 테스트도 진행해 줄 수 있다.

 test('fetch handles errors when the HTTP call returns non-200 status code',
      () async {
    when(mockHttpClient.get(Uri.parse(Urls.currentImageByNo(testId))))
        .thenAnswer((_) async => http.Response("Not Found", 404));

    await imageRepository.fetch(testId);

    verify(mockHttpClient.get(Uri.parse(Urls.currentImageByNo(testId))));
  });

http 패키지가 아닌 dio 패키지 사용시 helper 어노테이션에 dio 객체를 추가해주면 사용 방법은 동일해진다.

마무리

이번 글을 작성하면서 mockito에 대한 내용과 TDD 구조를 결합해서 코드를 구현해 설명하려고 하였는데, 아키텍쳐 구조를 사용하게 되면, 프로젝트 구조와 파일이 많아져 글로 설명하는데 한계가 있어 가볍게만 작성하였다.

API를 테스트 할 때에는 단순히 호출 성공, 실패 외에도 데이터의 구조가 동일한지 json 파싱이 정상적인지 등의 여러 케이스가 있는데 테스트를 하는 방법은 단위 테스트에서 사용하던 함수와 크게 다르지 않으니 금방 익숙해질 수 있을 것이다.

빠른 시일내에 TDD를 사용한 예제를 만들어 글을 추가로 작성하도록 하겠다.