Содержание

7 инструментов для тестирования кроссбраузерности

20 мая 2016



Facebook

Twitter

Вконтакте

Google+

Pinterest

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

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

1. Browsershots

Browsershots это простой бесплатный инструмент, но его функционал мало чем уступает его платным конкурентам. Благодаря Browsershots вы сможете получить скриншот того, как ваш сайт будет выглядеть в каждом конкретном случае. В вашем распоряжении просто гигантский список поддерживаемых браузеров, а также возможность выбрать размер экрана, насыщенность цветов, включить и выключить JavaScript (вы можете указать конкретную версию JavaScript) Java и Flash.

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

Если Вам требуется больше возможностей и инструментов для тестирования, можно перейти на платную версию за 29.95$ в месяц.

2. Browser Sandbox

К сожалению, Browser Sandbox будет полезным только для пользователей Windows, хотя разработчики обещают выкатить версию для Mac в самое ближайшее время. Он может похвастаться довольно внушительным списком поддерживаемых браузеров, который включает IE, Firefox, Chrome, ChromiumCanary, Firefox Mobile, Safari, Opera, и FirefoxNightly. Правда, в бесплатном варианте доступна возможность тестирования только в последней версии конкретного браузера.

Если вы должны проверять и старые версии, вам придется воспользоваться платной версией. К счастью, ее цена всего 4.95 доллара в месяц.

3. IE Testers

Если корректное отображение вашего сайта в IE ваша главная головная боль, к вашим услугам несколько инструментов, которые помогут вам проверить отображение сайта в браузере от Microsoft.

3.1. Netrenderer

Благодаря Netrenderer вы можете протестировать свой проект в версиях IE от 5.5 до 11. Это простая и интуитивно понятная утилита, хотя она и не может похвастаться впечатляющим списком функций.

3.2. Microsoft Edge

Microsoft Edge это целая платформа для тестирования сайта в IE. Хотя он и дает возможность получить скриншот вашего сайта и в других браузерах, в том числе и в мобильных, есть важная причина, по которой мы отнесли этот инструмент к группе IE Testers. Microsoft Edge предоставляет в ваше распоряжение виртуальную машину только для тестирования в IE7 и новее.

3.3 My Debugbar

My Debugbar, также известный, как IETester, представляет собой десктопное приложение, которой устанавливается только под Windows. Программа очень подробно документирована и имеет ряд ограничений, поэтому прежде, чем начинать тестирование, стоит ознакомиться с разделом помощи.

4. Webshot by Mobile Ready

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

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

5. Browsera

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

Вы можете воспользоваться бесплатной тридцатидневной пробной версией или остановиться на базовом бесплатном варианте, который ну уж очень урезан в функционале. Также существуют планы с оплатой 39 и 99$.

6. CrossBrowserTesting

Действительно классная особенность CrossBrowserTesting в том, что он использует реальные устройства для тестирования вашего сайта. Хотя эмуляторы работают довольно неплохо, ничто не даст вам столь исчерпывающей информации, как боевое тестирование на реальных девайсах. Список функций довольно объемный, и в общем, этот инструмент реально стоит своих денег. Существует подозрение, что CrossBrowserTesting может похвастаться самым большим списком поддерживаемых браузеров (около 900) и операционных систем (около 40), включая iOS, Android,Windows, Mac и другие.

Еще одна отличительная особенность режим live testing , в котором вы можете тестировать свой сайт в реальном окружении, получая возможность проверить работоспособность AJAX, HTML-форм, JavaScript, Flash и всего остального. Кроме того, представлена возможность автоматизации тестов и сравнения скриншотов.

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

7. BrowserStack

BrowserStack это еще одно громкое имя в кроссбраузерном тестировании. Он также использует реальные устройства для тестирования и поддерживает 700+ браузеров. Существует возможность локального тестирования и быстрого получения скриншотов на разных разрешениях экранов от 800 600 до 2048 1536. Основной план стоит 29$, но у них есть план для фрилансеров, который стоит 12,5 долларов в месяц. Для некоторых open source проектов они даже предлагают бесплатные услуги.

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

Facebook

Twitter

Вконтакте

Google+

Pinterest


Проверка кроссбраузерности сайта – видимость сайта в браузерах

Вступление

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

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

Видимость сайта в браузерах

Если вы «погуглите» список браузеров доступных для установки пользователям, то наверняка найдете список из 60± программ. Большинство из них будут модификациями Chromium и Firefox, однако общий список получится внушительный. (список тут)

Вручную проверить видимость сайта во всех браузерах задача, мягко сказать, бестолковая. Хотя можно установить у себя основные браузеры и очень быстро открыть свой сайт в основных браузерах Google Chrome, Яндекс Chrome, Firefox и Opera и тем самым перекрыть 90% возможных посетителей вашего сайта.

По данным статистики StatCounter, популярность браузеров в России на октябрь 2018 года выглядит так.

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

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

Browsershots.org

Сервис Browsershots дает вам бесплатную возможность сделать скиншоты проверяемой страницы сайта в основанных браузерах и их версиях. Бесплатно, проверка кроссбраузерности сайта, проводится для осей Linux и Windows. Для MAC и BSD придётся делать денежный взнос.

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

Более интересны 5 настроек: Screen Size, Color Depth, Javascript, Java, Flash. По умолчанию они выставлены на усмотрение сервиса.

Также обратите внимание, что выделены не все чеки и по умолчанию проверяются не все браузеры, а лишь последние, по данным сервиса, версии Браузеров.

Еще один момент. Значок копирайта внизу дает информацию, что сервис не обновлялся с 2015 года. Это подтверждают последние версии браузеров доступные для проверки. Например, последний «Opera» для проверок 15.0, а не 56.0.

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

результат проверок

Turbo.net (бывший Spoon)

Сервис turbo.net позволяет запустить онлайн на вашем рабочем столе или планшете браузеры IE, Chrome, Firefox. Далее вы вызываете свой сайт и изучаете его, сколько вам нужно.

На этом сайте инструмент проверок кроссбраузерности называется «Browser Sandbox» и воспользоваться им вы можете после простой регистрации на сайте.

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

Видео покажет, как работает сервис и что такое, видимость сайта в браузерах.

Видимость сайта в Internet Explorer

Возвращаясь к статистике StatCounter, мы обнаруживаем, что, в мире, браузер Microsoft Internet Explorer, занимает третье место, по использованию. А это значит, что игнорировать это браузер со всеми его версиями нельзя.

Проверить видимость сайта в Internet Explorer можно очень просто. Есть специальный инструмент – проверка кроссбраузерности сайта во всех версиях Internet Explorer, сервис netrenderer.com. Далее его описание, позаимствованное с сайта сервиса.

IE NetRenderer позволяет вам проверять, как веб-сайт отображается многочисленными версиями Microsoft Internet Explorer. Особенно старые версии веб-браузеров Microsoft известны своим неожиданным поведением и несоблюдением интернет-стандартов W3C. Поэтому для каждого веб-дизайнера нужно обязательно регулярно проверять свои веб-сайты на совместимость с этими веб-браузерами. Просто введите URL-адрес проверяемой веб-страницы в поле и нажмите кнопку «Render». Через несколько секунд вы получите скриншот страницы. Попробуйте, это бесплатно!

Сервис IE NetRenderer работает быстро. В отличие от других служб скриншотов, мы можем обрабатывать большое количество захваченных заданий параллельно и в реальном времени. Скорость рендеринга должна быть сопоставимой, если не быстрее вашего локального браузера. Наши двигатели IE имеют гарантированную пропускную способность интернета в 200 Мбит/с.

Для чего подходит

Этот инструмент веб-рендеринга идеально подходит для веб-дизайнеров, работающих на рабочих платформах Apple iMac и Linux. Он позволяет проверять веб-проекты изначально на всех популярных версиях Internet Explorer, без необходимости выделять несколько физических или виртуальных ПК с Microsoft Windows для этой цели. Перед каждым заданием рендеринга мы очищаем кэш Internet Explorer. Это позволяет сразу увидеть эффект от всех изменений, внесенных во время веб-разработки.

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

