Adding UI tests to our composables

Writing UI tests has been made easier for us. Jetpack Compose provides a set of testing APIs to find elements, verify their attributes, and perform actions on these elements. Jetpack Compose uses semantics to identify elements in our composables. Semantics are a way to describe the UI elements in our composables. Semantics are used by accessibility services to make our apps accessible. Testing dependencies are already set up as we created our new project in Chapter 2 so no need to add any dependencies. We have a number of composables on our project. For this chapter, we will write tests for the PetListItem composable.

Let us head over to the PetListItem.kt file. We need to add a testTags modifier to our composable. This is because we are using tags to identify our composables. In the PetListItem composable, modify the composable contents to be as follows:

ElevatedCard(
    modifier = Modifier
     ...