Jetpack Compose Academy · Урок

Семантика и тестовые метки

Делайте интерфейс пригодным для тестирования и доступным.

«Семантика и тестовые метки» — бесплатный урок Jetpack Compose Academy на CoddyKit. Это урок 3 из 4. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения Jetpack Compose Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс Jetpack Compose Academy содержит 4 уроков всего.

Части этого урока еще не переведены и отображаются на английском.

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. 🌳

Часто задаваемые вопросы

Урок «Семантика и тестовые метки» бесплатный?

Да — полный текст урока «Семантика и тестовые метки» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс Jetpack Compose Academy, подпишись на CoddyKit PRO. Курс Jetpack Compose Academy содержит 4 уроков всего.

Чему я научусь в уроке «Семантика и тестовые метки»?

Делайте интерфейс пригодным для тестирования и доступным. Ты практикуешь Jetpack Compose Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.

Нужен ли мне опыт, чтобы начать Jetpack Compose Academy?

Предыдущий опыт не требуется. Jetpack Compose Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 3 из 4.

Сколько времени занимает урок «Семантика и тестовые метки»?

Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.

Можно ли писать и запускать код в этом уроке Jetpack Compose Academy?

Да. Каждый урок Jetpack Compose Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.

Все уроки этого курса

← Назад к Jetpack Compose Academy