В своей прошлой статье про ошибки при проведении функционального тестирования web-приложений я отмечал, что при локализации бага начинающие тестировщики зачастую игнорируют необходимость проверок на браузерах с разными движками.
А что такое движок браузера? Давайте разберёмся вместе
Движок является ядром любого браузера. Он представлен в виде скрипта, преобразующего код web-продукта в динамическое изображение, отображаемое на устройстве пользователя.
Различия в движках базируются на том, что они имеют разные алгоритмы обработки кода и в них использованы отличные друг от друга принципы реализации стандартов web’а.
Для понимания, как нам учитывать особенности движков при тестировании, стоит несколько глубже погрузится в матчасть.
Итак, сейчас актуально: Blink, WebKit, Quantum (Gecko). А вот эти движки уже не столь актуальны и их поддержка прекращена: Trident, EdgeHTML, Presto.
А теперь несколько детальнее о каждом.
Blink
Современный движок, созданный в 2013 году на основе WebKit. Считается достаточно быстрым и высокопроизводительным для работы именно с web-приложениями. Применяется в Google Chrome, Opera и новых версиях Microsoft Edge, а также в других браузерах на базе Chromium, например, Yandex Browser.
WebKit
Оптимизирован под устройства компании Apple. Как и Blink, обладает высокой производительностью и поддерживает все основные web-стандарты. Ещё одним из его достоинств является энергоэффективность и высокое качество рендеринга текста и графики, что особенно важно для дисплеев с высоким разрешением. Применяется в Safari.
Gecko
Довольно-таки старый движок – был разработан аж в 1997 году. Его неоспоримые преимущества – кроссплатформенность и гибкость, т.к. Gecko поддерживает множество операционных систем, в том числе Windows, macOS, Linux и Android. Как и Blink и WebKit, поддерживает все основные web-стандарты. Хотя может быть и не такой шустрый, как WebKit, но у него своя фишечка – расширяемость, т.е. может поддерживать множество уникальных расширений и плагинов (например Selenium). Применяется в Firefox (до версии 57) и других продуктах Mozilla (например, почтовый клиент Thunderbird), SeaMonkey.
Quantum (Gecko)
Это крупное обновление движка Gecko, выпущенное в 2017 году, которое значительно улучшило качество браузера Firefox. Благодаря поддержке современных web-стандартов Firefox в настоящее время один из самых совместимых браузеров. Применяется в Firefox (с версии 57), Tor Browser и Waterfox.
Trident и EdgeHTML
Trident использовался в Internet Explorer (начиная с v4.0). EdgeHTML – это ответвление от него, созданное специально для Microsoft Edge. EdgeHTML был заменен на Blink в его новых версиях. Главный минус этих движков – проблемы с совместимостью и безопасностью.
Presto
Основным применением Presto был браузер Opera, который до 2013 года использовал этот движок. Также Presto использовался в некоторых мобильных браузерах и устройствах, таких как Opera Mini и Opera Mobile. Как и EdgeHTML, был заменен на Blink.
Как видно из описания, движки Presto, Trident и Gecko – это уже по большей части история. А вот триумвират Quantum (Gecko), Blink и WebKit очень хорош. Эти движки являются самыми современными движками на сегодняшний день.
Идем далее и поговорим о том, как же вышеуказанное может пригодиться в работе тестировщика.
Зачем это знать тестировщику?
Понимание работы движков браузеров важно для QA-специалистов по веским причинам. Именно от качества работы движка зависят такие параметры браузера как производительность, скорость обработки данных, совместимость, безопасность и т.п. Также движок влияет на отображение web-продукта на экране и его функциональность. Разберём немного подробнее.
- Кросс-браузерная совместимость
Движки обрабатывают HTML, CSS и JavaScript по-разному. Это может привести к тому, что без адаптивной верстки одно и то же web-приложение будет работать иначе в разных браузерах.
Например, анимации, макеты или скрипты могут отображаться корректно в Chrome, но возникнут проблемы в Safari или Firefox. Для хорошей производительности насыщенного AJAX-скриптами web-приложения потребуется тесная интеграция JavaScript, CSS и DOM — и это окажется в большей степени важным, нежели индивидуальная производительность каждого из компонентов.
Знание особенностей каждого движка позволяет тестировщику выявить такие различия на ранних этапах.
Если обратиться к сайту статистики либо иным подобным сервисам, то мы увидим, что в Российской Федерации по состоянию на сентябрь 2024 года распределение предпочтений в использовании браузеров среди пользователей следующее:
- Chrome – 50%
- Yandex Browser – 23%
- Safari – 11%
- Opera – 6%
- Microsoft Edge и Firefox – 3%
Вот именно это и следует учитывать при проведении тестирования совместимости (кросс-браузерном тестировании).
Статистика говорит, что около 80-85% пользователей используют браузеры с движком Blink. Так что при тестировании мы смело можем выбрать один из них (Google Chrome, Yandex Browser, Opera или Microsoft Edge) и примерно с 99,9(9)% вероятностью web-продукт в них будет работать и отображаться одинаково.
А вот чтобы быть полностью уверенным в том, что web-продукт подходит остальным 15-20% пользователей, которые используют браузеры на основе иных движков, необходимо дополнительно проверить его в браузере Safari и Firefox.
2. Производительность
Тестирование производительности проверяет, насколько хорошо web-приложения работают в разных браузерах, оценивая такие факторы, как время загрузки и отзывчивость. Например, загрузка насыщенного изображениями web-приложения может зависеть от скорости, с которой браузер в состоянии загружать и распаковывать изображения. Напротив, производительность простенькой страницы зависит от того, как быстро браузер обрабатывает стандартный HTML.
В рамках проверки производительности мы можем проводить нагрузочное тестирование, стресс-тестирование или тестирование на выносливость. В рамках нагрузочного мы проверяем отклик и скорость работы приложения при определенных условиях нагрузки. Стресс-тестирование поможет определить стабильность вашего приложения путем применения чрезмерных перегрузок пользовательскими запросами, превышающими нормальные эксплуатационные возможности, а также применением различных внезапным и экстремальных нагрузкам. Тестирование на выносливость используется для проверки стабильности и производительности системы в течение длительного периода.
3. Оптимизация под разные устройства
Движки браузеров влияют на то, как web-приложение будет работать на различных платформах (десктоп, мобильные устройства, планшеты). Например, WebKit, который используется в Safari на устройствах Apple, обладает лучшей энергоэффективностью и рендерингом для экранов с высоким разрешением. Мы должны учитывать эти особенности, проверяя приложение на всех целевых платформах.
4. Безопасность
В рамках тестирования безопасности мы можем провести статическое тестирование безопасности приложений (SAST). Этот метод поможет выявить слабые места в исходном коде приложения на ранних стадиях разработки. Динамическое тестирование безопасности приложений (DAST) обнаруживает уязвимости и слабые места в работающем приложении путем введения в него вредоносных данных. Это необходимо для выявления общих недостатков безопасности и минимизации рисков потери ценной информации.
Цель тестирования безопасности – обнаружить уязвимости веб-приложения, чтобы разработчики могли устранить их и сделать веб-приложение и его данные защищенными от любых несанкционированных действий.
5. Отладка и анализ багов
При обнаружении бага важно понимать, связано ли это с ошибкой в коде приложения или с особенностями работы конкретного движка. Это помогает точнее локализовать проблему и эффективнее взаимодействовать с разработчиками для ее исправления. Например, баг, который появляется только в Firefox, может быть результатом специфики движка Gecko.
6. Инструменты для автоматизации тестирования
Движки могут иметь разную степень поддержки инструментов для автоматизации, таких как Selenium или Puppeteer. Вот Gecko поддерживает множество уникальных расширений и плагинов для тестирования. Понимание того, какие инструменты лучше работают с конкретными движками, помогает выбрать правильный подход для автоматизации тестирования.
7. Устаревшие движки
Знание устаревших движков, таких как Trident или Presto, важно при тестировании старых приложений или для обеспечения поддержки legacy-систем. Тестировщики должны быть готовы к специфическим проблемам, которые могут возникнуть в таких системах.
8. Повышение качества продукта
В конечном итоге, глубокое понимание браузерных движков помогает обеспечивать высокое качество продукта на разных устройствах и платформах. Это улучшает пользовательский опыт и снижает вероятность возникновения проблем после релиза.
И всё равно это не полный список причин, конечно. Можем обсудить в комментариях, если тема вам интересна.
А теперь несколько слов в заключение. Из личного опыта могу сказать, что за три года в web-тестировании у меня не было случаев, чтобы web-продукт работал в Google Chrome хорошо, а в Yandex Browser были ошибки. А вот при использовании Firefox чаще всего возникали отличия в поведении – как визуальные (то кнопки немного отличаются, то слайдеры чуть другие, то расчёты в полях ломаются), так и функциональные (однажды был случай, когда только в браузере Firefox в полях формы ввода могли вводиться и приниматься системой не валидные значения).
Всегда стоит помнить, что подавляющее большинство пользователей не знает о различиях в движках, и каждый будет в первую очередь обращать внимание на внешний вид web-приложения и выполнение им своих функций. Наша же задача удостовериться, что оно одинаково хорошо как в Google Chrome, Firefox, так и в Safari и т.п.
Надеюсь, эта статья убедила вас, что знания о движках браузеров нужны специалистам по тестированию. Они нам точно помогут при принятии решения относительно того, баг всё-таки перед нами или это лишь особенность работы/фича конкретного браузера.
А уж если мы в итоге выявили, что перед нами баг, то мы сможем эффективно локализовать его, проанализировать причину появления и предоставить более точную информацию для разработчиков, что существенно улучшает процесс тестирования и конечный результат.
Спасибо за полезную статью!
Всегда думал что хром построен на WebKit