Przetestuj animacje

Twórz oferty ComposeTestRule, które umożliwiają pisanie testów animacji w deterministyczny sposób z pełną kontrolą nad zegarem testowym. Umożliwia to weryfikację wartości pośrednich animacji. Poza tym test może trwać krócej niż rzeczywisty czas trwania animacji.

ComposeTestRule udostępnia zegar testowy jako mainClock. Możesz ustawić właściwość autoAdvance na wartość false, aby kontrolować zegar w kodzie testu. Po uruchomieniu animacji, którą chcesz przetestować, możesz przesunąć zegar do przodu, klikając advanceTimeBy.

Warto pamiętać, że advanceTimeBy nie przesuwa zegara dokładnie o określony czas. Zaokrągla ją w górę do najbliższego czasu trwania, który jest wielokrotnością czasu trwania klatki.

@get:Rule
val rule = createComposeRule()

@Test
fun testAnimationWithClock() {
    // Pause animations
    rule.mainClock.autoAdvance = false
    var enabled by mutableStateOf(false)
    rule.setContent {
        val color by animateColorAsState(
            targetValue = if (enabled) Color.Red else Color.Green,
            animationSpec = tween(durationMillis = 250)
        )
        Box(Modifier.size(64.dp).background(color))
    }

    // Initiate the animation.
    enabled = true

    // Let the animation proceed.
    rule.mainClock.advanceTimeBy(50L)

    // Compare the result with the image showing the expected result.
    // `assertAgainGolden` needs to be implemented in your code.
    rule.onRoot().captureToImage().assertAgainstGolden()
}

Optymalizowanie testów animacji

Podczas testowania animacji o wysokiej jakości często trzeba wyłączyć automatyczne przechodzenie do następnej klatki i ręcznie przechodzić przez klatki, aby potwierdzić pośrednie stany interfejsu. W przypadku tych konkretnych pętli klatka po klatce użyj metody runWithoutImplicitWait, aby wykonać potwierdzenia. Standardowe zapytania o węzły (np. onNodeWithTag lub fetchSemanticsNode) wywołują niejawne synchronizacje, które są zbędne gdy ręcznie sterujesz zegarem. Ich pominięcie znacznie przyspiesza czas wykonywania testów.

Wytyczne dotyczące użytkowania

  • Ręczne zarządzanie zegarem: używaj tego interfejsu API, gdy mainClock.autoAdvance jest ustawione na false, a interfejs jest w znanym, stabilnym stanie dla bieżącej klatki.
  • Wykonywanie w wątku UI: aby zapewnić stabilność drzewa interfejsu, wywołuj runWithoutImplicitWait w wątku UI, np. za pomocą runOnUiThread. Uruchomienie go poza wątkiem UI naraża test na sytuacje wyścigu i odczytywanie nieaktualnego stanu.
  • Potwierdzenia tylko do odczytu: blok powinien zawierać wyłącznie potwierdzenia tylko do odczytu. Wszystkie działania, które zmieniają stan, powinny być wykonywane poza tym blokiem.

Przykład

@Test
fun runWithoutImplicitWaitSample() = runComposeUiTest {
    setContent { MainScreen() }
    mainClock.autoAdvance = false

    // Trigger an animation
    onNodeWithText("Start Animation").performClick()

    // Step through the animation frame-by-frame
    while (hasPendingWork()) {
        mainClock.advanceTimeByFrame()
        waitForIdle()
        runOnUiThread {
            // Suppress implicit synchronization inside this block to avoid redundant
            // waits on each node query, making the frame assertions execute much faster.
            runWithoutImplicitWait {
                val box1 = onNodeWithTag("Box1").fetchSemanticsNode()
                val box2 = onNodeWithTag("Box2").fetchSemanticsNode()
                val box3 = onNodeWithTag("Box3").fetchSemanticsNode()

                // Assert the exact intermediate state of all three properties for this frame
                assert(box1.boundsInRoot.right <= box2.boundsInRoot.left)
                assert(box2.boundsInRoot.right <= box3.boundsInRoot.left)
            }
        }
    }
}