Расширения Chrome для тестировщиков

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

Подпишитесь на наш ТЕЛЕГРАМ КАНАЛ ПО АВТОМАТИЗАЦИИ ТЕСТИРОВАНИЯ

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

Содержание

• Наиболее часто используемые инструменты
• Расширения Chrome для тестирования пользовательского интерфейса
• Расширения Chrome для исследовательского тестирования
• Расширения Chrome для тестирования доступности
• Расширения Chrome для тестирования API
• Расширения Chrome для тестирования на проникновение
• Расширения Chrome для скриншотов
• Тестирование куки-файлов сайта

Наиболее часто используемые расширения

TOUCH VPN

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

Touch VPN – отличный вариант с учетом качества. Это бесплатная и неограниченная услуга, имеющая множество преимуществ:

• Доступен для всех устройств
• Работает на множестве ОС
• Более 5900 серверов
• Интуитивно понятный пользовательский интерфейс
• Легко настраиваемый

Это расширение эффективно для тестирования программного обеспечения, поскольку оно работает в более чем в 90 странах. Таким образом, вы можете быстро переключаться между GeoIP-адресами во время тестирования геолокации.

JavaScript Pause/Resume

JavaScript – по многим причинам особенный язык. Однако одним из его недостатков является асинхронность. Другими словами, вы не можете отложить выполнение программы на определенное время.

Расширение JavaScript Pause/Resume позволяет создавать интервалы во время выполнения кода для выполнения других задач. С этим расширением у вас гораздо больше шансов избежать “ада колбэков”.

Clear Cache

Кэш необходимо периодически очищать, чтобы избежать таких проблем, как задержки, повреждение данных и угроза безопасности. Обычная процедура очистки кэша в Chrome занимает 6 шагов и включает некоторую прокрутку и поиск. Чтобы упростить и ускорить эту задачу, расширение Clear Cache реализует ту же функцию, но одним щелчком мыши.

Для разработчиков и QA-инженеров даже небольшая экономия времени может иметь большое значение. Clear Cache позволяет быстро привести в порядок сохраненные данные, нажав на иконку расширения после добавления его в браузер. Вы также можете войти в настройки плагина и изменить тип удаляемых файлов, а также периоды очистки.

GoFullPage

GoFullPage – это очень простой и интуитивно понятный инструмент для создания скриншота всей веб-страницы с минимальными усилиями.

Особенностью этого расширения является то, что оно было создано с учетом пожеланий QA-инженеров. По словам создателя, они использовали множество подобных приложений, но не могли заскринить всю веб-страницу за один раз. Таким образом, они решили создать приложение, которое смогло бы справиться с этой задачей.

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

CSS Selector Helper

CSS Selector Helper – отличный инструмент для организации работы с CSS-селекторами. Основная функция – перечисление всех селекторов CSS в окне, встроенном в инструменты разработчика (dev tools). Таким образом, вместо того, чтобы напрягать глаза над десятками селекторов, с помощью этого расширения вы можете быстро просмотреть представленный каталог и работать с нужными опциями.

В окне инструмента вы увидите список всех CSS-селекторов с элементами ID и CSS-классами, упорядоченными по иерархии. Также можно:

• Включать элементы в нужный селектор
• Переключаться между элементами

В целом, это довольно простое и удобное дополнение к вашему набору инструментов для тестирования.

Dimensions

Dimensions – это простой плагин, который помогает точно измерять расстояние между элементами. Работает он очень просто: ваш курсор превращается в горизонтальные и вертикальные линейки, которые автоматически подстраиваются под элементы на веб-странице. При движении мыши сетка следует за ней, помогая быстро определить визуальные компоненты. Также появляется небольшой прямоугольник, который показывает расстояние между элементами дизайна.

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

Magento Form Filler

Magento Form Filler – специальный инструмент, пользующийся популярностью у разработчиков и QA-инженеров, работающих с Magento.

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

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

Время – деньги, скорость – ключ к успеху, поэтому для тех, кто работает с Magento, это расширение поможет сэкономить время и повысить скорость работы.

