Перейти к основному содержимому
Версия: v8

Браузеры

Что вы узнаете
  • Как Testplane работает с браузерами
  • Как описать браузеры в конфигурации
  • Какие есть источники браузеров: локальные, Docker, облако
  • Как выбрать подход под свою задачу

Введение​

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

Вы описываете нужные браузеры в секции browsers, а параметр gridUrl определяет, откуда их брать: локально, из Docker-грида (например, Selenoid) или из удаленного облака (BrowserStack, Sauce Labs).

Общая схема работы:

  1. Testplane читает секцию browsers
  2. Для каждого браузера берет gridUrl (общий или переопределенный на уровне браузера)
  3. Обращается к гриду и запускает браузер с указанными desiredCapabilities

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

Конфигурация браузеров​

Секция browsers описывает, в каких браузерах запускаются тесты.

testplane.config.ts
import type { ConfigInput } from "testplane";

export default {
browsers: {
chrome: {
gridUrl: "local",
desiredCapabilities: {
browserName: "chrome",
browserVersion: "125.0",
},
windowSize: "1920x1080",
headless: true,
},

"chrome-mobile": {
gridUrl: "local",
desiredCapabilities: {
browserName: "chrome",
browserVersion: "125.0",
"goog:chromeOptions": {
mobileEmulation: {
deviceName: "iPhone 12 Pro",
},
},
},
headless: true,
},
},
} satisfies ConfigInput;

Ключ в browsers (chrome, chrome-mobile) — логическое имя браузера. Оно используется в CLI и в отчетах. Имя не ограничивает реальные настройки: в desiredCapabilities можно указать любой browserName и browserVersion.

Версия браузера задается в desiredCapabilities.browserVersion. Для локальных браузеров Testplane скачает нужную версию, если она поддерживается.

windowSize: "1920x1080" задает размер окна, что важно для скриншотных тестов.

Headless-режим​

Параметр headless: true включает запуск браузера без графического интерфейса.

Важные моменты:

  • Поведение тестов идентично: с точки зрения тестов браузер с headless: true и headless: false работает полностью одинаково. Например, при запуске с headless: true все еще можно делать скриншоты, работать с DOM, выполнять любые команды.

  • Параметр обязателен в окружениях без UI: в окружениях, где нет графического интерфейса (например, в CI-джобах), необходимо использовать headless: true, иначе будут ошибки вида cannot open display и подобные.

Мобильная эмуляция​

Для Chrome используйте goog:chromeOptions.mobileEmulation:

const desiredCapabilities = {
"goog:chromeOptions": {
mobileEmulation: {
deviceName: "iPhone 12 Pro",
},
},
};

Остальные поддерживаемые настройки смотрите в официальной документации.

Для Firefox можно эмулировать мобильный user-agent через moz:firefoxOptions:

const desiredCapabilities = {
"moz:firefoxOptions": {
prefs: {
"general.useragent.override":
"Mozilla/5.0 (iPhone; CPU iPhone OS 14_0 like Mac OS X) AppleWebKit/605.1.15",
"layout.css.devPixelsPerPx": "3.0",
},
args: ["--width=390", "--height=844"],
},
};

Локальные браузеры​

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

Установка зависимостей​

Скачать все браузеры и драйверы, указанные в конфиге и поддерживающие автоматическую установку:

npx testplane install-deps

Загрузить только выбранные браузеры (по логическому имени из конфига):

npx testplane install-deps chrome-dark

Указать конкретные версии:

npx testplane install-deps chrome@130 firefox@104

По умолчанию браузеры и драйверы скачиваются в директорию .testplane в домашней папке пользователя. Путь можно изменить через переменную окружения TESTPLANE_BROWSERS_PATH:

TESTPLANE_BROWSERS_PATH=./node_modules/.testplane npx testplane install-deps

Удаление браузеров​

  • Удалите директорию .testplane в домашней папке
  • Или удалите каталог, указанный в TESTPLANE_BROWSERS_PATH

Поддержка браузеров​

Ниже представлена таблица поддерживаемых браузеров:

БраузерАвто-загрузкаАвто-загрузка драйвераЗапуск webdriver
Chrome+++
Firefox+++
Edge-++
Safari-++

Поддерживаемые версии браузеров в зависимости от ОС:

ОСWindowsMacOsUbuntu 20Ubuntu 22Ubuntu 24
Chrome73+73+73+73+73+
Firefox60+60+60+91+126+
Edge*****
Safari-*---

* — авто-загрузка браузера не поддерживается, но если браузер установлен пользователем, Testplane будет использовать установленную версию.

Запуск тестов​

Есть два варианта:

  • Через CLI-опцию --local:
