Браузерная автоматизация строится вокруг программного управления движком рендеринга: запуск браузера, создание контекстов, управление страницами, выполнение JavaScript-кода, перехват сетевых запросов и имитация действий пользователя. В экосистеме Node.js ключевыми инструментами стали Puppeteer и Playwright, ориентированные на контроль Chromium и кросс-браузерную автоматизацию.
Обе библиотеки предоставляют высокоуровневый API поверх протокола DevTools (или его расширений), позволяя управлять браузером без графического интерфейса либо в полноценном режиме.
Puppeteer — библиотека, разработанная Google для управления Chromium через DevTools Protocol.
Puppeteer работает по следующей цепочке:
Node.js → Puppeteer API → DevTools Protocol → Chromium
Каждое действие (клик, навигация, ввод текста) транслируется в команды CDP.
Playwright разработан Microsoft как эволюция подхода автоматизации браузеров.
Playwright использует собственный протокол поверх браузеров:
Node.js → Playwright API → драйверы браузеров → Chromium / Firefox / WebKit
В отличие от Puppeteer, Playwright абстрагирует различия движков, обеспечивая одинаковое поведение сценариев.
npm install puppeteerПри установке загружается совместимая версия Chromium.
npm install playwrightДополнительно устанавливаются браузеры:
npx playwright installconst puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch({
headless: true
});
const page = await browser.newPage();
await page.goto('https://example.com');
await browser.close();
})();const { chromium } = require('playwright');
(async () => {
const browser = await chromium.launch({
headless: true
});
const page = await browser.newPage();
await page.goto('https://example.com');
await browser.close();
})();В Puppeteer контекст создаётся автоматически через
browser.newPage(), но поддерживаются
инкогнито-контексты:
const context = await browser.createIncognitoBrowserContext();
const page = await context.newPage();Playwright делает концепцию контекста базовой:
const context = await browser.newContext();
const page = await context.newPage();Каждый контекст:
Это важно для параллельного тестирования и мультиаккаунтных сценариев.
await page.goto('https://example.com');Puppeteer:
await page.goto('https://example.com', {
waitUntil: 'networkidle2'
});Playwright:
await page.goto('https://example.com', {
waitUntil: 'networkidle'
});Puppeteer:
const button = await page.$('button');
await button.click();Playwright:
await page.click('button');Playwright использует автоматическое ожидание элементов, снижая
необходимость ручных waitForSelector.
await page.type('#input', 'Hello world');await page.fill('#input', 'Hello world');Playwright дополнительно поддерживает:
keyboardmousetouchawait page.waitForSelector('#result');Часто требуется комбинировать ожидания вручную.
await page.click('#button');
await page.waitForSelector('#result');В Playwright большинство действий уже включает implicit wait, что уменьшает количество race condition.
await page.setRequestInterception(true);
page.on('request', request => {
if (request.url().includes('ads')) {
request.abort();
} else {
request.continue();
}
});await page.route('**/*', route => {
if (route.request().url().includes('ads')) {
route.abort();
} else {
route.continue();
}
});Playwright предоставляет более декларативный API маршрутизации.
await page.screenshot({ path: 'screen.png' });
await page.pdf({
path: 'file.pdf',
format: 'A4'
});await page.screenshot({ path: 'screen.png' });
await page.pdf({ path: 'file.pdf' });const title = await page.evaluate(() => document.title);const title = await page.evaluate(() => document.title);Playwright также поддерживает page.evaluateHandle для
работы с DOM-объектами.
const page1 = await browser.newPage();
const page2 = await browser.newPage();const context = await browser.newContext();
const page1 = await context.newPage();
const page2 = await context.newPage();Контекстная модель Playwright обеспечивает более строгую изоляцию параллельных сценариев.
headless: falsepuppeteer.launch({
headless: false,
slowMo: 50
});const context = await browser.newContext({
recordVideo: { dir: 'videos/' }
});Используется вместе с:
Чаще применяется для:
Имеет встроенный test runner:
npx playwright testПоддерживает:
page.on('response', response => {
console.log(response.url());
});page.on('response', response => {
console.log(response.url());
});Playwright расширяет событийную модель, добавляя события контекста и маршрутизации.
Playwright использует модель auto-waiting:
Это снижает вероятность нестабильных тестов, характерных для классической автоматизации.
Playwright позволяет реализовать:
await page.route('**/api/**', route =>
route.fulfill({
status: 200,
body: JSON.stringify({ ok: true })
})
);Автоматизация браузера требует строгого контроля:
Playwright:
const context = await browser.newContext({
permissions: ['geolocation']
});При масштабной автоматизации важны:
Playwright лучше подходит для горизонтального масштабирования за счёт контекстной модели.
Типичные сценарии:
Playwright:
npx playwright test --workers=4Puppeteer чаще интегрируется как вспомогательный инструмент в пайплайнах.
Playwright предоставляет:
Puppeteer требует ручной реализации логирования и сохранения состояния страницы.