Веб-сайты, которые извлекают содержимое страницы через JavaScript после выполнения главной HTML-страницы, могут еще не завершиться, когда NetRenderer сделает снимок экрана. То же самое может произойти с объектами внешней страницы, которые должны быть загружены с медленных сторонних серверов. Показателем этого является либо пустой, либо неполный снимок экрана. Если это произойдет, отметьте флажок под кнопкой «Render», чтобы позволить дополнительное время рендеринга, чтобы сценарии имели больше шансов закончить.

Снимок экрана всегда соответствует 100% оригинального размера и точности картинки вплоть до пикселя. Пользователь отмечает максимальную ширину видимого просмотра на экранах 800×600 и 1024×768 с учетом ширины полосы прокрутки браузера.

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

Можете использовать его в качестве приблизительной оценки, скорости загрузки веб-сайта людьми в Центральной Европе. Вы также можете использовать IE NetRenderer для просмотра веб-сайтов анонимно. Посетив веб-сервер вы не оставите никаких следов ни о вашем IP-адресе, ОС, версии браузера, плагинах или файлах cookie.

Browserling.com

Используя сервис Browserling.com, проводится проверка кроссбраузерности сайта тестированием вашего сайт на выбранном браузере с выбранной версией и выбранной платформе в онлайн режиме.

Сервис удобный, но на бесплатном тарифе ограничено время сессии проверки тремя минутами. Платный тариф с неограниченными проверками стоит 19$/месяц. Примечательно наличие проверок на Android (6 версий).

Так как проверка кроссбраузерности сайта относится к профессиональным проверкам, то большинство сервисов платные. Посмотрим на них.

Browsera.com

Сервис browsera.com платный, однако в планах подписки имеется 30-дневная бесплатная пробная версия.

CrossBrowserTesting

Сервис CrossBrowserTesting позволит провести тестирование совместимости кросс-браузера в облачном сервере на 2000+ реальных браузерах Интернет.

В бесплатном тарифном плане, после регистрации, можно провести 60 минут проверочных сессий в месяц (6 сессий по 10 минут). Неограниченное использование сервиса стоит 15$/в месяц.

Browserstack.com

Данный сервис browserstack.com платный, от 29$. Он даст возможность проверить свой сайт в разных браузерах на различных физических и мобильных устройствах Android и iOS для получения наиболее точных результатов.

Saucelabs.com

На сайте мощный набор различных платных инструментов, среди которых есть тест кроссбраузерности, от 19$. ссылка.

Зачем нужно время для проверок

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

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

Вывод

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

©www.wordpress-abc

Похожие посты:

Похожее

17 лучших инструментов для кроссбраузерной проверки

Автор:

Елизавета Гуменюк

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

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

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

Данные инструменты имеют разнообразные функции и удовлетворяют ряду потребностей в тестировании совместимости веб-сайтов.

BrowserShots

Один из первых кроссбраузерных тестовых сайтов, который позволяет вам тестировать ваш сайт в нескольких браузерах, включая некоторые старые версии, такие как Lynx, Konqueror и Seamonkey.

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

Browser Sandbox

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

Он предоставляет широкий спектр браузеров, включая некоторые старые версии Internet Explorer, а также версию браузеров Canary или Development.

MultiBrowser

Настольное приложение с несколькими браузерами начиная от IE 7-11, Edge, Firefox и заканчивая последними версиями Chrome. Вы можете использовать его для тестирования своего сайта, как для настольных компьютеров, так и для мобильных устройств с помощью эмулятора и с возможностью запуска теста вручную или автоматически.

LambdaTest

Онлайн-сервис, где вы можете запускать кроссбраузерные тесты для разных платформ. Например, вы можете выбрать, тестировать ли ваш сайт в Firefox или Chrome, который работает на Windows, Linux или macOS.

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

Experitest Cross Browser Testing

Этот инструмент позволяет вам проверить совместимость и производительность вашего сайта в различных средах. Он также упрощает интеграцию с такими сервисами, как Github, Gitlab, Jenkins, TravisCI и CircleCI, что позволяет оптимизировать рабочие процессы развертывания вашего веб-сайта.

BrowserStack

BrowserStack — одно из известных имен в кроссбраузерном тестировании, которое используется некоторыми крупными проектами с открытым исходным кодом, такими как jQuery и React.js, и содержит список сотен браузеров, мобильных устройств и стратегий тестирования, чтобы обеспечить работу ваших веб-сайтов в стольких средах, сколько возможно.

SauceLabs

SauceLabs предоставляет полный инструмент тестирования совместимости браузера для любого размера веб-сайта, будь то предприятие, малый или средний бизнес или развивающийся проект с открытым исходным кодом.

CrossBrowserTesting

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

TestingBot

TestingBot предоставляет полную стратегию тестирования для веб-сайтов, а также для нативных мобильных приложений. Так что вы можете не только вращать браузеры, но и запускать тест на реальном устройстве iOS или Android.

Browserling

Если вам нужно быстро и легко протестировать сайт в Internet Explorer, возможно, это и есть инструмент, который вы ищете.

Вы сможете легко и в интерактивном режиме протестировать ваш сайт в нескольких браузерах, включая старые, такие как Internet Explorer 10 и 11 и Safari 4 и 5.

Comparium

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

Puppeteer

Puppeteer — это модуль Node.js, который предоставляет API для взаимодействия с браузерами Chrome и Firefox.

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

Playwright

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

Playwright поддерживает браузер на базе Chromium, Firefox и Webkit (например, Safari).

Nightwatch.js

NightWatch.js модуль Node.js для сквозного тестирования. С помощью простого в использовании API вы можете проверить, содержит ли элемент определенный текст, является ли он видимым или скрытым, и даже проверить класс, идентификатор и свойства CSS.

Cypress

Cypress — это набор тестов, который делает сквозное тестирование и отладку современных веб-приложений простым и легким.

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

WebDriverIO

Среда автоматизации тестирования Node.js. Он поддерживает множество библиотек JavaScript, таких как React.js, Vue и Angular.

Поскольку он основан на W3C WebDriver и Chrome DevTools, стандартном и общепринятом протоколе, тест может выполняться локально или в облачной службе, такой как SauceLab, BrowserStack и TestingBot.

Selenium

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

Фактически, многие тестовые фреймворки, приложения или сервисы, включая некоторые из инструментов, находящихся в этом списке, основаны на драйверах Selenium.

Всем успешной работы и творчества!

Источник

Проверка на кроссбраузерность — Digital-агентство ADVEGITAL

Кроссбраузерность сайта — свойство сайта одинаково хорошо работать и отображаться во всех браузерах, в том числе и в браузерах мобильных устройств на разных платформах (Windows, MacOS, Android, iOS).

Каждый браузер использует собственные алгоритмы обработки CSS и HTML кода. Из-за этого возникают несоответствия в отображении сайта и связанные с этим проблемы.

Существует много разных браузеров, но большинство из них работают они на одном из четырех главных движков: Blink, WebKit, Gecko, EdgeHTML.

    На сегодня топ 5 популярных браузеров в русском сегменте интернета выглядит так:

  • Google Chrome — 57.6%
  • Яндекс.Браузер — 13.1%
  • Mobile Safari — 9.5%
  • Opera — 4.6%
  • Firefox — 4.0%

Некогда популярным Internet Explorer пользуются только 1,5% юзеров. Такое глубокое падение позиций объясняется тем, что начиная еще с разработки первых версий, в него ввели несовместимые со стандартами расширения HTML, впоследствии сохранявшиеся от версии к версии. Это привело к низкой скорости работы и отображения страниц. А 6-ая версия IE вообще считается самым проблемным браузером. Сегодня Microsoft отказался от Internet Explorer и, начиная с Windows 10, выпустил его замену — браузер Edge на новом движке.

Под самые последние версии перечисленных браузеров из топа 5 и нужно настраивать верстку сайта. У браузеров есть мобильные версии. Их тоже нужно учитывать при адаптации сайта.