Google Tag Manager

GTM – невероятно полезный инструмент не только для разработчиков и QA-инженеров, но и для маркетологов и веб-аналитиков. Если вы никогда раньше не пользовались Google Tag Manager, это приложение может оказаться не самым простым для понимания. Однако, потратив несколько минут на изучение основ, вы сэкономите много времени в дальнейшей работе.

Это расширение позволяет хранить все метки, установленные на веб-странице (страницах), в едином интерфейсе. Вы можете создать несколько учетных записей GTM и применять столько контейнеров, сколько необходимо для удобной навигации. К основным функциям относятся:

• Редактирование, добавление, удаление меток
• Группировка/организация нужных меток
• Тестирование с помощью функции предварительного просмотра
• Отслеживание версий тегов
• Предоставление доступа нескольким пользователям для эффективного сотрудничества и т.д.

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

Facebook Pixel Helper

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

Если пиксель не работает должным образом, Pixel Helper сообщит вам об этом. Это простое и удобное расширение, которое помогает определить работоспособность мета-пикселей на странице и сосредоточиться на тех, которые работают правильно.

Ghost Inspector

Расширение Ghost Inspector отлично подходит для автоматизации регрессионного тестирования. Оно позволяет записывать автоматизированные тесты веб-страниц и запускать их столько раз, сколько необходимо.

Этот плагин преобразует реальные действия пользователя в автоматизированные тесты. Чтобы лучше объяснить принцип его работы, давайте рассмотрим основы процесса:

1. Установите приложение и добавьте его в список расширений Chrome.
2. Начните запись.
3. Выполните желаемые действия на сайте, например, заполните форму клиента.
4. При необходимости можно делать проверки, чтобы убедиться, что, скажем, пользовательский интерфейс работает так, как задумано (например, приложение может отследить появление сообщений о проверке).
5. Завершите запись.
6. Повторно запустите тест через Ghost Inspector.

Затем вам будет предоставлен список всех записанных действий, успешно или не успешно выполненных условий, а также видеозапись сессии и окончательный снимок экрана.

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

Tag Assistant Legacy

Tag Assistant – это высокоуровневое расширение, которое помогает проверить правильность работы всех внедренных тегов. Вы можете включить его на текущем сайте или позволить ему проверить все открытые вкладки в вашем браузере.

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

Кроме того, вы можете воспользоваться функцией “Запись”. Вот как она работает:

1. Включите запись.
2. Проведите необходимые с точки зрения пользователя действия.
3. Перейдите в меню Google Tag и запросите полный отчет.
4. Плагин показывает, как Google Tag обработал все действия на веб-странице.
5. Вкладка Google Analytics демонстрирует, как эти действия были восприняты Google Analytics, предоставляя данные о маркетинге и т.п.
6. Здесь вы сможете обнаружить проблемы, если они возникли, и внести необходимые изменения, чтобы исправить ошибку.
7. Затем воспроизведите записанную сессию, чтобы убедиться, что проблема была устранена.

Этот плагин отлично подходит для эффективного управления и поддержки всех тегов, которые вы хотите внедрить на своей странице.

Dashlane

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

В частности, вы можете:

• Генерировать пароли и настраивать их параметры
• Добавлять и изменять пароли
• Управлять своими паролями в приложении
• Сохранять их в упорядоченном виде, делая нужные заметки
• Автоматически заполнять любую форму на множестве веб-страниц

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

LastPass

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

• Пароли
• Заметки
• Адреса
• Платежные карты
• Банковские счета

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

META SEO Inspector

Этот инструмент позволяет оценивать HTML-теги и метаданные без доступа к исходному коду. После нажатия на значок расширения браузера появляется панель с мета-описаниями для всех доступных компонентов.

Простая и эффективная система цветового кодирования позволяет определить доступные варианты действий:

• Ошибки помечаются красным цветом как “предупреждения”, например, слишком длинное/короткое описание.
• Обнаруженные мелкие проблемы помечаются как “информация” синим цветом.
• Советы выделяются желтым цветом и предлагают вам варианты того, как оптимизировать ваши SEO-элементы.