npx testplane --local
  • Через gridUrl: "local" в конфигурации:
testplane.config.ts
import type { ConfigInput } from "testplane";

export default {
browsers: {
chrome: {
gridUrl: "local",
desiredCapabilities: {
browserName: "chrome",
browserVersion: "125.0",
},
windowSize: "1920x1080",
headless: true,
},
},
} satisfies ConfigInput;

Плюсы и минусы​

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

  • Высокая скорость запуска тестов
  • Нет затрат на облачные сервисы
  • Простая настройка и легкая отладка

Ограничения​

  • Ограниченный набор версий браузеров
  • Зависимость от операционной системы: скриншоты могут различаться

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

Браузеры в Docker-контейнерах​

Docker-контейнеры дают изолированное и воспроизводимое окружение, удобное для CI/CD. Часто используют Selenoid — легковесную реализацию Selenium Grid, которая запускает браузеры внутри контейнеров.

Selenoid:

  • Управляет браузерами в Docker-контейнерах
  • Автоматически масштабирует контейнеры
  • Умеет записывать видео и дает VNC-доступ
  • Настраивается через простой JSON-файл с браузерами

Образы браузеров​

Готовые образы доступны на Docker Hub:

Готовые образы могут не включать самые свежие версии браузеров. Чтобы собрать актуальные образы, воспользуйтесь инструкциями из репозитория gemini-testing/images.

Следить за появлением готовых свежих образов можно в этом issue.

Запуск одного браузера в Docker​

Самый простой способ запустить браузер в Docker — использовать готовый образ напрямую:

docker run -it --rm --privileged -p 4444:4444 -p 5900:5900 -e ENABLE_VNC='true' selenoid/chrome:125.0

Эта команда:

  • Запускает контейнер с Chrome 125.0
  • Пробрасывает порт 4444 для WebDriver
  • Пробрасывает порт 5900 для VNC-доступа
  • Включает VNC для возможности просмотра браузера

В конфигурации Testplane укажите:

testplane.config.ts
import type { ConfigInput } from "testplane";

export default {
browsers: {
chrome: {
gridUrl: "http://localhost:4444",
desiredCapabilities: {
browserName: "chrome",
browserVersion: "125.0",
},
windowSize: "1920x1080",
headless: true,
},
},
} satisfies ConfigInput;

Этот подход удобен для быстрого тестирования или отладки в конкретной версии браузера.

Запуск Selenoid с несколькими браузерами​

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

Создание конфигурации​

Создайте файл browsers.json с описанием нужных браузеров:

browsers.json
{
"chrome": {
"versions": {
"125.0": {
"image": "selenoid/chrome:125.0",
"path": "/",
"port": "4444",
"shmSize": 2147483648,
"tmpfs": {
"/tmp": "size=512m"
},
"volumes": ["/tmp/.X11-unix:/tmp/.X11-unix"]
}
}
},
"chrome-mobile": {
"versions": {
"125.0": {
"image": "selenoid/chrome-mobile:125.0",
"path": "/wd/hub",
"port": "4444",
"shmSize": 2147483648,
"tmpfs": {
"/tmp": "size=512m"
},
"volumes": ["/tmp/.X11-unix:/tmp/.X11-unix"]
}
}
}
}

Запуск Selenoid​

Запустите Selenoid, указав путь к конфигурации (в примере конфиг лежит в /home/selenoid-config/browsers.json):

docker run --rm -d \
--name selenoid \
-v /var/run/docker.sock:/var/run/docker.sock \
-v /home/selenoid-config:/etc/selenoid/:ro \
--network=host \
aerokube/selenoid:latest

Selenoid будет автоматически запускать нужные контейнеры браузеров при получении запросов от Testplane.

Конфигурация Testplane​

Базовая конфигурация идентична локальным браузерам, меняется только gridUrl:

testplane.config.ts
import type { ConfigInput } from "testplane";

export default {
browsers: {
chrome: {
gridUrl: "http://localhost:4444/wd/hub",
desiredCapabilities: {
browserName: "chrome",
browserVersion: "125.0",
},
windowSize: "1920x1080",
headless: true,
},

"chrome-mobile": {
gridUrl: "http://localhost:4444/wd/hub",
desiredCapabilities: {
browserName: "chrome",
browserVersion: "125.0",
"goog:chromeOptions": {
mobileEmulation: {
deviceName: "iPhone 12 Pro",
},
},
},
headless: true,
},
},
} satisfies ConfigInput;

Подробнее о настройке Selenoid читайте в официальной документации.

Специфичные опции Selenoid​

Selenoid поддерживает дополнительные опции через selenoid:options:

testplane.config.ts
import type { ConfigInput } from "testplane";

