Підручник з тестування графічного інтерфейсу: Повна інструкція з тестування інтерфейсу користувача (UI)

gui testing tutorial

Повне керівництво з тестування графічного інтерфейсу: Підручник з тестування інтерфейсу користувача

Що таке тестування графічного інтерфейсу?

Тестування графічного інтерфейсу - це процес тестування графічного інтерфейсу програми для забезпечення належної функціональності відповідно до специфікацій. Він включає перевірку компонентів програми, таких як кнопки, піктограми, прапорці, колір, меню, вікна тощо.

найкраща безкоштовна програма для завантаження музики для android

Візуальна динаміка веб-програми відіграє ключову роль у прийнятті програми разом із користувачем.

Отже, це прийняття приносить довгострокову неволі клієнтів із заявкою клієнта. В цю епоху оцифрування Інтерфейс користувача швидко змінюється і утримує ключову фортецю для залучення нової натовпу можливих клієнтів.

Що ви дізнаєтесь:

• Тестування інтерфейсу користувача
• Підхід до тестування інтерфейсу користувача
• Поширені дефекти інтерфейсу користувача
• Основні вимоги до інтерфейсу та юзабіліті
• Деякі основні компоненти
• Деякі розширені компоненти
• Стани компонентів інтерфейсу користувача
• Інструменти тестування графічного інтерфейсу
• Зразки тестових випадків графічного інтерфейсу
• Висновок
• Рекомендована література

Тестування інтерфейсу користувача

Щоб візуальна естетика веб-додатків була прийнятою, тестування користувацького інтерфейсу та зручності користування стає ключовим аспектом загальної практики контролю якості. Будь-яка програма, до якої можна отримати доступ за допомогою URL-адреси, є веб-програмою. У таких додатках ми в основному тестуємо інтерфейс програми, який повинен використовувати кінцевий користувач.

Кожен браузер відображає веб-сторінки по-різному, тому важливо, щоб сторінка виглядала однаково в різних браузерах. Якщо веб-сторінка відображається спотвореною та некерованою, це призведе до перегляду глядачів із веб-сторінки. Тож веб-сайт повинен пройти тестування інтерфейсу для кращих результатів.

Тестування браузера складається з двох типів:

Перевірка функціональності

Тестування різних функцій у програмі. Він включає перевірку всіх навігацій, а також усіх значень полів, які присутні на перших кінцевих сторінках, використовуючи всі позитивні та негативні сценарії.

Тестування інтерфейсу користувача

Тестування фактора зовнішнього вигляду веб-сторінки. Фактор зовнішнього вигляду включає тип дисплея, шрифт, вирівнювання, перемикач, прапорець тощо.

• Тестування користувацького інтерфейсу - це зручність використання, зовнішній вигляд, елементи керування навігацією / навігаційні панелі, інструкції та стиль технічної інформації, зображення, таблиці, доступність тощо.
• Щоб перевірити доступність, ми маємо перевірити рекомендації щодо доступності веб-вмісту W3C.

Клацніть тут отримати рекомендації W3C.

Підхід до тестування інтерфейсу користувача

Ми вибираємо підмножину тестових кейсів із функціональних тестових кейсів, яка охоплює всі функціональні можливості програми.

Другим кроком є ​​модифікація цих тестових випадків відповідно до вимог тестування інтерфейсу користувача.

Наступним кроком буде виконання цих тестових кейсів; порівнюючи результат із очікуваними результатами, і якщо є якась різниця, то піднімайте питання для того самого. Це неможливо протестувати у всіх браузерах. Зазвичай клієнт вирішує, в якому браузері існує вимога для тестування.

Оскільки ми знаємо, що кожен браузер відображає веб-сторінку по-різному, тому ми не можемо очікувати, що всі браузери відображатимуть веб-сторінку точно так само.

Наприклад, випадаюче меню у windows-firefox буде відрізнятися від mac-firefox. Такі проблеми є прийнятними, оскільки це утиліти операційної системи, і ми повинні прийняти їх як такі.

Основний браузер: Зазвичай додаток розробляється для орієнтування на браузер, який, як очікується, буде використовуватися здебільшого кінцевими користувачами, він називається базовим браузером.

Поширені дефекти інтерфейсу користувача

• Проблеми з вирівнюванням кнопок
• Невідповідний простір між мітками або текстовими полями
• Поламані мітки, тобто однорядкова мітка відображається у два рядки
• Невідповідність текстових полів, піктограм інформації, міток або випадаючих списків
• Перекриття полів
• Не заповнені поля
• Дані на сторінці зміщені; якийсь час зміщується вгору або вниз
• У будь-якому браузері під час вибору якоїсь дії відповідна дія не відбувається
• Зміна розміру не працює, як очікувалося
• Час закінчення сеансу або дуже короткий, або дуже довгий для деяких браузерів
• Проблеми, пов’язані з браузером - Мало полів не можна редагувати після введення даних в одному браузері, але можна редагувати в іншому браузері

Основні вимоги до інтерфейсу та юзабіліті

Основними вимогами до тестування інтерфейсу веб-програми є:

1. Наявність різних компонентів в інтерфейсі користувача
2. Різні стани компонента інтерфейсу користувача

Компонент:

Компонент - це будівельний блок, який можна використовувати разом із кількома іншими компонентами для формування додатка. Компоненти можуть бути використані повторно у всій програмі.

Приклади компонента включають кнопку, текстове поле, автонавіювання, прапорець, розкривне меню тощо.

