Semântica e Etiquetas de Teste
Torne a interface testável e acessível.
Semântica e Etiquetas de Teste é uma aula grátis de Jetpack Compose Academy no CoddyKit. Esta é a aula 3 de 4. Você pode ler a aula completa abaixo gratuitamente — depois pratica ao vivo no navegador com um editor de código integrado e um tutor de IA 24/7. Faz parte do caminho de aprendizado de Jetpack Compose Academy, e seu progresso é sincronizado entre a web e o app CoddyKit. O curso de Jetpack Compose Academy inclui 4 aulas no total.
Partes desta aula ainda não foram traduzidas e aparecem em inglês.
The Semantics Tree
Compose builds a semantics tree next to the visual one. It describes what each element means, and it is exactly what both tests and screen readers read.
Why Semantics Matter
If a node carries no meaning in the tree, finders cannot reach it and TalkBack cannot announce it. Good semantics make your app both testable and accessible. ♿
Content Descriptions Add Meaning
Icons and images carry no text, so give them a contentDescription. It feeds the semantics tree, letting tests find them and screen readers describe them.
Icon(Icons.Default.Add,
contentDescription = "Add item")When Text Is Not Unique
Sometimes many nodes share the same text and a text finder gets confused. You need a stable handle that does not depend on the visible label.
Introducing testTag
A testTag is an invisible identifier you attach with a Modifier. It gives a node a unique name for tests without affecting how it looks.
Box(Modifier.testTag("avatar"))Finding by Tag
Once tagged, locate the node with onNodeWithTag. This is rock-solid even when text changes across languages or states.
composeTestRule.onNodeWithTag("avatar")
.assertIsDisplayed()Quick Check
Several buttons share the label Done, so a text finder is ambiguous. What gives one button a unique, invisible handle for tests?
Tags vs Descriptions
Keep them separate: contentDescription serves real users, while testTag exists only for tests. Do not overload one to do the other's job.
The semantics Modifier
For full control, the semantics modifier lets you set custom properties, like marking a node as a heading for accessibility tools.
Modifier.semantics { heading() }Merging Descendants
Compose can merge a parent and its children into one node with mergeDescendants. That makes a whole row announce as a single, friendly unit.
Modifier.semantics(mergeDescendants = true) {}Print the Tree to Debug
Stuck on a missing node? Call printToLog on the root to dump the full semantics tree, then read exactly what is available to match.
rule.onRoot().printToLog("TREE")Design for Testability
Adding clear descriptions and tags as you build means your tests almost write themselves. Accessible apps and testable apps grow from the same habits.
Recap: Semantics & Tags
The semantics tree powers both testing and accessibility. Use contentDescription for users and testTag for tests to keep your UI easy to verify. 🌳
Perguntas Frequentes
A aula “Semântica e Etiquetas de Teste” é grátis?
Sim — o texto completo de “Semântica e Etiquetas de Teste” é grátis para ler aqui na web. Para praticá-la interativamente (um editor de código integrado e um tutor de IA 24/7) e desbloquear o restante do curso de Jetpack Compose Academy, atualize para CoddyKit PRO. O curso de Jetpack Compose Academy inclui 4 aulas no total.
O que vou aprender em “Semântica e Etiquetas de Teste”?
Torne a interface testável e acessível. Você pratica Jetpack Compose Academy com código prático que executa diretamente no navegador, e um tutor de IA 24/7 responde suas dúvidas enquanto trabalha na aula.
Preciso ter experiência prévia para começar Jetpack Compose Academy?
Nenhuma experiência prévia é necessária. Jetpack Compose Academy no CoddyKit é estruturado para alunos iniciantes até avançados, então você pode começar aqui ou desde o início e aprender no seu ritmo. Esta é a aula 3 de 4.
Quanto tempo leva a aula “Semântica e Etiquetas de Teste”?
A maioria das aulas CoddyKit leva cerca de 5–10 minutos. Cada uma é compacta e interativa, então você faz progresso constante e retoma exatamente de onde parou entre web e app.
Posso escrever e executar código nesta aula de Jetpack Compose Academy?
Sim. Cada aula de Jetpack Compose Academy inclui um editor de código integrado, então você escreve e executa código real direto no navegador e recebe feedback de IA instantaneamente — nenhuma configuração local necessária.
Todas as aulas deste curso
- createComposeRule e Localizadores
- Verificações e Execução de Ações
- Semântica e Etiquetas de Teste
- Testando ViewModels e Flows