Если сайт не адаптирован под разные браузеры и платформы, верстка отображается неправильно: съезжают картинки, применяются не те шрифты, изменяются отступы, высота строки, тени и т.д.

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

    Необязательно вплоть до последнего пикселя подстраивать сайт под каждый браузер. Достаточно если он отвечает нескольким параметрам:

  • структура сайта остается неизменной;
  • верстка без ошибок;
  • шрифты отображаются корректно;
  • нет наложения фрагментов текста друга на друга;

Как обеспечить кроссбраузерность сайта

    Как сделать адаптивную верстку сайта? Есть несколько способов:

  • Использовать универсальные стили
  • Применять CSS-хаки
  • Использовать условные комментарии

Универсальные стили

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

CSS-хаки

Когда сайт корректно работает в двух браузерах, а в третьем какие-то элементы отображаются неправильно, то в CSS-коде этим элементам прописывают отдельные свойства, «хаки», которые понимаются только этим третьим браузером.

Условные комментарии

Суть метода в том, чтобы определить вид браузера пользователя и применить соответствующий стиль. Но условные комментарии понимает только Internet Explorer, поэтому этот способ пригоден только для того, чтобы адаптировать сайт под разные версии IE. То есть делается два стиля: «для Internet Explorer» и «для всех остальных браузеров».

Как проверить кроссбраузерность сайта

Узнать, адаптирован ли сайт под разные браузеры, можно разными способами.

Можно сделать проверку сайта на кроссбраузерность онлайн с помощью специальных сервисов. Их много, но мы можем выделить такие как Browsershots, Crossbrowser Testing, Browserling. Эти сервисы позволяют виртуально увидеть сайт в разных версиях браузеров и движках.

Самый точный, пусть и трудоемкий метод — проверка кроссбраузерности сайта «в поле», то есть тестирование работы и отображения сайта вручную в разных браузерах и мобильных платформах. Этот способ дает наиболее полное представление о поведении сайта в разных браузерах и платформах и может показать неочевидные особенности. На одном компьютере можно установить сразу несколько браузеров разных версий, делается это с помощью виртуальных машин (это своего рода «компьютер в компьютере»).

Нужен настоящий SEO-сайт и интернет-реклама? Пишите, звоните:

Наша почта:
Единая справочная: 8 (843) 2-588-132
WhatsApp: +7 (960) 048 81 32
Оставить заявку

13 сервисов для тестирования сайта в разных браузерах

Тестирование сайта в разных браузерах и устройствах

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

» Кроссбраузерность — свойство сайта отображаться и работать во всех популярных браузерах идентично. Под идентичностью понимается отсутствие развалов верстки и способность отображать материал с одинаковой степенью читабельности. Понятие «кроссбраузерность» очень часто путают с попиксельным соответствием, что на самом деле является разными понятиями «. (Википедия)

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

1. Browsershots (бесплатно/платно)

Browsershots — это веб-сервис, который делает скриншоты вашего сайта в разных операционных системах и браузерах ( всего доступно более 130+ браузеров и платформы: Linux, Windows, Mac OS, Gecko, KHTML/WebKit). Причем, можно, дополнительно выставлять некоторые опции: разрешение экрана, глубину цвета, включить или выключить Javascript, Java, Flash.  Это удобный, хоть и довольно медленный способ проверить свой сайт сразу во многих браузерах. Когда вы вводите адрес вашего сайта  в строку для проверки, он ставится в очередь на тестирование. После этого скриншоты будут появляться на итоговой странице по очереди. Это может занять от 5 минут до 2 часов.  В бесплатной версии все происходит довольно медленно. Кроме того, одна сессия (запрос) может длиться только 30 минут.

Следует обратить внимание, что данный сайт имеет многоязычный интерфейс (в том числе — русский и украинский.)

Однако, хоть данный сервис заявлен как бесплатный, в нем есть и платные услуги. За 29.95 у.е. в месяц вы получите так называемую «приоритетную обработку«: скриншоты будут появляться намного быстрее, чем в бесплатной версии, сможете получить от 30 до 50 скриншотов всего за  5 минут. Кроме того, ваши скриншоты будете видеть только вы, тогда как в бесплатной версии они в итоге выкладываются в общую ленту.

2. Adobe

До марта 2013 года у Adobe был отличный бесплатный сревис Adobe BrowserLab для тестирования сайта в разных браузерах и ситемах. Но теперь он закрыт и вместо этого представлен новый сервис Adobe Edge Inspect CC.

Adobe Edge Inspect CC — это продукт, входящий в принципиально новую организацию Adobe продуктов — в облако Adobe Creative Cloud.  Получить аккаунт в данном облаке можно по нескольким пакетам, все они платные. Средний стоит 49,99 у.е. в месяц. Бесплатно Adobe Creative Cloud можно попробовать 30 дней.

3. IE NetRenderer (бесплатно)

IE NetRendererбесплатный онлайн-сервис только для браузера Internet Explorer, который дает возможность проверить ваш сайт под браузером Internet Explorer версий: 9, 8, 7, 6, 5.5.

Тут все просто:  вводите адрес своего сайта, выбираете версию IE и тут же получаете скриншот.

4. IE Tester (бесплатно)

IETester — это абсолютно бесплатное приложение только для браузера Internet Explorer, которое позволяет локально на вашем компьютере просматривать сайт в разных версиях Internet Exlporer (версии:  10, 9, 8, 7, 6, 5.5) под операционными системами Windows 7, Vista и XP.

Для этого нужно скачать IE Tester и установить у себя на компьютере. Найти последнюю версию IE Tester можно тут: http://www.my-debugbar.com/wiki/IETester/HomePage.

5. BrowserСam (платно)

BrowserСam — очень мощный платный  онлайн-сервис для тестирования сайтов под любым браузером и любой платформой. Одна из главных «фишек» данного сервиса в том, что на нем предоставляется удаленный доступ (через VNC) к компьютерам с уже установленными ОС и браузерами, в которых вы можете тестировать свой сайт.  Кроме того есть такая важная опция как тестирование под iPhone OS, Android, Blackberry, Windows Mobile. Можно также тестировать е-мейлы на разных устройствах, что очень важно для рассылочных компаний.

Цены стартуют от 19,95 у.е. в день в зависимости от функционала.

6. CrossBrowserTesting (платно)

CrossBrowserTesting — также очень функциональный платный сервис, где вы можете проверить за несколько минут сайт в разных браузерах, в разных операционных системах, на разных устройствах (поддерживается более 100 вариантов проверок,  в том числе тестирование под Android, iPad, iPhone ) .

Ценовая политика выгодней и гибче, чем у предыдущего сервиса BrowserСam: базовая цена стартует от 29.95 у.е. в неделю. Кроме того, дается бесплатный тестовый триальный период в 7 дней на каждый из трех пакетов, правда с несколько с ограниченной квотой, нежели в платной версии.

7. Litmus (платно/бесплатно)

Litmus —  онлайн-сервис, который предоставляет возможность тестирования сайта на разных браузерах. Кроме предоставления скриншотов, заодно проверяет валидность html и css кода. Особенность его в том, что он в основном ориентирован на тестирование е-мейлов в разных браузерах и на разных устройствах.  Есть возможность протестировать е-мейл в 30 разных почтовых клиентах и другие важные функции, такие как аналитика для е-мейлов.

Платная версия сервиса предполагает три пакета: базовый (49 у.е. в месяц), плюс (99 у.е. в месяц), премиум (299 у.е. в месяц.) Бесплатная триал-версия действует 7 дней.

8. СloudTesting (платно)

CloudTesting — платный онлайн-сервис, который предоставляет возможность функционального тестирования кроссбраузерности сайта. Вы записываете сценарий поведения пользователя с вашим браузером и Selenium IDE, загружаете его, после чего Cloud Testing будет выполнять этот сценарий в нескольких браузерах и операционных системах. Затем он предоставляет скриншоты.

Ценовая политика стартует от 99 у.е. в месяц.

9. Mogotest (платно)

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

Ценовая политика стартует от 15 у.е. в месяц для физических лиц.  При этом есть возможность бесплатно тестировать выбранный пакет (триальная версия) 14 дней.

10. Multi-Browser Viewer (платно)

