Тестирование браузера без графического интерфейса: Что это такое и как это сделать?

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

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

Ответ на эту проблему - бессерверное тестирование.

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

Что означает "бессерверный" для программного обеспечения?

По сути, "бессерверное" решение - это разделение интерфейсной и серверной частей системы:

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

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

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

Есть ли у вас какие-нибудь замечательные идеи и сомнения по поводу веб-скрапинга и Browserless?
Давайте посмотрим, что другие разработчики делятся на Discord и Telegram!

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

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

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

1. Более высокая производительность:

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

2. Низкое потребление ресурсов:

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

3. Высокая эффективность задач автоматизации:

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

4. Простая интеграция:

Бессерверные браузеры часто сочетаются с инструментами автоматизации, такими как Puppeteer, Selenium, Playwright, и т. д., и могут быть легко интегрированы в процесс непрерывной интеграции и доставки (CI/CD).

5. Поддержка кроссплатформенности:

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

6. Высокая скрытность:

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

Недостатки:

1. Сложная отладка:

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

2. Неполное соответствие реальному пользовательскому опыту:

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

3. Некоторые веб-сайты обнаруживают бессерверные браузеры:

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

4. Невозможность обрабатывать некоторые функции интерфейса:

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

5. Трудно для начинающих:

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

Когда использовать бессерверное тестирование?

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

1. Автоматизированное взаимодействие с HTML:

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

2. Тестирование выполнения JavaScript:

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

3. Веб-скрапинг:

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

4. Мониторинг сети и тестирование производительности:

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

5. Обработка вызовов Ajax:

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

6. Создание снимков веб-страниц:

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

Как настроить Selenium для бессерверного тестирования с Browserless?

Шаг 1. Установка зависимостей Selenium

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

pip install selenium

Шаг 2. Получение API-ключа

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

Шаг 3. Настройка Selenium для интеграции с Browserless

Selenium необходимо использовать API Browserless для бессерверного тестирования. Вы можете настроить command_executor WebDriver на WebSocket-URL, предоставленный Nstbrowser.

Ниже приведён пример кода на Python, показывающий, как использовать Browserless для бессерверного тестирования Selenium:

from selenium import webdriver
from selenium.webdriver.chrome.options import Options

# Настройка параметров браузера Chrome
chrome_options = Options()
chrome_options.add_argument('--headless')  # Включить бессерверный режим
chrome_options.add_argument('--disable-gpu')  # Если вы используете Windows

# WebSocket-URL Browserless от Nstbrowser
nstbrowser_url = 'wss://chrome.nstbrowser.com/webdriver?token=YOUR_NSTBROWSER_API_KEY'

# Настройка удалённого WebDriver для подключения к Browserless от Nstbrowser
driver = webdriver.Remote(
    command_executor=nstbrowser_url,
    options=chrome_options
)

# Посещение тестовой веб-страницы
driver.get("https://www.example.com")

# Вывод заголовка веб-страницы
print(driver.title)

# Закрытие браузера
driver.quit()

Как настроить Cypress для бессерверного тестирования с Browserless?

Шаг 1. Регистрация в Nstbrowser и получение API-ключа

Шаг 2. Установка Cypress

npm install cypress

Шаг 3. Настройка Cypress для подключения к Browserless

Создайте или измените файл конфигурации Cypress cypress.json или cypress.config.js в корневом каталоге проекта и добавьте конфигурацию Browserless в файл. Укажите удалённый экземпляр Browserless с помощью параметра конфигурации browser Cypress:

{
  "browser": "chrome",
  "chromeWebSecurity": false,
  "baseUrl": "https://your-application-url.com",
  "video": false
}

Шаг 4. Настройка Cypress для подключения к вашему экземпляру Browserless

Настройте Cypress для подключения к вашему облачному экземпляру Browserless с помощью API-ключа. В вашем тестовом скрипте вы можете подключиться:

• Установка переменной среды или использование файла .env для хранения вашего API-ключа:

CYPRESS_REMOTE_BROWSER_WS=ws://your-browserless-api-url
CYPRESS_API_KEY=your-api-key

Шаг 5. Запуск тестов Cypress

• Запустите тестовый скрипт Cypress из командной строки и убедитесь, что он подключен к экземпляру Browserless:

npx cypress run --browser chrome --headless

Это позволит использовать Nstbrowser's Browserless для бессерверного тестирования, что сделает тестирование более эффективным и позволит выполнять несколько экземпляров браузера через облако.

Как настроить Puppeteer для бессерверного тестирования с Browserless?

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

Шаг 1. Установка Puppeteer

Сначала убедитесь, что на вашей системе установлен Node.js. Затем установите Puppeteer в вашем проекте:

npm install puppeteer

Шаг 2. Получение API-ключа Browserless

Шаг 3. Настройка Puppeteer Browserless с Nstbrowser

Puppeteer может подключаться к бессерверной службе браузера через WebSocket-URL. Ниже приведён пример кода, как использовать Browserless для бессерверного тестирования:

const puppeteer = require('puppeteer-core');

(async () => {
  // WebSocket-URL Browserless
  const browser = await puppeteer.connect({
    browserWSEndpoint: 'wss://chrome.nstbrowser.com/webdriver?token=YOUR_NSTBROWSER_API_KEY'
  });

  // Открыть новую страницу
  const page = await browser.newPage();

  // Посещение веб-сайта
  await page.goto('https://www.example.com');

  // Вывод заголовка страницы
  const title = await page.title();
  console.log(`Заголовок страницы: ${title}`);

  // Пример создания снимка экрана
  await page.screenshot({ path: 'example.png' });

  // Закрытие экземпляра браузера
  await browser.close();
})();

Шаг 4. Выполнение скрипта

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

node your-script.js

Шаг 5. Просмотр панели управления Nstbrowser

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

Дополнительные замечания:

• Бессерверный режим Puppeteer: В Puppeteer по умолчанию работает в бессерверном режиме (headless: true), то есть пользовательский интерфейс не отображается. Если вам нужно переключиться в режим headless, вы можете установить headless в false.
• Преимущества, предоставляемые Nstbrowser: С Browserless вам не нужно устанавливать браузер локально, и вы можете использовать его IP-ротацию, прокси, автоматическое обход блокировки и другие функции, которые очень полезны для задач автоматизации в больших масштабах.

Как настроить Playwright для бессерверного тестирования с Browserless?

Шаг 1. Регистрация в Nstbrowser и получение API-ключа

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

Шаг 2. Установка Playwright

npm install playwright

Шаг 3. Настройка Playwright для подключения к Browserless

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

Создайте или измените тестовый скрипт Playwright и добавьте WebSocket-URL подключения Browserless и API-ключ в скрипт.

const { chromium } = require('playwright');

// Использование WebSocket-URL и API-ключа, предоставленного Browserless
(async () => {
  const browser = await chromium.connect({
    wsEndpoint: 'wss://your-nstbrowserless-api-url?token=your-api-key'
  });

  const context = await browser.newContext();
  const page = await context.newPage();

  // Открыть веб-сайт, который вы хотите проверить
  await page.goto('https://your-application-url.com');

  // Выполнить действия на странице, такие как щелчок, ввод текста и т. д.
  await page.click('button#submit');

  // Закрыть браузер
  await browser.close();
})();

Шаг 4. Запуск бессерверных тестов Playwright

Запустите ваш скрипт Playwright в терминале и убедитесь, что он подключен к экземпляру Browserless Nstbrowser:

node your-playwright-script.js

Шаг 5. Параллельное тестирование и оптимизация ресурсов

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

const { chromium } = require('playwright');

(async () => {
  // Подключение к Browserless и использование нескольких экземпляров браузера для параллельного тестирования
  const browser = await chromium.connect({
    wsEndpoint: 'wss://your-nstbrowserless-api-url?token=your-api-key'
  });

  // Создание нескольких контекстов браузера для параллелизации тестирования
  const context1 = await browser.newContext();
  const context2 = await browser.newContext();

  const page1 = await context1.newPage();
  const page2 = await context2.newPage();

  await page1.goto('https://example1.com');
  await page2.goto('https://example2.com');

  // Выполнить операции на странице
  await page1.click('#button1');
  await page2.click('#button2');

  // Закрыть экземпляр браузера
  await browser.close();
})();

Итог

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

• Что означает "бессерверный"?
• Преимущества и недостатки бессерверных браузеров
• Как использовать Browserless для бессерверного тестирования?

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

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