Кроме того, с помощью META SEO Inspector вы можете изучить действия конкурентов и улучшить свой собственный проект.

ARC Toolkit

Это обязательное расширение Chrome для всех QA-инженеров. После интеграции плагина в инструменты разработчика вы сможете увидеть главную панель ARC Toolkit. В этом меню отображается набор тестов. Их можно запускать одновременно и по отдельности. В случае обнаружения каких-либо дефектов приложение уведомит вас об этом в своей панели Elements.

С помощью ARC Toolkit вы можете:

• Находить элементы, которые не соответствуют WCAG (Web Content Accessibility Guidelines).
• Переносить найденные проблемы в выбранную вами систему отслеживания ошибок.
• Настроить параметры для обнаружения конкретных ошибок.

Это расширение – быстрое решение сложных проблем.

Screen Reader

Тестирование доступности имеет важное значение для современного мира. Во время этого тестирования расширение Screen Reader для Chrome поможет вам оценить, насколько хорошо веб-страница настроена для людей с ограниченными возможностями.

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

High Contrast

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

• Нормальный – стандартный вид веб-страницы
• Повышенный контраст – цвета выделяются
• Черно-белый – все становится черно-белым
• Инверсия цветов – все цвета меняются на противоположные
• Инверсия черно-белого функционирует так же, как и вышеописанный вариант, но в черно-белом формате
• Желтый на черном – фон окрашен в черный цвет, а основные визуальные элементы и текст – в желтый.

Кроме того, High Contrast предлагает вам выбор использования приложения на любых платформах. Таким образом, расширение может быть настроено для каждого пользователя индивидуально.

Grammarly

Хотя Grammarly не имеет прямого отношения к тестированию, он популярен среди QA-инженеров. Для QA-экспертов он может стать удобным инструментом для быстрого составления, редактирования и корректировки отчетов. Его можно добавить в браузер Chrome в качестве расширения, а также получить доступ через официальный сайт приложения.

Grammarly имеет очень удобный пользовательский интерфейс и предлагает довольно много полезных функций:

• Проверка грамматики
• Советы по пунктуации
• Настройка тона голоса
• Выбор правописания
• Поиск синонимов и т.д.

Если вам нужно быстро и эффективно перепроверить какую-либо документацию, это приложение поможет сэкономить время и акцентировать ваше внимание на деталях.

Расширения Chrome для тестирования UI

Расширения Chrome предоставляют массу новых возможностей тестировщикам, которые занимаются тестированием пользовательского интерфейса. Наши любимые инструменты в этой категории – Page Ruler Redux, WhatFont, PerfectPixel и Window Resizer.

Page Ruler Redux

Это расширение пригодится тестировщикам программного обеспечения, которым приходится измерять расстояние между элементами, поля и отступы на веб-странице. Page Ruler Redux – это простое расширение для тестирования пользовательского интерфейса в Chrome, которое измеряет высоту, ширину и отступы объекта с обеих сторон.

Page Ruler Redux предлагает еще одну полезную функцию для QA-инженеров – возможность тестировать альтернативные веб-страницы и воспроизводить на своей странице другой дизайн.

WhatFont

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

WhatFont позволяет быстро определить конкретный текст на веб-странице. Это происходит быстрее, чем без расширения (когда нужно нажать правой кнопкой мыши, перейти к элементам, проверить CSS и т. д.). Вместо этого нажмите на значок WhatFont и наведите указатель на слово. Расширение мгновенно покажет вам название шрифта со всеми подробностями (цвет, вес и т.д.).

PerfectPixel

Этот инструмент позволяет сравнить оригинальный дизайн с фактическим дизайном на фронтенде. Вы можете наложить полупрозрачное изображение на HTML для точного сравнения пикселей. В список возможностей плагина входят:

• инверсия слоев;
• перетаскивание;
• масштабирование;
• вставка из URL и буфера обмена;
• поддержка нескольких слоев и т.д.

