Jetpack Compose

    [Android UI Test] ViewModel에 의존하는 Composable 테스트 방법 알아보기

    ViewModel에 의존하는 Composable을 테스트할 때 문제점 Composable은 기본적으로 State Hoisting을 통해 ViewModel에 직접 의존하지 않도록 만들어야 하지만, 최상위에 있는 Screen Composable은 상태값을 가지고 있는 ViewModel 객체에 의존해야 한다. *만약 State Hoisting이 무엇인지 모른다면 다음 두 개의 글을 참고하도록 하자. [Android Compose State] State Hoisting(상태 호이스팅) 패턴이란 무엇인가? Compose의 State 선언형 UI 프레임워크인 Compose는 Stateless함이 가장 큰 장점이다. UI에 대한 UI상태의 상호 의존성을 끊을 수 있다면 UI의 재사용성이 생기고, UI에 대한 테스트 ..

    [Android UI Test] createComposeRule과 createAndroidComposeRule의 차이 알아보기

    특정 Composable에 대한 Isolated Test를 위한 createComposeRule 우리는 지금까지 createComposeRule을 사용해 UI 테스트를 진행했다. createComposeRule을 사용하면, 특정한 Composable을 화면에 표시할 수 있고, 해당 UI를 조작해 테스트를 진행할 수 있다. 예를 들어 다음 코드와 같이 CirclePlayButton을 화면에 표시하고, 클릭한 다음, 해당 클릭이 제대로 일어났는지를 테스트할 수 있다. class OnNodeWithContentDescriptionTest { @get:Rule val composeRule = createComposeRule() @Test fun testCircleButtonClick() { // Given va..

    [Android UI Test] useUnmergedTree 속성은 언제 사용할까?

    컴포즈의 UI 노드 구성 방법과 useUnmergedTree 안드로이드 UI 테스트를 작성하다 보면, 노드를 찾는 함수 안에 useUnmergedTree 인자가 들어가 있는 경우를 볼 수 있다. 이는 모든 onNode- 함수와 onAllNodes- 함수 안에 들어가 있는 것을 볼 수 있는데, 그만큼 중요한 인자임을 알 수 있다. 다음은 대표적인 두 개의 함수이다. 이 인자가 중요한 이유는 컴포즈가 UI 노드를 구성하는 방법과 연관되어 있다. xml 기반으로 작성되던 View 시스템에서는 각 View가 하나의 UI 노드가 되었지만, 컴포즈에서는 효율성을 위해 UI 노드를 하나로 합칠 수 있으면 합치는 방식(merge)을 취한다. 이를 통해 두 개의 Composable 혹은 세 개의 Composable이 하..

    [Android Studio] Layout Inspector에서 Compose View 들이 보이지 않는 현상 해결 방법

    문제 상황 개발 테스트 도중 Android Studio Layout Inspector에서 Compose View들이 보이지 않고 아래와 같이, AndroidComposeView로만 뭉뚱그려 나오는 문제가 발생했다. 해결 방법 이 문제를 해결하기 위해서 Google Issue Tracker을 확인한 결과 다음 두가지의 요구사항이 필요함을 확인했다. 1. Android Studio Flamingo 이상의 버전 사용 2. 8.0.0 이상의 AGP(Android Gradle Plugin) 사용 참조: https://issuetracker.google.com/issues/246355403 Google Issue Tracker issuetracker.google.com 내 Android Studio는 마침 딱 Fl..

    [Android UI Test] onAllNodes 구문 사용해 복수의 UI 노드 찾기

    onNode, onNodeWithTag, onNodeWithText, onNodeWithContentDescription을 통해 UI 노드를 찾을 때의 한계 onNode- 구문을 사용해 UI 노드를 찾으면 한 번에 한 개의 노드 밖에 찾기 못한다. 예를 들어 다음과 컴포저블에 대해 Smile이라는 텍스트를 가진 모든 UI 노드를 찾아 클릭하는 테스트를 해야 한다고 해보자. class OnAllNodesTest { @get:Rule val composeRule = createComposeRule() @Test fun onNodeAllNodes() { // Given val isClicked = Array(4) { false } composeRule.setContent { Column() { EmojiTex..