Multi-Browser Viewer — платное приложение, которое работает с десктопными и мобильными браузерами и включает в себя 26 виртуализируемых браузеров, 5 мобильных браузеров (в том числе iPhone и IPad) и 61 скриншот-браузер (с их помощью можно видеть, как визуализируются страницы, но нельзя видеть результат взаимодействия пользователя с сайтом).

Ценовая политика Multi-Browser Viewer составляет 139,95 у.е. за однопользовательскую лицензию и включает один год использования продуктов и обновлений. Кроме того доступна бесплатная триал-версия программы (14 дней).

11. Sauce Labs (бесплатно/платно)

Sauce Labs — онлайн сервис, который предоставляет доступ ко множеству браузеров в разных ОС и устанавливает соединение вашего браузера с настроенной виртуальной машиной.

Сервис предоставляет платные пакеты (цены стартуют от 49 у.е. в месяц ), кроме того, есть бесплатная квота на тестирование: 200 минут в месяц и позволяет создавать тесты автоматизированного тестирования в браузерах (используется Selenium)

12. Spoon (бесплатно)

Spoon — это онлайн-сервис эмуляции программ. Предоставляется бесплатная возможность запуска Firefox, Chrome, Opera и Safari для пользователей Windows. Доступны разные версии браузеров Firefox, Chrome, Safari,  Opera. Технически, Spoon поддерживает виртуализацию IE, но эта возможность отключена по требованию Microsoft.

13. Browsera (бесплатно/платно)

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

Бесплатная версия включает в себя довольно ограниченное число браузеров и низкое разрешение. Платные пакеты стартуют  начиная от 39 у.е. за 14 дней и от 49 у.е. до 99 у.е. за месячную подписку.


При использовании этого материала активная ссылка на http://topobzor.com обязательна.

Похожее

Онлайн инструменты для проверки кроссбраузерности | Ресурсы

26 июня 2010

Когда дело доходит до изучения просторов глобальной сети, у пользователей интернета есть весьма широкий выбор браузеров («просмотровщиков»). Наша обязанность, как дизайнеров и разработчиков веб-сайтов — обеспечить совместимость сайта со всеми видами браузеров, иными словами обеспечить кроссбраузерность сайта.

Но сразу возникает вопрос — какие браузеры используют пользователи? Сейчас самыми популярными «просмотровщиками» веб-страниц являются Internet Explorer 7 и 8, Mozilla Firefox, Google Chrome и Opera. Однако для каждого вида сайта, в зависимости от того к какой тематике он относится, процент посетителей с разными браузерами может сильно варьироваться. Поэтому, довольно часто, разработчики определяются, с какой аудиторией им предстоит работать и в зависимость от результатов «подготавливают» сайт только под определенные виды браузеров.

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

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

Browsershots — это самый популярный сервис для тестирования кроссбраузерности. Он делает скриншоты вашего сайта практически во всех видах браузеров. Благодаря тонкой настройке можно выбрать как виды движков (WebKit или Gecko), так и виды операционных систем (Linux, Windows, Mac OS X или BSD). Так же в настройках есть выбор разрешения экрана, присутствие установленного javascript, flash, java и другие виды параметров.

Благодаря этому онлайн инструменту можно бесплатно проверить кроссбраузерность сайта во всех версиях Internet Explorer (версии 5.5, 6, 7, 8, а так же 7-6 Mixed и 7-6 Difference). Из функционала стоит выделить отображение времени обработки и ограничение размера экрана в 1024px.

С помощью этого сервиса вы можете запускать страницы в разных браузерах, таких как IE, Firefox, Safari, Chrome и Opera непосредственно из своего браузера. Единственное отличие от других сервисов в обзоре — необходимость установки небольшого дополнения, которое обеспечивает дальнейшее тестирование.

Browsrcamp позволяет проверить совместимость вашего сайта с браузерами в Mac OS X. Бесплатная версия позволяет проверить сайт только в Safari 3.1.2. Но при оплате подписки можно будет тестировать сайт в 12 различных браузерах, которые могут быть установлены на этой OC. Полный список браузеров, как и стоимость подписки, можно найти на страницах сервиса.

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

Платный онлайн сервис предназначенный для тестирования сайта в целом, а не только для проверки кроссбраузерности сайта. Большой набор всевозможных функций и настроек делает Browsera мощным средством для отладки веб-сайта. Из возможностей отметим: анализатор ошибок сценариев на JavaScript; возможность тестирования всего сайта, а не только отдельных страниц; тестирование страниц с динамическим содержанием. У сервиса есть бесплатно-тестовая версия, которая позволяет отлаживать не более 25 страниц в месяц, а так же бесплатный 30-дневный пробный период.

Еще один платный сервис с большим количеством разнообразных функций, как мелких и довольно специфичных, так и крупных и очень полезных (чего стоит только возможность тестирования сайта на мобильных устройствах с Windows Mobile, Symbian или iPhone). О полном списке возможностей и разнообразных «плюсов» можно прочитать на страницах сервиса.

А какими сервисами и инструментами пользуетесь вы когда тестируете кроссбраузерность сайта?

Тестирование сайта в разных браузерах ☛ закажите тестирование кроссбраузерности сайта

Тестирование сайта в разных браузерах


Тест на кроссбраузерность – вид
тестирования, который проводится для того, чтобы понять, одинаково ли ведет
себя ваш продукт при взаимодействии с разными версиями браузеров. Пользователь
должен обращаться к сервисам вашего программного продукта независимо от того,
каким браузером пользуется и какую аппаратную платформу предпочитает. Если
каждый десятый человек использует нестандартный браузер (или определенную устаревшую
версию), в котором ваше приложение меняет внешний вид или отступает от
заданного поведения, вы рискуете потерять аудиторию в 10%.


Актуально по умолчанию


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

  • форм;
  • фильтров;
  • динамических элементов;
  • отдельных модулей и разделов сайта.


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


Возможности WebmartQA – в ваших интересах


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

  • сетевые устройства;
  • базы данных;
  • системное программное обеспечение;
  • периферию (веб-камеры, принтеры и др.).


Стратегия тестирования и детали тестового покрытия определяются как на
основе реальных данных из аналитических систем (к пример, Яндекс.Метрики, GoogleAnalytics), так и с помощью глобальной
статистической информации от авторитетных источников в сети. Такой подход
позволяет предложить клиентам необходимый уровень покрытия, идеально отражающий
реальные требования текущих и потенциальных потребителей сервиса.



Нельзя игнорировать и тенденцию увеличения числа пользователей мобильных устройств.

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


Еще глубже –
кроссплатформенность


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


Такой тип тестирования также актуален для веб-приложений по причине того,
что одна и та же версия браузера может быть запущена из различных операционных
систем (от дистрибутивов Linux до MacOS), что может изменить визуальное представление интерфейса, повлиять на
функциональность модулей веб-приложения.


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

  • Windows
  • Windows Server
  • Linux
  • MacOS

Тест кроссбраузерности сайта — гарантии


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

Введение в кроссбраузерное тестирование — Изучите веб-разработку

В этой статье модуль начинается с обзора темы (кросс) браузерного тестирования и ответов на такие вопросы, как «что такое кроссбраузерное тестирование?», «С какими наиболее распространенными типами проблем вы столкнетесь?», и «каковы основные подходы к тестированию, выявлению и устранению проблем?»

Предварительные требования: Знакомство с основными языками HTML, CSS и JavaScript.
Цель: Чтобы получить представление о высокоуровневых концепциях кроссбраузерного тестирования.

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

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

Помните, что вы не являетесь своими пользователями — просто потому, что ваш сайт работает на MacBook Pro или Galaxy Nexus высокого класса, не означает, что он будет работать для всех ваших пользователей — предстоит еще много тестирования!

Примечание : «Заставить Интернет работать для всех» дает более полезное представление о различных браузерах, используемых людьми, их доле на рынке и связанных с ними проблемах кроссбраузерной совместимости.

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

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

