Ваша работа не ограничивается обеспечением отличной работы вашего сайта на Chrome и Android. Несмотря на то, что режим устройства может имитировать ряд других устройств, таких как iPhone, мы рекомендуем вам попробовать другие решения для браузеров для эмуляции.
Краткое содержание
- Если у вас нет определенного устройства или вы хотите провести выборочную проверку чего-либо, лучший вариант — эмулировать устройство прямо в браузере.
- Эмуляторы и симуляторы устройств позволяют имитировать сайт разработки на различных устройствах с вашей рабочей станции.
- Облачные эмуляторы позволяют автоматизировать модульные тесты вашего сайта на разных платформах.
Эмуляторы браузера
Эмуляторы браузера отлично подходят для тестирования отзывчивости сайта, но они не имитируют различия в API, поддержке CSS и некоторых функциях, которые вы можете увидеть в мобильном браузере. Проверьте свой сайт в браузерах, работающих на реальных устройствах, чтобы убедиться, что все работает так, как ожидалось.
Представление адаптивного дизайна Firefox
Firefox имеет адаптивный дизайн , который побуждает вас перестать думать о конкретных устройствах и вместо этого изучить, как ваш дизайн меняется при обычных размерах экрана или при вашем собственном размере, перетаскивая края.
Эмуляция Edge F12
Для эмуляции телефонов Windows Phone используйте встроенную эмуляцию Microsoft Edge.
Поскольку Edge не поддерживает устаревшую совместимость, используйте эмуляцию IE 11, чтобы смоделировать, как ваша страница будет выглядеть в старых версиях Internet Explorer.
Эмуляторы и симуляторы устройств
Симуляторы и эмуляторы устройств моделируют не только среду браузера, но и все устройство. Они полезны для тестирования вещей, требующих интеграции с ОС, например ввода формы с помощью виртуальных клавиатур.
Android-эмулятор
Стандартный браузер в эмуляторе Android
На данный момент невозможно установить Chrome на эмулятор Android. Однако вы можете использовать браузер Android, Chromium Content Shell и Firefox для Android, о которых мы поговорим позже в этом руководстве. Chromium Content Shell использует тот же механизм рендеринга Chrome, но не имеет каких-либо специфических функций браузера.
Эмулятор Android поставляется с Android SDK, который необходимо скачать отсюда . Затем следуйте инструкциям по настройке виртуального устройства и запуску эмулятора .
После загрузки эмулятора щелкните значок «Браузер», и вы сможете протестировать свой сайт в старом стандартном браузере для Android.
Оболочка содержимого Chromium на Android
Оболочка содержимого эмулятора Android
Чтобы установить Chromium Content Shell для Android, оставьте эмулятор работающим и выполните следующие команды в командной строке:
git clone https://github.com/PaulKinlan/chromium-android-installer.git
chmod u+x ./chromium-android-installer/\*.sh
./chromium-android-installer/install-chromeandroid.sh
Теперь вы можете протестировать свой сайт с помощью Chromium Content Shell.
Фаерфокс на Андроиде
Значок Firefox в эмуляторе Android
Как и в случае с Content Shell Chromium, вы можете получить APK для установки Firefox в эмулятор.
Загрузите нужный файл .apk с https://ftp.mozilla.org/pub/mozilla.org/mobile/releases/latest/ .
Отсюда вы можете установить файл на открытый эмулятор или подключенное устройство Android с помощью следующей команды:
adb install <path to APK>/fennec-XX.X.XX.android-arm.apk
Симулятор iOS
Симулятор iOS для Mac OS X поставляется с Xcode, который можно установить из App Store .
Когда закончите, узнайте, как работать с симулятором, из документации Apple .
Модерн.IE
Современная виртуальная машина IE
Виртуальные машины Modern.IE позволяют вам получать доступ к различным версиям IE на вашем компьютере через VirtualBox (или VMWare). Выберите виртуальную машину на странице загрузки здесь .
Облачные эмуляторы и симуляторы
Если вы не можете использовать эмуляторы и не имеете доступа к реальным устройствам, то облачные эмуляторы — лучший вариант. Большим преимуществом облачных эмуляторов перед реальными устройствами и локальными эмуляторами является то, что вы можете автоматизировать модульные тесты для своего сайта на разных платформах.
- BrowserStack (коммерческий) проще всего использовать для ручного тестирования. Вы выбираете операционную систему, выбираете версию браузера и тип устройства, выбираете URL-адрес для просмотра, и он запускает размещенную виртуальную машину, с которой вы можете взаимодействовать. Вы также можете запустить несколько эмуляторов на одном экране, что позволит вам проверить, как ваше приложение выглядит и работает на нескольких устройствах одновременно.
- SauceLabs (коммерческий) позволяет вам запускать модульные тесты внутри эмулятора, что может быть очень полезно для создания сценариев потока на вашем сайте и последующего просмотра видеозаписи этого на различных устройствах. Вы также можете провести ручное тестирование своего сайта.
- Device Anywhere (коммерческий) использует не эмуляторы, а реальные устройства, которыми можно управлять удаленно. Это очень полезно в том случае, если вам нужно воспроизвести проблему на конкретном устройстве и вы не можете увидеть ошибку ни в одном из вариантов предыдущих руководств.
- LambdaTest (коммерческий) поможет вам выполнить кроссбраузерное тестирование вручную в комбинации более чем 2000 браузеров и операционных систем. Пользователи смогут записывать видео сложных ошибок и делиться им через такие интеграции, как MS Teams, Slack и другие. Пользователи могут ускорить тестирование, выполняя тесты параллельно.