Software quality assurance days
17 Международная конференция
по вопросам качества ПО
sqadays.com
Минск. 29–30 мая 2015
Роман Савлюков
Wargaming. Киев, Украина
Эффективное тестирование сайта
на мобильных устройствах
О себе
• Роман Савлюков
• QA Engineer
• Manual, mobile, performance testing…
Мы обсудим
• Как определить список устройств для тестирования
• Конфигурации мобильных сайтов
• Estimation и тесты для мобильного сайта
Мы обсудим
Мы обсудим
Список устройств
всегда
утверждается клиентом
Список устройств для тестирования
Мы обсудим
Необходимо рекомендовать
свой перечень
устройств
Список устройств для тестирования
Мы обсудим
• Статистику использования в регионах, где
проживают клиенты вашего сайта
Запросить у заказчика или
выяснить самостоятельно
Необходимо учитывать:
Список устройств для тестирования
Мы обсудим
Необходимо учитывать:
• Фактическое наличие устройств для
разработки и тестирования
Сколько стоит закупить
новые устройства?
Список устройств для тестирования
Мы обсудим
Необходимо учитывать:
• Диапазон разрешений экрана
Будем поддерживать
все разрешения?
Список устройств для тестирования
Мы обсудим
Необходимо учитывать:
• Техническую сложность в реализации и
поддержке специфических устройств
IE Mobile, BlackBerry,
Opera Mobile etc. ?
Список устройств для тестирования
Мы обсудим
Необходимо учитывать:
• Временные затраты в целом на разработку,
тестирование и дальнейшую поддержку
Чем больше устройств –
тем больше времени понадобится.
Список устройств для тестирования
Мы обсудим
'Лучше поздно, чем никогда!' - подумал старый еврей,
положив голову на рельсы и
глянул вслед уходящему поезду.
Список устройств для тестирования
Финальный список устройств утверждает клиент
Мы обсудимКонфигурации мобильных сайтов
• Разный URL
• Динамический показ
• Адаптивный веб-дизайн
Мы обсудим
CSS + JS + Media CSS + JS + Media
Database
Конфигурация – Разный URL
Мы обсудим
Database + CSS + Java Script
CSS + JS + MediaCSS + JS + Media
Конфигурация – Динамический показ
Мы обсудим
Database + CSS + Java Script + Media
Конфигурация – Адаптивный дизайн
Мы обсудим
Конфигурация
URL
не изменяется
HTML + CSS + JS
не изменяется
Адаптивный дизайн
Динамический показ
Разные URL
Конфигурации мобильных сайтов
Мы обсудим
1. Определяем функциональность для тестирования
на эмуляторе и мобильных устройствах
2. Пишем тесты для эмулятора и мобильных устройств
Тест кейсы – Разный URL – Подход
Мы обсудим
Последовательность проверок:
1. Выполняем тесты предусмотренные для эмулятора
2. Выполняем тесты предусмотренные
для мобильных устройств
1) основной бизнес сценарий
2) сокращенные сценарии
Рекомендации – Разный URL
Мы обсудим
Google Developer Tools – F12
Эмуляторы мобильных браузеров
Мы обсудимCокращенные тестовые сценарий
1. Проверяют одну функцию
2. Каждый сценарий выполняется в горизонтальном
и вертикальном положении устройства
3. Выполняются только один раз, если повторяется
функциональность на разных страницах сайта
4. Должны быть объеденены в чек лист
Мы обсудим
1. Выделяем функциональность c общим и
индивидуальным содержанием HTML + CSS + JS
2. Определяем функциональность для тестирования
на эмуляторе и мобильных устройствах
3. Пишем тесты для эмулятора и
мобильных устройств
Тест кейсы – Динамический показ – Подход
Мы обсудимРекомендации – Динамический показ
Последовательность проверок:
1. Выполняем тесты предусмотренные для эмулятора
2. Выполняем тесты предусмотренные
для мобильных устройств
1) основной бизнес сценарий
2) сокращенные сценарии
Мы обсудимТест кейсы – Адаптивный дизайн - Подход
1. Выясняем различие между мобильной и
обычной версиями сайта
2. Пишем тесты для эмулятора и мобильных устройств
Мы обсудим
Последовательность проверок:
1. Выполняем все тесты предусмотренные
для обычной версии сайта
2. Выполняем все тесты предусмотренные
для мобильных устройств на эмуляторе
3. Выполняем все тесты предусмотренные
для мобильных устройств на устройствах:
1) основной бизнес сценарий
2) сокращенные сценарии
Рекомендации – Адаптивный дизайн
Мы обсудим
• код сторонних веб сервисов - 3th part
* * * *
Тесты для мобильных устройств
Мы обсудим
• масштабирование элементов на экране
Тесты для мобильных устройств
Мы обсудим
• анимация вместо mouse hover
на мобильных устройствах
Тесты для мобильных устройств
Мы обсудим
• нажатие по элементам на экране
touch - вместо клика
Тесты для мобильных устройств
Мы обсудимТесты для мобильных устройств
• открытие в новой вкладке через
программный интерфейс устройства
Мы обсудим
• ввод текста с экранной клавиатуры
Тесты для мобильных устройств
Мы обсудим
• скроллинг через touch по каруселям,
содержащим фото или текст
Тесты для мобильных устройств
Мы обсудим
• раскрывающиеся списки и вкладки с контентом
Тесты для мобильных устройств
Мы обсудимВыводы и оценка времени для тестирования
1. Учитываем конфигурацию сайта и
количество устройств
2. Основная часть проверок выполняется
на эмуляторах
3. Закладываем в 2 раза больше времени для
ручного тестирования на мобильных устройствах
4. Используем мобильные устройства, только
для сокращенных и основного бизнес сценариев
Мы обсудимВыводы и оценка времени для тестирования
5. Узнать что проверять на мобильных устройствах –
помогут разработчики
6. Используйте изменение ориентации экрана на
мобильном устройстве и эмуляторе
7. Выполняйте тесты параллельно на разных
устройствах
— Когда я ночью возвращаюсь домой, жена не говорит
ни слова, только смотрит на часы.
— Тебе еще везет! Моя смотрит на календарь.
Роман Савлюков
savlyukov@gmail.com

