О компании

Внедрение системы автоматического тестирования сайтов

Разработали и внедрили систему автоматического тестирования ВСЕХ(!) сайтов с помощью Nightwatch.js и Selenium. Задачи об ошибках ставятся в корпоративную систему управления проектами.

Автор: Егор Лебедев и Денис Сахаров

Разработали и внедрили систему автоматического тестирования ВСЕХ(!) сайтов с помощью Nightwatch.js и Selenium. Задачи об ошибках ставятся в корпоративную систему управления проектами. Одна задача равна одному типу теста. В тексте задачи разработчик видит список ссылок на страницы, где данный тест провалился.

Разработали и внедрили систему автоматического тестирования сайтов с помощью Nightwatch.js и Selenium

Автором выступил наш старший разработчик — Егор Лебедев, который по результатам разработки был переаттестован в Ведущего.

Этапы реализации

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

Примеры тестов

  • Битые ссылки на сайте
  • Тест тэга < / >
    • Не у всех < > присутствует атрибут title
    • Не у всех < > заполнен title
    • Не у всех < > присутствует атрибут href
    • Не у всех < > заполнен href
  • Сообщить об ошибке
    • Отсутствует ссылка "Сообщить об ошибке"
    • В ссылке "Сообщить об ошибке" нет параметра email
    • В ссылке "Сообщить об ошибке" нет параметра email_required
  • Ошибки в консоли
  • Тест Doctype
    • Не соответствует формату <!DOCTYPE html>
    • Отсутствует или есть некорректные символы перед <!DOCTYPE html>
  • Favicon
    • Отсутсвует favicon
    • Отсутсвует favicon 16x16
    • Отсутсвует favicon 32x32
    • Отсутствует favicon для ios safari
    • Отсутствует favicon для ios safari 180x180
    • Отсутствует mask icon для safari
    • Отсутствует цвет у mask icon для safari
    • Отсутствует theme-color
    • Отсутствует ms TileColor
    • Отсутствует web app manifest для android
    • Отсутствует icon для android 192x192
    • Отсутствует icon для android 512x512
    • Неверный формат site.webmanifest
    • Неполное содержимое site.webmanifest, отсутсвуют icons
    • Неверный формат browserconfig.xml
    • Отсутствует файл msconfig
    • Отсутствует файл android manifest
    • Битая ссылка на файл внутри манифеста
  • Присутствует тег <font>
  • <h1> не указан", "<h1> пуст", "<h1> встречается больше чем 1 раз
  • Горизонтальный скролл
    • Наличие горизонтального скролла при ширине 1024
    • Наличие горизонтального скролла при ширине 812
    • Наличие горизонтального скролла при ширине 1280
    • Наличие горизонтального скролла при ширине 1080
    • Наличие горизонтального скролла при ширине 760
    • Наличие горизонтального скролла при ширине 667
  • Тест тега <img>
    • Не у всех <img> присутствует атрибут alt
    • Не у всех <img> заполнен атрибут alt
    • Не у всех <img> присутствует атрибут src
    • Не у всех <img> заполнен атрибут src
  • Инлайновые стили
    • Присутствует атрибут style
  • Ссылки на главную страницу
    • Ссылок на главную меньше 2 шт. Отсутствуют ссылки в хэдере или футере
    • Отсутствует хотя бы 1 ссылка в логотипе
  • Проверка наличия tel: и mailto: в телефонных номерах и email
    • Есть элементы с номером телефона без tel: в ссылке
    • Есть элементы с email адресом без mailto: в ссылке
  • Тест meta [name=description
    • meta [name=description не задан
    • meta [name=description пуст
    • Тест meta [name=viewport
    • meta [name=viewport не задан
    • meta [name=viewport пуст
    • meta [name=viewport не правильное значение масштаба области просмотра
    • meta [name=viewport неправильное значение масштабирования
    • страницыmeta [name=viewport не правильное значение горизонтальной области просмотра
    • meta [name=viewport не правильное значение вертикальной области просмотра
    • meta [name=viewport значение вертикальной области просмотра не в диапазоне
    • meta [name=viewport значение горизонтальной области просмотра не в диапазоне
  • Стандарт публикации - логическая вложенность заголовков
    • Ошибка вложенности заголовков в паре <h1> <h3>
    • Ошибка вложенности заголовков в паре <h1> <h4>
    • Ошибка вложенности заголовков в паре <h1> <h5>
    • Ошибка вложенности заголовков в паре <h1> <h6>
    • Ошибка вложенности заголовков в паре <h2> <h4>
    • Ошибка вложенности заголовков в паре <h2> <h5>
    • Ошибка вложенности заголовков в паре <h2> <h6>
    • Ошибка вложенности заголовков в паре <h3> <h5>
    • Ошибка вложенности заголовков в паре <h3> <h6>
    • Ошибка вложенности заголовков в паре <h4> <h6>
  • Opengraph tags
    • Тэг meta property="og:title" присутствует в количестве больше одного
    • Тэг meta property="og:description" присутствует в количестве больше одного
    • Тэг meta property="og:image" присутствует в количестве больше одного
    • Тэг meta property="og:image:width" присутствует в количестве больше одного
    • Тэг meta property="og:image:height" присутствует в количестве больше одного
    • Тэг meta property="og:type" присутствует в количестве больше одного
    • Тэг meta property="og:url" присутствует в количестве больше одного
    • Тэг meta property="og:locale" присутствует в количестве больше одного
    • Тэг meta property="og:title" отсутствует
    • Тэг meta property="og:description" отсутствует
    • Тэг meta property="og:image" отсутствует
    • Тэг meta property="og:image:width" отсутствует
    • Тэг meta property="og:image:height" отсутствует
    • Тэг meta property="og:type" отсутствует
    • Тэг meta property="og:url" отсутствует
    • Тэг meta property="og:locale" отсутствует
    • В теге meta property="og:title" отсутствует атрибут content
    • В теге meta property="og:description" отсутствует атрибут content
    • В теге meta property="og:image" отсутствует атрибут content
    • В теге meta property="og:image:width" отсутствует атрибут content
    • В теге meta property="og:image:height" отсутствует атрибут content
    • В теге meta property="og:type" отсутствует атрибут content
    • В теге meta property="og:url" отсутствует атрибут content
    • В теге meta property="og:locale" отсутствует атрибут content
    • В теге meta property="og:title" атрибут content пустой
    • В теге meta property="og:description" атрибут content пустой
    • В теге meta property="og:image" атрибут content пустой
    • В теге meta property="og:image:width" атрибут content пустой
    • В теге meta property="og:image:height" атрибут content пустой
    • В теге meta property="og:type" атрибут content пустой
    • В теге meta property="og:url" атрибут content пустой
    • В теге meta property="og:locale" атрибут content пустой'
    • Тэг meta содержит Cetera Wireframes
    • Тэг meta ссылается на Cetera Wireframes
  • Стандарт публикации - абсолютные ссылки
    • Абсолютный путь в атрибуте "href"
    • Абсолютный путь в атрибуте "src"
    • Абсолютный путь в атрибуте "action"
    • В атрибутах присутствует ссылка на beta
    • Стандарт публикации - Foundation .responsive-embed
    • Тег <iframe> не обёрнут в div.responsive-embed
    • Тег <object> не обёрнут в div.responsive-embed
    • Тег <embed> не обёрнут в div.responsive-embed
  • Стандарт публикации - html символы в title и meta
    • Присутствуют HTML символы в meta_description
    • Присутствуют HTML символы в meta_keywords
    • Присутствуют HTML символы в title
  • Стандарты публикации- типографика
    • Обнаружен Soft Hyphen (SHY) символ
    • Отсутствуют пробельные символы возле тире
    • Дефис окружен пробельными символами
    • Кавычки не соответствуют стандарту
    • Наличие троеточий ... не в один символ: …
    • Наличие пробела перед знаком препинания
    • Символы +- должны быть объединены в знак ±
    • Степень не обрамлена в тег <sup>
    • Дроби не заменены специальными символами. Пример: ¼
    • Дроби не заменены специальными символами (обратный слэш). Пример: ¼
    • Не заменены символы: TM -> ™
    • Не заменены символы: (R) -> ®
    • Не заменены символы: (C) -> ©
    • Стрелка -> не заменена на специальный символ →
    • Стрелка <- не заменена на специальный символ ←
    • Стрелка <-> не заменена на специальный символ ⇆
    • Присутствуют лишние пробелы между словами или цифрами
  • Название страницы
    • <title> пуст
  • W3C
    • Не пройдена валидация w3c

В итоге мы получили систему, которая автоматически по некоторому расписанию ходит на ВСЕ (ЭТО КЛЮЧЕВОЕ СЛОВО В СТАТЬЕ, КЛЮЧЕВОЕ ДОСТИЖЕНИЕ ЭТОГО ПРОЕКТА) обслуживаемые нами сайты и тестирует их. Система позволяет писать специфичные тесты под каждый обслуживаемый сайт. От идеи до реализации прошло около года, срок активной разработки — 2-3 месяца.

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

Автор