Деякі основні компоненти

Прапорець: Один або кілька варіантів можна вибрати з прапорця

Кнопки радіо: Коли потрібно вибрати лише один варіант, корисні перемикачі

Деякі розширені компоненти

1. Аккордеон: За допомогою цього компонента можна вертикально складати кілька предметів. Кожен елемент можна розгорнути, щоб переглянути вміст у ньому. Також можна розширити більше одного елемента.

2. Панірувальні сухарі: Це дуже корисний компонент, який допомагає в навігації веб-сайтами. Користувач може визначити своє поточне місцезнаходження на веб-сайті за цим компонентом.

3. Карусель: У компонент каруселі можна включити кілька наборів інформаційних елементів. Шукачі шляхів внизу вказують, що присутні більше предметів. Стрілки допомагають у навігації по каруселі. Зазвичай навігація на каруселі налаштована як безперервний цикл.

Клацніть тут щоб отримати більше корисної інформації про компоненти інтерфейсу користувача

Стани компонентів інтерфейсу користувача

Доступність компонентів ґрунтується виключно на вказівках щодо вимог проекту. Це буде відрізнятися від одного проекту до іншого.

Різні стани інтерфейсу користувача для базового компонента:

1. Незаповнена держава
2. Заповнений стан і у фокусі
3. Нормальний стан та стан за замовчуванням
4. Держава наведення
5. Інвалідна держава
6. Держава в масках

Незаповнений стан:

Перед введенням будь-якого значення в компоненті кажуть, що це незаповнений стан. У стані незаповнення відображається текст заповнювача, якщо такий є. Нижче наведено компонент текстового поля.

Заповнений стан:

Компонент зі значенням, введеним користувачем, заповнений.

Стан фокусу:

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

Нормальний стан:

Відображення компонента зі значенням, уже введеним користувачем на екрані, описується нормальним станом.

Стан за замовчуванням:

Компонент, який відображає автоматично заповнене значення із сервера / сервера. Це значення також може редагуватися користувачем у деяких сценаріях.

Штат наведення:

Наведення вказівника миші на компонент виділяє компонент, що вказує на дію наведення.

До наведення курсору:

При наведенні:

тестовий веб-сайт на вразливість введення SQL

Інвалід:

Компонент вимкнено, і користувач не може редагувати поля.

Увімкнений стан

Інвалідна держава

У замаскованому стані:

За допомогою цього компонента можна приховати конфіденційні дані, такі як пароль.

Основними вимогами до тестування МОЖЛИВОСТІ веб-програми є:

1. Сімейство шрифтів
2. Розмір шрифту
3. Колір
4. Інтервал між літерами
5. Висота лінії
6. Перевірка фону
7. Заповнення / Непрозорість
8. Вимірювання компонентів, таких як довжина, ширина та ширина
9. Розташування / інтервал між компонентами на екрані

Вищевказані функції зручності можна перевірити в коді або за допомогою елемента перевірки в додатку. Інший простіший спосіб - використовувати доповнення. Додатки можуть відрізнятися залежно від браузера, в якому програма повинна бути протестована.

Відомості про різні доповнення браузера

Переваги надбудов:

• Економить час
• Простий у використанні
• Це рентабельно

Обмеження надбудов:

• Помилка паралакса під час використання вимірювань
• Сумісний з усіма програмами
• Сумісний з багатьма браузерами

Посилання на надбудови:

• Веб-інспектор: Apple Dev Tools
• Пожежна помилка: Firebug Wiki
• Виміряйте ІТ
• Colorzilla

Інструменти тестування графічного інтерфейсу

У світі технологій доступно кілька інструментів, які допоможуть тестувальникам у тестуванні інтерфейсу користувача.

• Селен
• Єдине функціональне тестування HP
• Огірок
• Кодований інтерфейс
• Власне

Детальний перелік інструментів графічного інтерфейсу доступний на сайті sametestinghelp.com! Клацніть тут .

Зразки тестових випадків графічного інтерфейсу

1) Перевірте роботу стрілок каруселі та шукачів шляхів
2) Переконайтеся, що поле пароля приймає значення лише у маскованому стані
3) Переконайтеся, що кнопка «зберегти» залишається неактивною, поки не будуть введені всі обов’язкові поля
4) Переконайтеся, що користувачеві дозволено переходити до верхньої частини сторінки за допомогою панелі „Top“
5) Переконайтеся, що відображається належне повідомлення, коли застосовані фільтри не отримують результатів
6) Перевірте навігацію за посиланнями, доступними в колонтитулах
7) Перевірте правильність вирівнювання перемикачів
8) Переконайтеся, що одночасно можна вибрати кілька варіантів у прапорцях
9) Переконайтеся, що заголовок кожного розділу виділений жирним шрифтом
10) Перевірте зміну кольору гіперпосилань після клацання

Висновок

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

Рекомендована література

• Найкращі засоби тестування програмного забезпечення 2021 р. (Інструменти автоматизації тестування якості)
• Альфа-тестування та бета-тестування (повний посібник)
• Завантажити тестувальник електронних книг
• Функціональне тестування проти нефункціонального тестування
• Повне керівництво з тестування перевірки складання (тестування BVT)
• Що таке тестування інтерфейсу? Знати її типи, стратегію та інструменти
• Керівництво з контролю якості аутсорсингу: Тестування програмного забезпечення аутсорсингових компаній
• Типи тестування програмного забезпечення: різні типи тестування з деталями