ComposeのUIテスト

[k_senda]

ComposeのUIテストを追加します

Note

Required（先に完了させましょう）

• #27

課題内容

• ComposeのUIテストを追加する
  • 天気状態の更新に成功したら新しい状態が画面に表示されるのを確認
  • 天気状態の更新に失敗したらエラーダイアログが表示されるのを確認

アプリの画面が実際に想定通り表示されているかを自動テストします。一般にUIテストはユニットテストと比較して、影響される要素が多くテストが煩雑・不安定と敬遠されがちです。しかしComposeではシンプルなAPIを利用してUIテストを簡単に構築することができます。

ViewModelの差し替え

APIが返す天気情報がテスト対象への入力となるので、APIレスポンスをテスト側で制御する必要があります。ただしComposableからは直接APIを呼び出さず、ViewModelから呼び出すようこれまでの課題で設計してきたので工夫が必要です。

1. YumemiWeatherなどAPI呼び出しをモックする
2. Hiltに代わり、モックしたAPIをコンストラクタ引数にViewModelを手動でインスタンス化する
3. FakeのViewModelをテスト対象のComposableに渡す

Tip

テストを意識したComposableの設計が大切です。以下のようにViewModelを外部から受け取れるようにします。ただしデフォルト引数を指定して、テスト以外ではHiltでDIされるViewModelを参照します

@Composable
fun MyComposable(
    modifier: Modifier = Modifier,  // デフォルト引数ありの引数はModifierを最初に書くのが通例です
    viewModel: MyViewModel = hiltViewModels(),
) {}

参考資料

• Android developers - Composeレイアウトのテスト