Kiểm thử thành phần điều hướng trong Compose

Tách mã điều hướng khỏi các đích đến thành phần kết hợp để cho phép kiểm thử riêng từng thành phần kết hợp, tách biệt với thành phần kết hợp NavHost.

Đừng truyền NavController trực tiếp vào bất kỳ thành phần kết hợp nào. Thay vào đó, hãy truyền các lệnh gọi lại điều hướng (lambda) làm tham số. Điều này cho phép kiểm thử riêng lẻ tất cả các thành phần kết hợp của bạn, vì chúng không yêu cầu thực thể của NavController trong kiểm thử.

Lambda composable trong NavHost đóng vai trò là cầu nối giữa API Điều hướng và thành phần kết hợp của bạn:

@Composable
fun ProfileScreen(
    userId: String,
    navigateToFriendProfile: (friendUserId: String) -> Unit
) {
 // …
}

// In your NavHost
composable<Profile> { backStackEntry ->
    val profile = backStackEntry.toRoute<Profile>()
    ProfileScreen(userId = profile.id) { friendUserId ->
        navController.navigate(route = Profile(id = friendUserId))
    }
}

Theo đó, bạn có thể kiểm thử ProfileScreen một cách độc lập với thành phần Điều hướng bằng cách truyền các giá trị và lệnh gọi lại mô phỏng.

Bạn nên viết các kiểm thử đáp ứng các yêu cầu điều hướng trong ứng dụng bằng cách kiểm thử NavHost, các thao tác điều hướng được truyền đến thành phần kết hợp cũng như các thành phần kết hợp màn hình riêng lẻ.

Kiểm thử NavHost

Để bắt đầu kiểm thử NavHost, hãy thêm phần phụ thuộc kiểm thử điều hướng sau vào tệp build.gradle của mô-đun ứng dụng:

dependencies {
  androidTestImplementation "androidx.navigation:navigation-testing:$navigationVersion"
}

Gói NavHost của ứng dụng trong một thành phần kết hợp chấp nhận NavHostController làm tham số:

@Composable
fun AppNavHost(navController: NavHostController){
  NavHost(navController = navController, startDestination = Home){
      composable<Home> { /*...*/ }
      composable<Profile> { /*...*/ }
  }
}

Giờ đây, bạn có thể kiểm thử AppNavHost và logic điều hướng được xác định bên trong NavHost bằng cách truyền một thực thể của cấu phần phần mềm kiểm thử điều hướng TestNavHostController.

Quy trình kiểm thử giao diện người dùng xác minh đích bắt đầu của ứng dụng và NavHost sẽ có dạng như sau:

class NavigationTest {

    @get:Rule
    val composeTestRule = createComposeRule()
    lateinit var navController: TestNavHostController

    @Before
    fun setupAppNavHost() {
        composeTestRule.setContent {
            navController = TestNavHostController(LocalContext.current)
            navController.navigatorProvider.addNavigator(ComposeNavigator())
            AppNavHost(navController = navController)
        }
    }

    @Test
    fun appNavHost_verifyStartDestination() {
        composeTestRule
            .onNodeWithContentDescription("Start Screen")
            .assertIsDisplayed()
    }
}

Kiểm thử thao tác điều hướng

Bạn có thể kiểm thử hoạt động triển khai tính năng điều hướng theo nhiều cách, chẳng hạn như nhấp vào thành phần trên giao diện người dùng, sau đó xác minh đích đến đã hiển thị hoặc bằng cách so sánh tuyến dự kiến với tuyến hiện tại.

Khi muốn kiểm thử việc triển khai ứng dụng cụ thể của mình, bạn nên kiểm thử theo cách nhấp vào giao diện người dùng. Để tìm hiểu cách kiểm thử một cách độc lập điều này cùng với các hàm có khả năng kết hợp riêng lẻ, hãy xem lớp học lập trình Kiểm thử trong Jetpack Compose.

Bạn cũng có thể sử dụng navController để kiểm tra các câu nhận định điều hướng bằng cách so sánh tuyến đường hiện tại với tuyến đường dự kiến bằng cách sử dụng currentBackStackEntry:

@Test
fun appNavHost_clickProfile_navigatesToProfile() {
    composeTestRule.onNodeWithContentDescription("Go to Profile")
        .performClick()

    assertTrue(navController.currentBackStackEntry?.destination?.hasRoute<Profile>() ?: false)
}

Để biết thêm hướng dẫn các kiến thức cơ bản về kiểm thử trong Compose, hãy xem hướng dẫn Kiểm thử bố cục Compose.