Как проверить Dynamic Type в интерфейсе iOS

Как проверить Dynamic Type в интерфейсе iOS

При стандартном размере текста на экране подтверждения заказа полностью видны адрес и кнопка отправки. Но стоит пользователю увеличить текст на iPhone, как кнопку перекрывает закреплённая внизу панель. При разовом просмотре экрана на машине разработчика такую проблему легко пропустить: Dynamic Type меняет не только размер букв, но и переносы строк, высоту ячеек и область прокрутки. Ниже мы зафиксируем условия проверки в симуляторе iOS на удалённом Mac, а затем с помощью UI-тестов проверим ключевые действия пользователя.

Определить экран и критерии прохождения

Выберите реальный экран с большим объёмом содержимого: например, подтверждение заказа, подробные настройки или описание ошибки. Запишите проект Xcode, схему, устройство симулятора, среду выполнения iOS и состояние тестовой учётной записи. Для дальнейших сравнений используйте один и тот же набор условий. Если удалённым Mac пользуются несколько человек, выделите для этой проверки отдельное устройство симулятора, чтобы другая задача не изменила размер текста или не удалила данные приложения.

Сначала перечислите действия, которые пользователь должен суметь выполнить на экране, и только затем сформулируйте проверки. Как минимум стоит проверить, что заголовок читается, основная кнопка работает, длинное описание можно прокрутить до конца, а возврат доступен. Одной проверки наличия элемента недостаточно, чтобы убедиться, что текст не обрезан.

Что проверяем Проверяемое условие прохождения Что проверить вручную
Заголовок экрана Находится ожидаемый идентификатор доступности Не перекрывает ли текст соседнее содержимое после переноса
Основное действие После прокрутки кнопку можно нажать и перейти в ожидаемое состояние Полностью ли виден текст кнопки
Длинное описание Последний фрагмент можно прокрутить до видимой области Не обрезан ли текст у края контейнера

Разделите расплывчатое «выглядит нормально» на проверяемые действия и снимки экрана, которые нужно просмотреть. Автоматические проверки выявят явные сбои, а снимки помогут заметить визуальные проблемы, для которых ещё нет проверок.

Зафиксировать симулятор и менять размер текста

На удалённом Mac сначала убедитесь, что инструменты командной строки Xcode указывают на нужную версию, затем выведите список доступных устройств. Не рассчитывайте, что booted всегда означает одно и то же устройство: при параллельной работе на машине могут быть запущены несколько симуляторов. Сохраните UDID выбранного устройства в конфигурации задачи и после запуска дождитесь завершения загрузки системы.

xcode-select -p
xcrun simctl list devices available
export SIM_UDID="从上一步选择的设备 UDID"
xcrun simctl boot "$SIM_UDID"
xcrun simctl bootstatus "$SIM_UDID" -b
xcrun simctl help ui

Если устройство уже запущено, boot сообщит о его текущем состоянии. Проверьте UDID и сразу выполните bootstatus. Допустимые значения размера текста для simctl ui сверяйте со справкой установленных инструментов: не переносите в скрипт названия уровней, которые принимает другая версия Xcode. Передайте задаче значение уровня, проверенное по локальной справке, например через переменную окружения TEXT_SIZE, затем выполните:

: "${TEXT_SIZE:?set a supported content size}"
xcrun simctl ui "$SIM_UDID" content_size "$TEXT_SIZE"
xcrun simctl ui "$SIM_UDID" content_size

Проверьте как минимум размер по умолчанию, один увеличенный размер и максимальный размер, который продукт обязуется поддерживать. Не ограничивайтесь крайними значениями: на промежуточном уровне заголовок может перейти на дополнительную строку, хотя раскладка, предусмотренная для максимального размера, ещё не сработает. После каждого изменения перезапускайте проверяемое приложение, чтобы не тестировать экран в состоянии, сохранённом до переключения.

Проверять действия пользователя в UI-тесте

Назначьте ключевым элементам приложения стабильные идентификаторы доступности, например checkout.title, checkout.submit и checkout.lastNote. Идентификатор должен обозначать функцию элемента, а не зависеть от текста кнопки, который меняется при локализации. Тест должен открывать экран подтверждения с одной и той же начальной страницы. Если требуется вход или подготовка данных, используйте существующее тестовое окружение проекта и не записывайте настоящие учётные данные в код или журналы тестов.