export default {
browsers: {
chrome: {
gridUrl: "http://localhost:4444/wd/hub",
desiredCapabilities: {
browserName: "chrome",
browserVersion: "125.0",
"selenoid:options": {
enableVNC: true,
enableVideo: true,
enableLog: true,
},
},
windowSize: "1920x1080",
headless: true,
},

"chrome-mobile": {
gridUrl: "http://localhost:4444/wd/hub",
desiredCapabilities: {
browserName: "chrome",
browserVersion: "125.0",
"goog:chromeOptions": {
mobileEmulation: {
deviceName: "iPhone 12 Pro",
},
},
"selenoid:options": {
enableVNC: true,
enableVideo: true,
enableLog: true,
},
},
headless: true,
},
},
} satisfies ConfigInput;

Плюсы и минусы​

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

  • Браузеры ведут себя одинаково на любой машине — хоть на Mac разработчика, хоть в Linux CI
  • Стабильность скриншотов: одинаковое окружение гарантирует отсутствие различий в рендеринге между разными ОС
  • В Selenoid можно записывать видео прогона тестов и подключаться к браузеру через VNC

Ограничения​

  • Нужно устанавливать Docker и скачивать образы браузеров (плюс Selenoid, если используете его)
  • Потребляет больше ресурсов, чем локальные браузеры

Docker хорошо подходит для CI/CD и скриншотного тестирования, где важна стабильность и воспроизводимость.

Удаленные гриды​

Облачные сервисы (BrowserStack, Sauce Labs и др.) дают широкий набор браузеров, ОС и реальных устройств для кросс-браузерного тестирования.

Подключение и аутентификация​

Для подключения нужно указать gridUrl сервиса и передать учетные данные через user и key. Рекомендуется хранить их в переменных окружения.

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

testplane.config.ts
export default {
browsers: {
chrome: {
gridUrl: "https://hub.browserstack.com/wd/hub",
user: process.env.BROWSERSTACK_USERNAME,
key: process.env.BROWSERSTACK_ACCESS_KEY,
desiredCapabilities: {
browserName: "chrome",
browserVersion: "125.0",
"bstack:options": {
os: "Windows",
osVersion: "11",
projectName: "My Test Project",
buildName: "Build 1.0",
},
},
windowSize: "1920x1080",
headless: true,
},

"chrome-mobile": {
gridUrl: "https://hub.browserstack.com/wd/hub",
user: process.env.BROWSERSTACK_USERNAME,
key: process.env.BROWSERSTACK_ACCESS_KEY,
desiredCapabilities: {
browserName: "chrome",
browserVersion: "125.0",
"goog:chromeOptions": {
mobileEmulation: {
deviceName: "iPhone 12 Pro",
},
},
"bstack:options": {
os: "Windows",
osVersion: "11",
projectName: "My Test Project",
buildName: "Build 1.0",
},
},
headless: true,
},
},
};

Кастомизация сессий​

У разных сервисов свои опции:

BrowserStack (bstack:options)

  • ОС и ее версия (os, osVersion)
  • Разрешение экрана (resolution)
  • Локальное тестирование (local)
  • Включение логов и отладки (debug, networkLogs, consoleLogs)

Sauce Labs (sauce:options)

  • Имя и билд (name, build)
  • Теги (tags)
  • Ограничения по времени (commandTimeout, idleTimeout, maxDuration)
  • Видео и логи (recordVideo, recordLogs)

Таймауты и отладка​

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

Для отладки доступны:

  • Логи сессий
  • Видео каждого прогона
  • VNC или аналог для просмотра браузера
  • Сетевые логи

Плюсы и минусы​

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

  • Широкий выбор браузеров, версий и операционных систем
  • Не требуется поддержка собственной инфраструктуры
  • Встроенные инструменты отладки: логи, видео, сетевые трассировки

Ограничения​

  • Стоимость использования при большом количестве запусков
  • Зависимость от качества сети и возможные задержки
  • Жесткие ограничения по времени выполнения сессий

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

Как выбрать источник браузеров​

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

Локальные браузеры для большинства проектов​

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

Docker для стабильных скриншотов​

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

Облачные гриды для масштабирования​

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

подсказка

Для разработки и отладки можно использовать локальные браузеры (запуск с --local), даже если в CI используется Docker или облако. Это ускорит итерации при написании тестов.

Отладка​

Есть два способа включить подробные логи.

  1. Через конфигурацию:

    testplane.config.ts
    export default {
    browsers: {
    // ... ваши браузеры
    },
    system: {
    debug: true,
    },
    };
  2. Через переменные окружения (с ограничением уровня логирования webdriverio):

    testplane_system_debug=true WDIO_LOG_LEVEL=error npx testplane --local -b chrome