Во-вторых, когда мы говорим «через приемлемое количество веб-браузеров», мы не имеем в виду 100% браузеров в мире — это практически невозможно. Вы можете сделать несколько осознанных звонков относительно того, какие браузеры и устройства будут использовать ваши пользователи (как мы обсудим во второй статье серии — см. Нужно проверить их все?), Но вы не можете гарантировать все.Как веб-разработчик, вам необходимо согласовать с владельцем сайта ряд браузеров и устройств, над которыми обязательно должен работать код, но помимо этого, вам необходимо разработать защитный код, чтобы дать другим браузерам наилучшие шансы на то, чтобы используйте свой контент. Это одна из самых серьезных проблем веб-разработки.

Примечание : Мы также рассмотрим защитное кодирование позже в этом модуле.

Существует много разных причин, по которым возникают проблемы с кроссбраузерностью, и обратите внимание, что здесь мы говорим о проблемах, когда вещи ведут себя по-разному в разных браузерах / устройствах / предпочтениях просмотра.Прежде чем вы даже перейдете к кроссбраузерным проблемам, вы должны уже исправить ошибки в своем коде (см. «Отладка HTML», «Отладка CSS» и «Что пошло не так?» Устранение неполадок JavaScript из предыдущих разделов, чтобы при необходимости освежить память).

Проблемы с кроссбраузерностью обычно возникают по следующим причинам:

  • Иногда в браузерах есть ошибки или функции по-разному реализуются. Эта ситуация намного менее плохая, чем была раньше; назад, когда IE4 и Netscape 4 соревновались за доминирующий браузер в 1990-х годах, компании-разработчики браузеров намеренно реализовывали разные вещи по-разному, чтобы попытаться получить конкурентное преимущество, что сделало жизнь разработчиков адом.В наши дни браузеры намного лучше следуют стандартам, но иногда все же появляются различия и ошибки.
  • некоторые браузеры могут иметь разные уровни поддержки технологических функций, чем другие. Это неизбежно, когда вы имеете дело с передовыми функциями, которые браузеры только реализуют, или если вам нужно поддерживать действительно старые браузеры, которые больше не разрабатываются, которые, возможно, были заморожены (т.е. над ними больше не выполняется новая работа. ) задолго до того, как была изобретена новая функция.Например, если вы хотите использовать на своем сайте передовые функции JavaScript, они могут не работать в старых браузерах. Если вам нужно поддерживать старые браузеры, возможно, вам придется не использовать их или преобразовать код в старомодный синтаксис, используя при необходимости какой-то кросс-компилятор.
  • Некоторые устройства могут иметь ограничения, из-за которых веб-сайт работает медленно или плохо отображается. Например, если сайт был разработан так, чтобы хорошо смотреться на настольном ПК, он, вероятно, будет выглядеть крошечным и его будет трудно читать на мобильном устройстве.Если ваш сайт содержит множество больших анимаций, это может быть нормально для планшета с высокими характеристиками, но может быть вялым или прерывистым на устройстве низкого уровня.

и другие причины.

В следующих статьях мы рассмотрим типичные проблемы кроссбраузерности и рассмотрим их решения.

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

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

Рабочий процесс тестирования и исправления ошибок в проекте можно разбить примерно на следующие четыре этапа (это очень грубо — разные люди могут действовать по-разному):

Начальное планирование> Разработка> Тестирование / обнаружение> Исправления / итерация

Шаги 2–4 будут повторяться столько раз, сколько необходимо для выполнения всей реализации.Мы рассмотрим различные части процесса тестирования более подробно в следующих статьях, а пока давайте просто резюмируем, что может происходить на каждом этапе.

Первоначальное планирование

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

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

Так, например, вы можете создать сайт электронной коммерции, который обслуживает клиентов в Северной Америке. Сайт должен полностью работать в последних нескольких версиях наиболее популярных браузеров для настольных и мобильных устройств (iOS, Android, Windows phone) — в том числе Chrome (и Opera, поскольку он основан на том же механизме рендеринга, что и Chrome), Firefox, IE. / Edge и Safari.Он также должен обеспечивать приемлемый опыт работы с IE 8 и 9 и быть доступным с соблюдением требований WCAG AA.

Теперь, когда вы знаете свои целевые платформы тестирования, вам следует вернуться и просмотреть требуемый набор функций и какие технологии вы собираетесь использовать. Например, если владелец сайта электронной коммерции хочет 3D-тур на основе WebGL по каждому продукту, встроенному в страницы продукта, он должен будет согласиться с тем, что это просто не будет работать в версиях IE до 11. Вам придется согласиться. чтобы предоставить версию сайта без этой функции пользователям старых версий IE.

Вам следует составить список потенциальных проблемных областей.

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

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

Разработка

Теперь о разработке сайта. Вы должны разделить различные части разработки на модули, например, вы можете разделить различные области сайта вверх — домашнюю страницу, страницу продукта, корзину покупок, рабочий процесс оплаты и т. Д.Затем вы можете дополнительно разделить их: реализовать общий верхний и нижний колонтитулы сайта, реализовать подробное представление страницы продукта, реализовать постоянный виджет корзины покупок и т. Д.

Существует несколько общих стратегий кроссбраузерной разработки, например:

  • Сделайте так, чтобы вся функциональность работала как можно точнее во всех целевых браузерах. Это может включать в себя написание разных путей кода, которые воспроизводят функциональность по-разному, нацеленные на разные браузеры, или использование Polyfill для имитации любой отсутствующей поддержки с использованием JavaScript или других технологий, или использование библиотеки, которая позволяет вам написать один бит кода, а затем выполняет разные вещи в фоновом режиме в зависимости от того, что поддерживает браузер.
  • Примите тот факт, что некоторые вещи не будут работать одинаково во всех браузерах, и предоставьте разные (приемлемые) решения в браузерах, которые не поддерживают полную функциональность. Иногда это неизбежно из-за ограничений устройства — широкоформатный кинотеатр не даст такого же визуального восприятия, как 4-дюймовый мобильный экран, независимо от того, как вы программируете свой сайт.
  • Примите тот факт, что ваш сайт просто не будет работать в некоторых старых браузерах, и двигайтесь дальше. Это нормально, если ваш клиент / пользовательская база согласны с этим.

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

Тестирование / обнаружение

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

  1. Протестируйте его в паре стабильных браузеров в вашей системе, таких как Firefox, Safari, Chrome или IE / Edge.
  2. Проведите небольшое тестирование доступности, например, попробуйте использовать свой сайт только с клавиатурой или используйте свой сайт через программу чтения с экрана, чтобы проверить, доступен ли он для навигации.
  3. Протестируйте на мобильной платформе, например Android или iOS.

На этом этапе исправьте все проблемы, которые вы обнаружите с новым кодом.

Затем вам следует попробовать расширить свой список тестовых браузеров до полного списка браузеров целевой аудитории и начать концентрироваться на устранении кроссбраузерных проблем (см. Следующую статью для получения дополнительной информации об определении ваших целевых браузеров).Например:

  • Попробуйте протестировать последнее изменение во всех современных браузерах для настольных ПК, в том числе в Firefox, Chrome, Opera, IE, Edge и Safari для ПК (в идеале — Mac, Windows и Linux).
  • Протестируйте его в обычных браузерах телефонов и планшетов (например, iOS Safari на iPhone / iPad, Chrome и Firefox на iPhone / iPad / Android),
  • Также проведите тесты в любых других браузерах, которые вы включили в свой целевой список.

Самый бесполезный вариант — просто провести все возможные тесты самостоятельно (привлечь товарищей по команде, чтобы они помогли, если вы работаете в команде).По возможности вы должны попробовать протестировать его на реальных физических устройствах.

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

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

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

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

При желании вы можете пойти и дальше.Доступны коммерческие инструменты, такие как Browserling, Sauce Labs, Browser Stack, Endtest, LambdaTest, TestingBot и CrossBrowserTesting, которые делают это за вас, не беспокоясь о настройке, если вы хотите вложить немного денег в свою тестирование. Также можно настроить среду, которая автоматически запускает тесты для вас, а затем позволяет вам регистрировать свои изменения в центральном репозитории кода только в том случае, если тесты все еще проходят.

Тестирование предварительных версий браузеров