Следующий фрагмент XCTest показывает, что именно следует проверять. Навигацию и идентификатор успешного состояния замените в соответствии с проектом. На длинном экране сначала прокрутите содержимое, затем проверьте, доступны ли последний фрагмент и кнопка:

let app = XCUIApplication()
app.launch()
let title = app.staticTexts["checkout.title"]
XCTAssertTrue(title.waitForExistence(timeout: 10))

let page = app.scrollViews["checkout.content"]
let lastNote = app.staticTexts["checkout.lastNote"]
for _ in 0..<6 where !lastNote.isHittable {
    page.swipeUp()
}
XCTAssertTrue(lastNote.isHittable)

let submit = app.buttons["checkout.submit"]
for _ in 0..<6 where !submit.isHittable {
    page.swipeUp()
}
XCTAssertTrue(submit.isHittable)
submit.tap()
XCTAssertTrue(app.staticTexts["checkout.success"].waitForExistence(timeout: 10))

Если экран не построен на ScrollView, не подгоняйте его под селектор из примера ради прохождения теста: скорректируйте селектор с учётом фактического контейнера. Ограничение числа прокруток не даст тесту ждать бесконечно при сломанной раскладке. Но доступность кнопки для нажатия всё ещё не доказывает, что её текст виден полностью, поэтому сохраняйте и снимки экрана.

Сохранять результаты для каждого размера и искать причину сбоя

Для каждого уровня сохраняйте UDID устройства, среду выполнения, версию Xcode, размер текста и результат теста. При сбое сначала сохраните вложения UI-теста, затем повторите запуск с тем же размером текста и сделайте снимок симулятора. Включайте в имя файла размер текста и название экрана, чтобы параллельные задачи не перезаписывали снимки друг друга. Для снимка из командной строки можно выполнить xcrun simctl io "$SIM_UDID" screenshot output.png; в рабочей задаче замените фиксированное имя файла собственным уникальным путём вывода.

При просмотре снимка начинайте поиск причины с внешних контейнеров раскладки. В контейнере заголовка с фиксированной высотой вторая строка часто исчезает; расположенные горизонтально подпись и сумма конкурируют за ширину; плавающая кнопка у нижнего края экрана может закрывать последний абзац. В первую очередь позвольте контейнеру с текстом увеличиваться по содержимому. При необходимости расположите элементы вертикально и оставьте внизу прокручиваемой области место для кнопки. Не скрывайте проблему с крупным текстом, уменьшая шрифт.

Если тест «иногда проходит», сначала проверьте, всегда ли он использует один и тот же UDID, перезапускается ли приложение после смены размера текста и не выбирает ли проверка одноимённый элемент за пределами экрана. Исправляйте раскладку лишь после того, как убедитесь в стабильности условий: иначе изменение состояния устройства можно ошибочно принять за регрессию в коде.

Превратить проверку в поддерживаемый чек-лист

Укажите устройство, среду выполнения и поддерживаемые размеры текста в конфигурации тестовой задачи и запускайте один и тот же набор UI-тестов для каждого размера. При каждом сбое сохраняйте размер текста, место неудачной проверки и снимок экрана. После исправления повторно проверяйте как минимум проблемный и соседние уровни. Для обрезания и наложения элементов, которые нельзя надёжно выявить автоматически, предусмотрите просмотр снимков: не делайте вывод о готовности к выпуску лишь потому, что «элемент существует».

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

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

Достаточно ли проверить только максимальный размер текста?

Нет. Проверьте стандартный, увеличенный и максимальный поддерживаемый размеры: на промежуточном уровне перенос строк может вызвать отдельный дефект.

Если UI-тест нашёл элемент, значит ли это, что экран прошёл проверку?

Нет. Нужно также проверить доступность важных действий, прокрутку до нужного содержимого и снимок экрана при сбое.

Доверьте следующую сборку выделенному облачному Mac.

Сравните модели, регионы и сроки аренды ViewMini, а затем выберите физический узел для своего рабочего процесса.

Настроить облачный Mac

Проверьте параметры устройства и срок аренды.

Три модели доступны с оплатой за день, неделю, месяц или квартал. Перед заказом ознакомьтесь со всеми тарифами.

Модели и цены Настроить облачный Mac