Тест-кейсы для выпадающего списка

В данной статье мы рассмотрим процесс создания тест-кейсов для выпадающих списков (dropdown), уделяя внимание выбору опций, значениям по умолчанию и поведению в различных условиях.

Содержание:

Что такое выпадающий список?
Где используются выпадающие списки?
UI тест-кейсы для выпадающего списка
Функциональные тест-кейсы для выпадающего списка
Позитивные тест-кейсы для выпадающего списка
Негативные тест-кейсы для выпадающего списка
Заключение

Друзья, поддержите нас вступлением в наш телеграм канал QaRocks. Там много туториалов, задач по автоматизации и книг по QA.

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

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

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

Тест-кейс 1: Видимость выпадающего списка

Цель: Убедиться, что выпадающий список виден на странице.
Шаги:

Перейти на страницу с выпадающим списком.
Проверить видимость элемента выпадающего списка.

Ожидаемый результат: Выпадающий список должен быть четко виден и доступен пользователям.

Тест-кейс 2: Кликабельность выпадающего списка

Цель: Убедиться, что на выпадающий список можно нажать и он реагирует корректно.
Шаги:

Найти выпадающий список на интерфейсе.
Нажать на него, чтобы развернуть варианты.

Ожидаемый результат: При нажатии должны появляться опции выпадающего списка.

Тест-кейс 3: Размер и выравнивание выпадающего списка

Цель: Проверить, что размер и выравнивание списка соответствуют макету.
Шаги:

Сравнить размер и положение выпадающего списка с утвержденным дизайном (макетом).

Ожидаемый результат: Выпадающий список должен быть выровнен и иметь размеры в соответствии с макетом

Тест-кейс 4: Корректное отображение текста внутри выпадающего списка

Цель: Убедиться, что текст в выпадающем списке не обрезан и легко читаем.
Шаги:

Открыть выпадающий список.
Проверить, что текст внутри опций полностью отображается, без обрезки и наложения.

Ожидаемый результат: Текст в каждой опции должен быть полностью видимым и не должен пересекаться с границами списка.

Тест-кейс 5: Доступность всех опций

Цель: Убедиться, что все опции доступны и видны при развертывании выпадающего списка.
Шаги:

Нажать на выпадающий список для открытия опций.
Подсчитать количество отображаемых опций.

Ожидаемый результат: Все необходимые опции должны быть видны и доступны для выбора.

Тест-кейс 6: Отсутствие дублирующихся опций

Цель: Убедиться, что в выпадающем списке нет повторяющихся опций.
Шаги:

Развернуть выпадающий список.
Проверить опции на наличие дубликатов.

Ожидаемый результат: Каждая опция должна быть уникальной, без дублирующихся значений.

Тест-кейс 7: Проверка состояния при наведении курсора (hover)

Цель: Проверить, что при наведении на опцию изменяется её состояние в соответствии с дизайном.
Шаги:

Навести курсор на любую опцию выпадающего списка.

Ожидаемый результат: Опция должна визуально изменяться (например, изменять цвет фона или текста) в соответствии с дизайном.

Тест-кейс 8: Проверка адаптивности выпадающего списка

Цель: Убедиться, что выпадающий список адаптируется под разные размеры экрана.
Шаги:

Открыть страницу на устройстве с разными разрешениями экрана (мобильный, планшет, ПК).

Ожидаемый результат: Выпадающий список должен адаптироваться, не нарушая верстку и оставаться удобным для использования.

Тест-кейс 9: Проверка отображения длинных названий опций

Цель: Убедиться, что длинные названия опций корректно отображаются и не нарушают верстку.
Шаги:

Добавить длинные названия для нескольких опций.
Раскрыть выпадающий список и проверить их отображение.

Ожидаемый результат: Длинные названия опций должны отображаться полностью или сокращаться с помощью многоточия, не нарушая общей верстки.

Функциональные тест-кейсы для выпадающих списков помогают проверить, что они работают согласно ожиданиям. Вот несколько примеров:

Тест-кейс 1: Отображение опции по умолчанию

Цель: Проверить, что при загрузке страницы выпадающий список отображает правильную опцию по умолчанию.
Шаги:

Загрузить страницу.
Проверить значение по умолчанию в выпадающем списке.

Ожидаемый результат: Опция по умолчанию должна соответствовать ожидаемому результату, согласно требованиям.

Тест-кейс 2: Функциональность выбора опции

Цель: Убедиться, что при выборе опции выпадающий список корректно обновляет отображаемое значение.
Шаги:

Нажать на выпадающий список, чтобы отобразить опции.
Выбрать опцию из списка.

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

Тест-кейс 3: Навигация с помощью клавиатуры

Цель: Проверить, что пользователи могут управлять выпадающим списком с помощью клавиатуры.
Шаги:

Нажать на выпадающий список, чтобы развернуть его.
Использовать клавиши со стрелками для перемещения по опциям.
Нажать клавишу “Enter”, чтобы выбрать опцию.