Часто бывает полезно протестировать предварительные версии браузеров; см. следующие ссылки:

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

Исправления / итерация

Как только вы обнаружили ошибку, вам нужно попытаться исправить ее.

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

Возможно, это не ваша вина — если в браузере есть ошибка, мы надеемся, что поставщик быстро ее исправит. Возможно, это уже было исправлено — например, если ошибка присутствует в Firefox версии 49, но ее больше нет в Firefox Nightly (версия 52), значит, они исправили ее. Если это не исправлено, вы можете сообщить об ошибке (см. Сообщение об ошибках ниже).

Если это ваша вина, то нужно это исправить! Выявление причины ошибки включает ту же стратегию, что и любая ошибка веб-разработки (опять же, см. Разделы «Отладка HTML», «Отладка CSS» и «Что пошло не так? Устранение неполадок JavaScript»).После того, как вы обнаружили причину вашей ошибки, вам необходимо решить, как ее обойти в конкретном браузере, в котором она вызывает проблемы — вы не можете просто сразу изменить код проблемы, так как это может нарушить код в других браузерах. . Общий подход обычно заключается в том, чтобы каким-то образом разветвлять код, например, использовать код обнаружения функций JavaScript для обнаружения ситуаций, в которых проблемная функция не работает, и запускать другой код в тех случаях, которые действительно работают.

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

Чтобы повторить то, что было сказано выше, если вы обнаружите ошибки в браузерах, вы должны сообщить о них:

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

Кроссбраузерное тестирование

— всестороннее руководство

Готовность устройств

Подготовьте мобильные устройства или симуляторы / эмуляторы или облачные инструменты тестирования.
до начала тестирования.

После того, как предварительные условия будут выполнены, мы можем следовать приведенному ниже контрольному списку для разных
браузеры:

  1. Проверить SSL, CSS и HTML
  2. Выравнивание и интервалы между веб-элементами (флажки, кнопки, раскрывающиеся списки, текст
    поля и т. д.)
  3. Проверить макет страницы на устройствах с разным разрешением
  4. Дизайн, эффекты и стили одинаковы на всех страницах.
  5. Навигация по страницам правильная
  6. URL-ссылки правильно перенаправлены
  7. Поиск и справка работают исправно
  8. Свиток- (вертикальный и горизонтальный) рабочий
  9. Видимость шрифтов (цвет и размер)
  10. Выравнивание текста
  11. Подсказки инструментов и наведение мыши в порядке
  12. Медиа (аудио, видео и изображения) правильно отображаются и работают
  13. Формы работают нормально — сохранение, отправка, отмена, импорт, экспорт и т. Д.
  14. Файл (загрузка и скачивание)
  15. API-соединение непрерывно
  16. Отображается запрос сеансов и файлов cookie
  17. Формат даты согласован
  18. Проверить функцию увеличения и уменьшения масштаба
  19. Убедитесь, что всплывающие окна работают постоянно
  20. Анимация работает
Рекомендации по кроссбраузерному тестированию

Чтобы выполнить кроссбраузерное тестирование, мы можем следовать приведенным ниже рекомендациям:

  • Работа со старыми и редко используемыми браузерами
    Хотя может показаться, что сейчас IE 8 никто не использует, некоторые пользователи все еще используют IE.Мы
    также необходимо протестировать и обработать этот сценарий. Сайт может не работать на
    старые браузеры, поэтому для команды разработчиков было бы разумно написать отдельный
    таблица стилей для IE.

    Для редко используемых браузеров — перенаправить пользователя или создать базовый
    версия приложения для работы в этих браузерах.

  • Обрабатывать ошибки, не зависящие от браузеров
    Некоторые ошибки не зависят от браузеров (связанные с CSS), в каждом браузере они
    ведите себя аналогично. Следовательно, нет необходимости тестировать их на каждом
    браузер, иначе потратит время.Техники тестирования таких стилевых
    ошибки —

  1. Изменить размер браузера
  2. Тест с выключенным CSS
  3. Тест с отключенным JavaScript
  4. Тест с CSS и JavaScript отключены
  5. Увеличение и уменьшение масштаба
  • Установите приоритет браузеров
    Проверяйте использование браузеров пользователями и оценивайте их с учетом риска:

  • Низкий: Это 4-5 лучших браузеров, которые в основном используются
    пользователей и создают минимальный риск для приложения.Например. Chrome, Firefox,
    Сафари и др.

  • Средний:
    Это браузеры со средней степенью риска, которые не используются широко и не используются.
    редко используемый.

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

Протестируйте браузеры —

  1. Сначала протестируйте браузеры с высокой степенью риска, изменив разрешение, размер экрана и т. Д.
  2. Затем протестируйте браузеры с низким уровнем риска, изменив разрешение, размер экрана и
    дополнительно на разных устройствах.
  3. Наконец, протестируйте несколько браузеров со средней степенью риска.

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

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

Как выполнить кроссбраузерное тестирование?

Кроссбраузерное тестирование можно проводить двумя способами:

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

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

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

Некоторые функции средств автоматизации кроссбраузерного тестирования:

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

  3. Эти инструменты поддерживают визуальное тестирование, функциональное тестирование, регрессионное тестирование и т. Д.
  4. Тестовые примеры можно запускать параллельно, поэтому тестирование выполняется за меньшее время.
  5. Эти инструменты обеспечивают интеграцию CI / CD.
  6. Скриншоты и журналы представлены в отчетах об испытаниях. Некоторые инструменты предоставляют видео
    запись испытаний, к этим записям можно обращаться при необходимости.

Примеры таких инструментов:
Тестсигма,
SmartBear
CrossBrowserTesting,

BrowserStack и т. Д.

Кроссбраузерное тестирование: ручное или
Автоматическое кроссбраузерное тестирование
Ручное кроссбраузерное тестирование Автоматическое кроссбраузерное тестирование
Больше времени Меньше затрат времени (пробный запуск)
Последовательное тестирование Параллельное тестирование
Склонен к ошибкам Точный
Различные тесты для разных браузеров Многоразовый — один тестовый пример для всех браузеров
Меньше тестового покрытия Лучшее тестовое покрытие

Вот блог, в котором обсуждается ручная и
Автоматизированный кросс
Браузерное тестирование

Читать блог

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

Браузеров, устройств и комбинаций ОС слишком много для тестирования

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

Браузер * устройства * ОС * браузер
версии

Это приводит к огромному количеству тестовых случаев, которые очень сложно выполнить.
вручную.

Решение: Параллельное тестирование через кросс-браузер
инструмент автоматизации, в котором несколько сред тестируются параллельно. Отсюда и
тестирование занимает меньше времени.

Разное разрешение экрана может нарушить макет страницы

При рендеринге на устройствах с разным разрешением макет страницы может
перерыв. Ручное тестирование на всех устройствах с разным разрешением сложно
достигать.

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

Частые обновления браузеров

Браузеры получают частые обновления и выпускаются довольно разные версии.
быстро. Чтобы охватить каждую новую выпущенную версию, веб-приложение должно быть протестировано.
опять таки.

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

Узнайте больше о наиболее сложных задачах кроссбраузерного тестирования.

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

Попробуйте Testsigma

Автоматизация кроссбраузерного тестирования с помощью
Тестсигма

