⏭ Приручаем Paparazzi для проверки TalkBack

Всем привет, это Владислав Шиляев, я разрабатываю Android-приложение Яндекс Почты и отвечаю за то, чтобы Почта оставалась в топе рейтинга доступности. Почта — массовый продукт, и мы хотим, чтобы приложением было удобно пользоваться всем, в том числе и людям с особенностями зрения.

В Compose за доступность отвечает семантика — информация о смысле и роли каждого элемента интерфейса. Эти характеристики собираются в семантическое дерево и передаются сервисам доступности вроде TalkBack. Встроенные компоненты поддерживают семантику из коробки, но для кастомных её приходится строить вручную, и ошибиться в этом процессе легко.

🟠 Сначала мы попробовали простое решение: сохранять семантическое дерево в файл функцией Compose UI Test printToString и сравнивать снапшоты между прогонами. Подход рабочий, но текстовый дифф получался огромным и нечитаемым.

🟠 Тогда мы подключили библиотеку для скриншот-тестов Paparazzi и её расширение AccessibilityRenderExtension. Оно рисует поверх скриншота важные для доступности свойства: например, у кнопки «Назад» сразу видно подписи Back и Button. Такой снапшот легко оценить визуально, и ревью снова стало осмысленным.

🔮 Отдельно пришлось повозиться с CI: локальные скриншоты с macOS отличались от тех, что рендерил Linux CI, из-за разного сглаживания шрифтов. Baseline мы стали записывать только на CI. А скриншоты, которые не совпали, перекладывает в репозиторий сама кастомная Gradle-задача.

🎲 Подробности и код смотрите на Хабре. В статье я разбираю, что такое доступность приложения в понимании разработчика и сколько времени занимает интеграция и поддержка нашего подхода к снапшот-тестам.

Подписывайтесь:
💬 @Yandex4Mobile
📹 @YandexforMobile