Оптимизация качества и размера

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

  1. Снижение времени ожидания

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

  • waitForSelector(): Этот метод позволяет дождаться появления элемента на странице, что значительно снижает время ожидания в отличие от статических задержек, например, waitForTimeout(). Важно правильно настроить таймауты, чтобы избежать ненужных задержек. 

    await page.waitForSelector(&

  • 

    
waitForFunction(): Используется, когда
нужно дождаться выполнения какого-либо JavaScript-кода на странице. Это
особенно полезно для ожидания асинхронных операций.

    

    await page.waitForFunction(() => window.someAsyncFunctionComplete === true);
    

    •

  1. Минимизация количества селекторов и запросов

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

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

    // Оптимизированный селектор
const button = await page.$('.submit-button');

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

    const button = await page.$('.submit-button');
await button.click();

  1. Оптимизация взаимодействия с браузером

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

  • Отсутствие ненужных операций перезагрузки страницы: Если тесты не требуют полной перезагрузки страницы, следует избегать вызова page.reload() или других методов, которые могут замедлить выполнение.

  • Использование режима headless: При запуске Puppeteer в headless-режиме (без графического интерфейса) можно значительно ускорить работу, так как многие ресурсы не загружаются, а браузер работает быстрее. 

    const browser = await puppeteer.launch({ headless: true });

  1. Параллельное выполнение тестов

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

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

    const browser = await puppeteer.launch(); const page1 = await
browser.newPage(); const page2 = await browser.newPage();
    • await page1.goto('https://example1.com'); await page2.goto('https://example2.com');

  • Запуск нескольких экземпляров браузеров: Для полной изоляции можно запускать несколько экземпляров браузеров. В случае масштабируемости тестов это позволяет эффективно использовать ресурсы машины. 

    const browser1 = await puppeteer.launch();
const browser2 = await puppeteer.launch();

  1. Снижение размера кода тестов

Чистота и компактность кода теста напрямую влияют на производительность. Для оптимизации кода следует соблюдать несколько правил:

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

    const navigateToPage = async (page, url) => { await
page.goto(url, { waitUntil: 'domcontentloaded' }); };
    • await navigateToPage(page, 'https://example.com');

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

  1. Профилирование и устранение узких мест

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

  • Использование Chrome DevTools Protocol: Puppeteer может взаимодействовать с DevTools Protocol, что позволяет более детально исследовать производительность страницы. Это включает в себя анализ времени загрузки, использования памяти и других факторов. 

    await page.coverage.startJSCoverage();
// выполнение теста
const coverage = await page.coverage.stopJSCoverage();

  • Тестирование с фокусом на производительность: Применение методов тестирования с фокусом на производительность позволит снизить избыточные операции и минимизировать время отклика приложения.

  1. Оптимизация изображений и ресурсов

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

  • Отключение загрузки изображений: Для тестов можно отключить загрузку изображений, что значительно ускорит тестирование. 

    await page.setRequestInterception(true);
page.on('request', (request) => {
  if (request.resourceType() === 'image') {
 request.abort();
  } else {
 request.continue();
  }
});

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

  1. Управление состоянием браузера

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

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

    await page.reload({ ignoreCache: true });

  • Сохранение состояния между тестами: В случае необходимости сохранения состояния между тестами, можно сохранять cookies или localStorage. 

    const cookies = await page.cookies();
await page.setCookie(...cookies);

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

Оглавление