Testsigma — это облачное кроссбраузерное тестирование на основе ИИ без кода и с поддержкой Saas.
орудие труда.Он обеспечивает доступ к тысячам сред, ОС, реальных устройств и
браузеры сразу. Навыки программирования не требуются, так как тестовые примеры написаны на
простой английский.
Ниже приведены преимущества Testsigma:

  • Мгновенный доступ к тысячам сред: Testsigma освобождает нас от установки и
    лицензионные проблемы программного обеспечения и ОС и т. д.Доступны все среды
    в облаке, и к нему можно получить немедленный доступ.

  • Кодирование на простом английском языке: Сценарии автоматизации могут быть
    написано простым английским языком, поэтому предварительное знание кодирования не требуется.Кодировать и запускать тесты автоматизации действительно легко для всех. Мы можем
    немедленно запускайте наши тестовые примеры на инструменте.

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

  • Поддерживает непрерывную интеграцию: Обеспечивает интеграцию с
    Инструменты CI / CD, такие как Jenkins и т. Д., Для поддержки непрерывной интеграции.

  • Сторонняя интеграция: Обеспечивает интеграцию с
    JIRA, Github, Slack и др.

  • Тест на локальных машинах с использованием облака Testsigma:

    Вы можете тестировать локально размещенные веб-приложения на локальных машинах с помощью облака Testsigma.

  • реальных устройств: Доступ к тысячам реальных устройств есть
    доступны для тестирования, вам просто нужно их выбрать.

  • Высокая масштабируемость: Вам не нужно беспокоиться о масштабировании
    или вниз по вашей тестовой инфраструктуре в соответствии с потребностями тестирования. Testsigma сделает это автоматически. Также,
    когда на рынке выходит новая версия браузера или ОС, она добавляется
    Тестсигма в доступных средах.

  • Функциональное и визуальное тестирование:
    Testsigma поддерживает функциональное тестирование, а также
    визуальное тестирование пользовательского интерфейса (UI). Он проверяет последнее изображение
    приложение к базовому изображению, а затем сообщает о различиях.

  • Отчетность: Отчетность настраивается в соответствии с пользователем
    требования. Предоставляет скриншоты, логи, видеозаписи, подробные отчеты
    как часть отчетности.

  • Группа поддержки: Быстрая и квалифицированная команда поддержки, чтобы помочь и
    предоставить вам лучшие решения.

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

Облачное кроссбраузерное тестирование

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

Особенности облачного кроссбраузерного тестирования:

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

  • Возможны немедленные пробные запуски, поскольку необходимая инфраструктура уже создана.
    доступный.

  • Мы можем заплатить за среду и сразу же использовать ее.

  • К ним можно получить доступ откуда угодно, что очень удобно для удаленных команд.

Преимущества:

  • Для инфраструктуры не требуется настройка

  • Наличие реальных устройств

  • Доступ онлайн 24 * 7

  • Масштабируемый

  • Параллельное тестирование

  • Доступен из любого места

  • Стабильность тестовой среды

Подробнее о преимуществах кроссбраузерности в облаке
инструменты тестирования.

Что такое кроссбраузерное тестирование?

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

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

Зачем это нужно

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

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

Между тем, каждый браузер по-разному реагирует на эти изменения кода, и поэтому с каждым изменением кода возникает риск того, что любая из этих комбинаций браузер / устройство / ОС может не среагировать в соответствии с ожиданиями. Макет, доступность, возможность подключения, качество и производительность могут незначительно или экспоненциально варьироваться от браузера к браузеру, поскольку каждый из них отображает CSS, HTML и JavaScript по-разному.

Разработчики по своей сути знают и изучают браузеры и устройства с минимальным риском и, в свою очередь, используют их каждый день, чтобы просматривать продукт своего кодирования.Однако заблуждение состоит в том, что другой пользователь будет посещать тот же веб-сайт в тех же браузерах и на тех же устройствах. «Это работает на моей машине» — не верный аргумент.

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

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

Цели итогов

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

Когда кто-то в Internet Explorer может получить доступ к веб-сайту и пользоваться им так же, как кто-то в Google Chrome, это свидетельствует о приверженности пользовательскому опыту и тщательному процессу проектирования. Это означает, что потребители с меньшей вероятностью столкнутся с ошибками и отталкивающими элементами макета и, скорее всего, будут способствовать развитию чувства лояльности к бренду.

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

Как это делается

Выберите свои устройства

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

Решение об исполнении

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

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

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

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

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

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

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

Начать тестирование — Руководство и автоматизация

Где вы находитесь в процессе разработки и проектирования, всегда влияет на то, как вы собираетесь проводить тестирование браузера.

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

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

17 лучших инструментов кроссбраузерной проверки (для веб-разработчиков)

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

Если вы ищете хорошие решения, обратите внимание на этот список надежных и всеобъемлющих инструментов кроссбраузерной проверки.

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

10 самых распространенных типов веб-разработчиков

10 самых распространенных типов веб-разработчиков

Сколько разработчиков вы знаете в своей жизни? Если вы работаете с группой из них, вы … Читать дальше

BrowserShots

Один из первых сайтов для кроссбраузерного тестирования, он позволяет вам тестировать свой сайт в нескольких браузерах, в том числе в некоторых старых, таких как Lynx, Konqueror и Seamonkey.

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

Песочница браузера

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

Он предоставляет широкий спектр браузеров, включая некоторые старые версии Internet Explorer, а также версии браузеров Canary или Development.

Мультибраузер

Настольное приложение, объединяющее несколько браузеров из IE 7-11, Edge, Firefox, а также версий Chrome. Вы можете использовать его для тестирования своего сайта как для настольных компьютеров, так и для мобильных устройств с помощью эмулятора и с возможностью запуска теста вручную или автоматически.

LambdaTest

Онлайн-сервис, позволяющий запускать кросс-браузерные тесты для разных платформ. Вы можете, например, выбрать, тестировать ли ваш сайт в Firefox или Chrome, который работает в Windows, Linux или macOS.

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

Кроссбраузерное тестирование Experitest

Этот инструмент позволяет вам проверить совместимость и производительность вашего сайта в различных средах. Это также упрощает интеграцию с такими сервисами, как Github, Gitlab, Jenkins, TravisCI и CircleCI, что позволяет оптимизировать рабочие процессы развертывания вашего веб-сайта.

BrowserStack

Одно из выдающихся имен в кроссбраузерном тестировании, используемое некоторыми крупными проектами с открытым исходным кодом, такими как jQuery и React.js, BrowserStack перечисляет сотни браузеров, мобильных устройств и методов тестирования, чтобы убедиться, что ваши веб-сайты работают в максимально возможном количестве сред.

SauceLabs

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

CrossBrowserTesting

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

TestingBot

TestingBot предоставляет полную стратегию тестирования как для веб-сайтов, так и для собственных мобильных приложений. Таким образом, вы можете не только крутить браузеры, но и запустить тест на реальном устройстве iOS или Android.

Просмотр

Если вам нужно быстро и легко протестировать сайт в Internet Explorer, BrowserLing может быть тем инструментом, который вам нужен.

Легко тестируйте свой веб-сайт в интерактивном режиме в некоторых браузерах, включая старые, такие как Internet Explorer 10 и 11 и Safari 4 и 5.

Сравнение

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

Кукольник

Puppeteer — это модуль Node.js, который предоставляет API для взаимодействия с браузерами Chrome и Firefox.

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

Драматург

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

Playwright поддерживает браузер на основе Chromium, Firefox и Webkit (например, Safari).

Nightwatch.js

NightWatch.js — модуль Node.js для сквозного тестирования. С помощью простого в использовании API вы можете проверить, содержит ли элемент определенный текст, является ли он видимым или скрытым, и даже проверить класс, идентификатор и свойства CSS.

Кипарисовик

Cypress — это набор для тестирования, который упрощает и упрощает сквозное тестирование и отладку современных веб-приложений.

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

WebDriverIO

Платформа автоматизации тестирования Node.js. Он поддерживает множество библиотек JavaScript, например React.js, Vue и Angular прямо из коробки.

Поскольку он основан на W3C WebDriver и Chrome DevTools, стандартном и общепринятом протоколе, тест может выполняться локально или в облачной службе, такой как SauceLab, BrowserStack и TestingBot.

Селен

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

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

инструментов кроссбраузерного тестирования для нескольких браузеров от Inflectra

Почему кроссбраузерное тестирование

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

С Rapise вы можете записать тестовый сценарий с помощью одного браузера, а затем воспроизвести его с помощью Mozilla Firefox , Google Chrome , Apple Safari, Internet Explorer , Microsoft Edge и Opera :

Rapise поддерживает кросс-браузерное тестирование.Он использует объектную модель документа (DOM) веб-браузера для взаимодействия с текущей веб-страницей. Модель DOM браузера стандартизирована W3C.