PerfectPixel позволяет QA-инженерам убедиться, что дизайн тестируемого продукта соответствует задуманному дизайну пиксель в пиксель.

Window Resizer

Это расширение Chrome для тестирования веб-сайтов позволяет проверять макеты сайтов на разных разрешениях экрана без использования физических устройств. Windows Resizer настраивает окно браузера, чтобы воспроизвести другие разрешения экрана.

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

Расширения Chrome для исследовательского тестирования

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

BugMagnet

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

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

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

Exploratory Testing Chrome Extension

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

Расширения для тестирования доступности

Когда дело доходит до тестирования доступности, существуют международные стандарты, которым должны следовать QA-инженеры – WCAG, ARIA, RGAA, Section 508 и т. д. Следующие расширения Chrome упростят проверку соответствия стандартам.

WAVE Evaluation Tool

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

Axe DevTools

Это расширение Chrome для автоматизированного тестирования. Это легкое расширение, основанное на библиотеке JavaScript axe. Оно сообщает об ошибках, связанных с отклонениями от международных стандартов.

Accessible Web Helper для Google Chrome

Web Helper – отличный вариант для тестирования доступности сайта. Он предоставляет все необходимое для выявления проблемных элементов на странице и просмотра точных деталей сбоя. Accessible Web Helper можно использовать для сканирования веб-страниц на соответствие различным уровням правил WCAG 2.0/2.1 A/AA.

Расширения для тестирования API

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

Yet Another REST Client

Yet Another REST Client – это простой консольный инструмент для тестирования REST-сервисов в Chrome, который позволяет проверять различные API. Здесь вы можете легко сохранять ваши избранные запросы и импортировать/экспортировать их на новые устройства. Это расширение для тестирования API в Chrome сохраняет историю предыдущих запросов, чтобы вы могли быстро сравнивать или повторно выполнять их.

Postman Interceptor

Postman Interceptor Chrome отлично подходит для тестирования RESTful API. Он позволяет настраивать и переключать переменные окружения “на лету” и экономит массу времени. Более того, последняя версия позволяет проводить раннее тестирование – даже без готового и работающего пользовательского интерфейса.

Talend API Chrome Extension

Этот инструмент позволяет легко тестировать REST, SOAP и HTTP API. Кроме того, расширение позволяет выполнять различные тесты ответов API и может использоваться для проверки значений заголовков, элементов тела или времени ответа.

Расширения Chrome для тестирования на проникновение

Request Maker

Request Maker – это широко используемое расширение для тестирования на проникновение в Chrome. Оно позволяет создавать новые запросы, изменять URL-адреса, перехватывать запросы, выполняемые веб-страницами, изменять данные POST запросов.

D3coder

Это еще одно полезное расширение Chrome для тестирования безопасности. Оно поддерживает различные типы кодирования/декодирования. Инструкция короткая и понятная:

1. Скопируйте текст в буфер обмена
2. Выберите тип кодирования из меню
3. После преобразования d3coder копирует новый текст в ваш буфер обмена.

Расширения Chrome для скриншотов

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

Lightshot

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

Awesome Screenshot

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

Screencastify

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

Тестирование куки-файлов сайта

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

Edit This Cookie

Будь то A/B-тестирование, проверка доступности функций или управление файлами cookie, вам пригодится такой простой и действенный инструмент, как EditThisCookie. Установив расширение, вы сможете просматривать все файлы cookie, которые использует веб-страница.

Расширение представляет собой список со всеми файлами cookie. Можно выбрать определенные характеристики, которые вы хотите просмотреть, например, сроки действия и т.д. Кроме того, в настройках вы можете изменять, удалять, создавать и добавлять файлы cookie, а также оптимизировать работу с расширением через окно параметров.

Cookie Editor

Это расширение Google, которое делает именно то, что следует из его названия: добавляет, удаляет, редактирует, защищает, блокирует куки, а также может помочь вам экспортировать куки в формате JSON.

Заключение

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

Перевод статьи  «25+ Useful Chrome Extensions for Software Testers».