Эффективное тестирование сайта на мобильных устройствах

  • 1.
    Software quality assurancedays 17 Международная конференция по вопросам качества ПО sqadays.com Минск. 29–30 мая 2015 Роман Савлюков Wargaming. Киев, Украина Эффективное тестирование сайта на мобильных устройствах
  • 2.
    О себе • РоманСавлюков • QA Engineer • Manual, mobile, performance testing…
  • 3.
    Мы обсудим • Какопределить список устройств для тестирования • Конфигурации мобильных сайтов • Estimation и тесты для мобильного сайта Мы обсудим
  • 4.
    Мы обсудим Список устройств всегда утверждаетсяклиентом Список устройств для тестирования
  • 5.
    Мы обсудим Необходимо рекомендовать свойперечень устройств Список устройств для тестирования
  • 6.
    Мы обсудим • Статистикуиспользования в регионах, где проживают клиенты вашего сайта Запросить у заказчика или выяснить самостоятельно Необходимо учитывать: Список устройств для тестирования
  • 7.
    Мы обсудим Необходимо учитывать: •Фактическое наличие устройств для разработки и тестирования Сколько стоит закупить новые устройства? Список устройств для тестирования
  • 8.
    Мы обсудим Необходимо учитывать: •Диапазон разрешений экрана Будем поддерживать все разрешения? Список устройств для тестирования
  • 9.
    Мы обсудим Необходимо учитывать: •Техническую сложность в реализации и поддержке специфических устройств IE Mobile, BlackBerry, Opera Mobile etc. ? Список устройств для тестирования
  • 10.
    Мы обсудим Необходимо учитывать: •Временные затраты в целом на разработку, тестирование и дальнейшую поддержку Чем больше устройств – тем больше времени понадобится. Список устройств для тестирования
  • 11.
    Мы обсудим 'Лучше поздно,чем никогда!' - подумал старый еврей, положив голову на рельсы и глянул вслед уходящему поезду. Список устройств для тестирования Финальный список устройств утверждает клиент
  • 12.
    Мы обсудимКонфигурации мобильныхсайтов • Разный URL • Динамический показ • Адаптивный веб-дизайн
  • 13.
    Мы обсудим CSS +JS + Media CSS + JS + Media Database Конфигурация – Разный URL
  • 14.
    Мы обсудим Database +CSS + Java Script CSS + JS + MediaCSS + JS + Media Конфигурация – Динамический показ
  • 15.
    Мы обсудим Database +CSS + Java Script + Media Конфигурация – Адаптивный дизайн
  • 16.
    Мы обсудим Конфигурация URL не изменяется HTML+ CSS + JS не изменяется Адаптивный дизайн Динамический показ Разные URL Конфигурации мобильных сайтов
  • 17.
    Мы обсудим 1. Определяемфункциональность для тестирования на эмуляторе и мобильных устройствах 2. Пишем тесты для эмулятора и мобильных устройств Тест кейсы – Разный URL – Подход
  • 18.
    Мы обсудим Последовательность проверок: 1.Выполняем тесты предусмотренные для эмулятора 2. Выполняем тесты предусмотренные для мобильных устройств 1) основной бизнес сценарий 2) сокращенные сценарии Рекомендации – Разный URL
  • 19.
    Мы обсудим Google DeveloperTools – F12 Эмуляторы мобильных браузеров
  • 20.
    Мы обсудимCокращенные тестовыесценарий 1. Проверяют одну функцию 2. Каждый сценарий выполняется в горизонтальном и вертикальном положении устройства 3. Выполняются только один раз, если повторяется функциональность на разных страницах сайта 4. Должны быть объеденены в чек лист
  • 21.
    Мы обсудим 1. Выделяемфункциональность c общим и индивидуальным содержанием HTML + CSS + JS 2. Определяем функциональность для тестирования на эмуляторе и мобильных устройствах 3. Пишем тесты для эмулятора и мобильных устройств Тест кейсы – Динамический показ – Подход
  • 22.
    Мы обсудимРекомендации –Динамический показ Последовательность проверок: 1. Выполняем тесты предусмотренные для эмулятора 2. Выполняем тесты предусмотренные для мобильных устройств 1) основной бизнес сценарий 2) сокращенные сценарии
  • 23.
    Мы обсудимТест кейсы– Адаптивный дизайн - Подход 1. Выясняем различие между мобильной и обычной версиями сайта 2. Пишем тесты для эмулятора и мобильных устройств
  • 24.
    Мы обсудим Последовательность проверок: 1.Выполняем все тесты предусмотренные для обычной версии сайта 2. Выполняем все тесты предусмотренные для мобильных устройств на эмуляторе 3. Выполняем все тесты предусмотренные для мобильных устройств на устройствах: 1) основной бизнес сценарий 2) сокращенные сценарии Рекомендации – Адаптивный дизайн
  • 25.
    Мы обсудим • кодсторонних веб сервисов - 3th part * * * * Тесты для мобильных устройств
  • 26.
    Мы обсудим • масштабированиеэлементов на экране Тесты для мобильных устройств
  • 27.
    Мы обсудим • анимациявместо mouse hover на мобильных устройствах Тесты для мобильных устройств
  • 28.
    Мы обсудим • нажатиепо элементам на экране touch - вместо клика Тесты для мобильных устройств
  • 29.
    Мы обсудимТесты длямобильных устройств • открытие в новой вкладке через программный интерфейс устройства
  • 30.
    Мы обсудим • вводтекста с экранной клавиатуры Тесты для мобильных устройств
  • 31.
    Мы обсудим • скроллингчерез touch по каруселям, содержащим фото или текст Тесты для мобильных устройств
  • 32.
    Мы обсудим • раскрывающиесясписки и вкладки с контентом Тесты для мобильных устройств
  • 33.
    Мы обсудимВыводы иоценка времени для тестирования 1. Учитываем конфигурацию сайта и количество устройств 2. Основная часть проверок выполняется на эмуляторах 3. Закладываем в 2 раза больше времени для ручного тестирования на мобильных устройствах 4. Используем мобильные устройства, только для сокращенных и основного бизнес сценариев
  • 34.
    Мы обсудимВыводы иоценка времени для тестирования 5. Узнать что проверять на мобильных устройствах – помогут разработчики 6. Используйте изменение ориентации экрана на мобильном устройстве и эмуляторе 7. Выполняйте тесты параллельно на разных устройствах — Когда я ночью возвращаюсь домой, жена не говорит ни слова, только смотрит на часы. — Тебе еще везет! Моя смотрит на календарь.
  • 35.