Основные причины использования Rapise для кросс-браузерного тестирования:

  • Скрипты, созданные в одном браузере, работают без изменений во всех других поддерживаемых браузерах и версиях
  • Rapise может тестировать приложения с использованием чистых веб-технологий (HTML, AJAX), а также приложений, использующих устаревшие плагины, такие как Java-апплеты и Silverlight
  • .

  • Rapise имеет встроенную поддержку популярных веб-библиотек и фреймворков, таких как jQuery, React, Angular.
  • Поддерживает несколько версий Chrome, Firefox, Internet Explorer, Safari и Opera
  • Обеспечивает полный доступ к JavaScript API браузера и DOM
  • Обеспечивает поддержку новых элементов управления и поведения HTML5

Надежное кроссбраузерное тестирование

Различные веб-браузеры, представленные на рынке, имеют различные различия в реализации DOM. Во многих случаях эти различия несущественны.Но иногда они требуют особого обращения. Rapise имеет abstraction lay er , чтобы преодолеть эти различия и сделать записанные скрипты как универсальными, так и po ssible , сокращая работу тестировщиков.

Для более продвинутого тестирования вы можете получить доступ к DOM веб-браузера и API JavaScript.

JavaScript включен

Rapise имеет глубокую интеграцию с JavaScript, XPath и DOM, что делает его применимым для тестирования веб-приложений любого уровня сложности .Таким образом, люди, знакомые с веб-разработкой, должны иметь минимальную кривую обучения с Rapise. Поскольку родным языком сценариев, используемым Rapise, является JavaScript, можно легко увидеть состояние объектов браузера с помощью встроенного отладчика JavaScript:

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

Запись один раз, выполнение на многих

С Rapise вы можете запустить запись в другом браузере, чем тот, в котором она была записана, просто изменив указанный браузер в настройках воспроизведения:

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

Интегрированные инструменты просмотра DOM

Rapise имеет встроенный веб-браузер DOM (называемый Web Spy), который позволяет вам проверять объекты на веб-странице и изучать их для тестирования. Это полезно в тех случаях, когда у вас есть более сложные приложения для тестирования и вам нужно выбрать определенные объекты.

Для максимальной мощности и гибкости Rapise имеет механизм выбора XPATH и CSS, который позволяет вам попробовать наши различные запросы XPATH и / или CSS и посмотреть, какие объекты совпадают.Затем вы можете «изучить» успешные запросы как новые объекты, которые можно использовать в ваших тестовых сценариях.

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

Тренируйте Rapise с профилями веб-приложений

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

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

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

Чтобы справиться с этими проблемами, Rapise вводит концепцию профиля веб-приложения. Это простой файл JSON с определенной структурой, который инструктирует Rapise, как создавать XPath для элементов в конкретном приложении. Это позволяет Rapise разбираться в каждом приложении и с первого раза создавать надежные тесты.

Интеграция с Selenium WebDriver

С Rapise изначально вы можете записать тестовый сценарий с помощью одного браузера, а затем воспроизвести его с помощью Mozilla Firefox, Google Chrome или Microsoft Internet Explorer.

Кроме того, вы можете использовать Rapise с платформой Selenium WebDriver с открытым исходным кодом для воспроизведения тех же тестов в других браузерах, таких как Apple Safari , Microsoft Edge и Opera (а также IE, Firefox и ). Чоме ). Вы также можете использовать Rapise для написания собственного кода Selenium для случаев, когда вы хотите использовать существующую логику Selenium WebDriver.

Что такое кроссбраузерное тестирование

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

Что такое кроссбраузерное тестирование?

Кроссбраузерное тестирование

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

Мы можем проводить кроссбраузерное тестирование в разных браузерах как вручную, так и автоматически.

Чтобы проводить кроссбраузерное тестирование вручную, мы (тестировщики программного обеспечения) создаем тесты для каждого браузера и выполняем их вручную в каждом браузере.

Чтобы сделать это автоматически, мы могли бы создать тесты Selenium с несколькими условными операторами, которые выполняют тестовые примеры на основе указанного типа браузера.

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

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

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

Зачем нам нужно кроссбраузерное тестирование?

Нам необходимо обеспечить одинаковые возможности для пользователей независимо от того, какой тип ОС и какой браузер они используют. Не все используют одну и ту же среду. Несмотря на то, что Google Chrome является самым популярным на текущем рынке, все же большинство пользователей используют Mozilla Firefox, Safari и другие. Если веб-сайт не работает должным образом в определенном браузере, пользовательский опыт вредит

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

Представьте, что ваш сайт отлично работает в Google Chrome, и вас это устраивает. Конечно, доля рынка Google Chrome больше по сравнению с другими браузерами. Что, если ваш следующий клиент будет использовать Mozilla Firefox?

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

Если ваше приложение хорошо работает в одном браузере, вы не можете рассчитывать, что оно будет работать так же в других браузерах. Давайте посмотрим на простой пример. См. Снимки экрана ниже. Я сделал снимок главной страницы моего сайта SoftwareTestingMaterial.com как в Mozilla Firefox, так и в Google Chrome. Вы могли заметить, что в Chrome шестнадцатеричный цветовой код границы поля поиска — # 7E9DB9, что не похоже на Mozilla Firefox.

Даже с точки зрения функциональности в разных браузерах будет какая-то разница. Лучший способ обеспечить точную работу всех браузеров — это повторить одни и те же тесты в разных браузерах.

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

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

Некоторыми бесплатными инструментами тестирования кроссбраузерной совместимости являются LambdaTest, CrossBrowserTesting и BrowserStack. Эти инструменты не являются полностью бесплатными, но вы можете попробовать их бесплатные пробные версии.

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

Контрольный список для тестирования кроссбраузерной совместимости

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

Похожие сообщения:

5 инструментов для кроссбраузерного тестирования, которые стоит попробовать сегодня

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

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

BrowserShots — отличный способ проверить основы

Звучит просто, но BrowserShots — отличный способ проверить основы. Это онлайн-сервис, который быстро сделает снимки экрана вашего сайта в различных браузерах и версиях по вашему выбору, чтобы убедиться, что все в порядке.Вы также можете поиграть с включением и отключением JavaScript и Flash. Лучше всего то, что это бесплатно. Это дает вам хорошее начало и подходит для простых страниц с контентом, но для интерактивных сайтов вам нужно пойти немного дальше и использовать другой инструмент для проверки своей функциональности.

EndTest предлагает как бесплатную услугу, так и платные опции.

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

Selenium — одна из самых популярных сред автоматизированного тестирования.

Если вы думаете, что можете углубиться в автоматическое тестирование, Selenium — одна из самых популярных сред, позволяющая автоматизировать действия браузера.У вас есть несколько вариантов: Selenium IDE — это надстройка Firefox, которая позволит вам записывать и воспроизводить действия, или Selenium WebDriver, которая позволяет вам кодировать тесты практически на любом из основных языков по вашему выбору.

Начать работу с последним непросто, но для более крупных проектов он может принести дивиденды в долгосрочной перспективе. Существует множество облачных сервисов, в том числе Sauce Labs и BrowserStack, которые позволят вам выполнять тесты Selenium на различных платформах без самостоятельной установки виртуальных машин и эмуляторов.

С помощью IE Test вы можете просто запустить экземпляр Internet Explorer на вкладке Chrome или Firefox.

Мы коснулись того, как Internet Explorer может вызывать некоторые проблемы, особенно старые версии, которые имеют тенденцию отображать страницы очень по-разному, чем их конкурентов и из текущих браузеров сегодня. Так почему бы не решить эту проблему напрямую с помощью этого расширения, доступного для Firefox и Chrome, которое позволяет открывать вкладки, имитирующие Internet Explorer. Поскольку IE представляет собой самую большую проблему с точки зрения отклонения от веб-стандартов, опробование своего сайта с ним во время работы над ним может спасти вас от огромной головной боли в дальнейшем.

Browserling — это простой способ тестирования любого браузера, который вы хотите назвать

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

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

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

Эта статья изначально была опубликована в Web Designer, журнале о креативном веб-дизайне. Подпишитесь на Web Designer здесь .

Статьи по теме:

.