Ожидаемый результат: Выпадающий список должен позволять навигацию по опциям с помощью клавиатуры, а выбранная опция должна корректно обновляться.

Тест-кейс 4: Механизм закрытия выпадающего списка

Цель: Проверить, что выпадающий список закрывается при нажатии за его пределами.
Шаги:

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

Ожидаемый результат: Выпадающий список должен закрыться, и выбранная опция остаться неизменной.

Тест-кейс 5: Динамическая загрузка опций

Цель: Убедиться, что опции в выпадающем списке обновляются динамически в зависимости от пользовательских действий или других выборов.
Шаги:

Вызвать событие (например, выбрать связанную опцию), которое изменяет опции выпадающего списка.
Развернуть выпадающий список снова.

Ожидаемый результат: Новые опции должны корректно отображаться и быть доступны для выбора.

Тест-кейс 6: Проверка ограничения на количество опций

Цель: Убедиться, что количество опций в выпадающем списке не превышает установленный лимит.
Шаги:

Вызвать загрузку опций в выпадающем списке.
Подсчитать количество отображаемых опций.

Ожидаемый результат: Количество опций не должно превышать установленный лимит.

Тест-кейс 7: Взаимодействие с отключенным выпадающим списком

Цель: Убедиться, что с отключенным выпадающим списком нельзя взаимодействовать.
Шаги:

Найти отключенный выпадающий список на странице.
Попробовать нажать на него.

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

Примечание редакции: вас также может заинтересовать статья Тест-кейсы для выпадающего списка (dropdown)

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

Тест-кейс 1: Обновление значения при выборе

Цель: Проверить, что при выборе опции из выпадающего списка отображаемое значение обновляется корректно.
Шаги:

Нажать на выпадающий список, чтобы отобразить доступные опции.
Выбрать опцию из списка.

Ожидаемый результат: Выпадающий список должен закрыться, а выбранная опция должна быть отображена в поле.

Тест-кейс 2: Доступные опции на основе прав пользователя

Цель: Убедиться, что опции в выпадающем списке динамически отображаются в зависимости от прав пользователя.
Шаги:

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

Ожидаемый результат: Выпадающий список должен отображать только те опции, которые разрешены для данного пользователя, соблюдая права доступа.

Тест-кейс 3: Вызов системной реакции при выборе опции

Цель: Проверить, что при выборе опции вызывается соответствующая системная реакция.
Шаги:

Выбрать опцию в выпадающем списке, связанную с определенным действием (например, “Загрузить данные”).
Проверить как реагирует система на изменение опций

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

Тест-кейс 4: Доступность выпадающего списка

Цель: Убедиться, что опции выпадающего списка доступны для навигации с помощью клавиатуры.
Шаги:

Переместить фокус на выпадающий список с помощью клавиши Tab.
Использовать клавиши со стрелками для навигации по опциям.
Нажать Enter для выбора опции.

Ожидаемый результат: Выпадающий список должен позволять навигацию по опциям с помощью клавиатуры, и выбранная опция должна корректно обновляться, как при клике мышью.

Тест-кейс 5: Одновременный ввод с клавиатуры и мыши

Цель: Убедиться, что выпадающий список может обрабатывать одновременные действия при выборе с использованием клавиатуры и мыши.
Шаги:

Во время выбора опции с клавиатуры быстро щелкнуть по другой опции мышью.

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

Негативные тест-кейсы для выпадающих списков важны для проверки того, как система справляется с неожиданными или ошибочными действиями. Примеры таких сценариев:

Тест-кейс 1: Выбор неактивной опции

Цель: Проверить реакцию системы при попытке выбрать неактивную или отключённую опцию.
Шаги:

Попробовать выбрать отключённую опцию в выпадающем списке.

Ожидаемый результат: Неактивная опция не должна выбираться, система должна выдать предупреждение или информативное сообщение о недоступности опции.

Тест-кейс 2: Неверный ввод

Цель: Проверить поведение системы при вводе недопустимого значения, где возможен ввод с клавиатуры.
Шаги:

Сфокусироваться на выпадающем списке и попытаться ввести недопустимое значение, которое не соответствует доступным опциям.

Ожидаемый результат: Выпадающий список не должен принимать недопустимое значение и должен либо вернуться к последнему корректному выбору, либо отобразить сообщение о некорректном вводе.

Тест-кейс 3: Навигация по несуществующим опциям с клавиатуры

Цель: Оценить реакцию выпадающего списка на попытки навигации с клавиатуры через несуществующие или неуместные опции.
Шаги:

Попробовать переместиться за пределы доступных опций с помощью клавиш со стрелками.

Ожидаемый результат: Выпадающий список должен либо замкнуть навигацию, либо отобразить сообщение о достижении границ доступных опций.

Тест-кейс 4: Обновление страницы во время выбора

Цель: Определить, как система справляется с обновлением страницы во время выбора опции.
Шаги:

Выбрать опцию и сразу обновить страницу.

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

Заключение

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

Перевод статьи «How To Write Test Cases For Dropdown | Dropdown List».