Работа с таймаутами навигации

Работа с таймаутами навигации в Puppeteer

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

Таймауты при навигации

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

Пример базовой навигации с таймаутом: 

const puppeteer = require(&

async function run() {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  
  try {
    // Переход на страницу с таймаутом 30 секунд
    await page.goto('https://example.com', { timeout: 30000 });
  } catch (error) {
    console.error('Ошибка навигации:', error);
  }

  await browser.close();
}

run();

Здесь timeout устанавливает максимальное время ожидания для загрузки страницы. В случае, если страница не загрузится за это время, будет выброшена ошибка.

Таймауты и события навигации

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

  • page.goto(url, options): используется для перехода на указанную страницу.
  • page.waitForNavigation(options): используется для ожидания завершения навигации, которая может быть вызвана кликом, отправкой формы или другими действиями.
  • page.waitForSelector(selector, options): ожидает появления определенного элемента на странице, что может быть полезно после перехода на новую страницу.

Пример использования таймаута с методом waitForNavigation: 

const puppeteer = require('puppeteer');

async function run() {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();

  // Переход на страницу
  await page.goto('https://example.com');
  
  // Ожидание завершения навигации с таймаутом 10 секунд
  await page.waitForNavigation({ timeout: 10000 });

  await browser.close();
}

run();

Таймауты при ожидании элементов

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

Пример: 

const puppeteer = require('puppeteer');

async function run() {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();

  // Переход на страницу
  await page.goto('https://example.com');
  
  // Ожидание появления элемента с заданным таймаутом
  await page.waitForSelector('#main-content', { timeout: 5000 });

  await browser.close();
}

run();

Если элемент с id #main-content не появился за 5 секунд, будет выброшена ошибка.

Поведение при превышении таймаутов

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

Например, можно настроить глобальный таймаут для всех операций: 

const puppeteer = require('puppeteer');

async function run() {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();

  // Установка глобального таймаута для всех навигаций
  page.setDefaultNavigationTimeout(10000);

  try {
    // Переход на страницу
    await page.goto('https://example.com');
  } catch (error) {
    console.error('Ошибка навигации:', error);
  }

  await browser.close();
}

run();

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

Обработка ошибок при превышении таймаутов

При превышении времени ожидания в Puppeteer генерируется ошибка TimeoutError. Обычно она выглядит следующим образом: 

TimeoutError: Navigation timeout of 30000 ms exceeded

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

Пример обработки ошибки таймаута: 

const puppeteer = require('puppeteer');

async function run() {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();

  try {
    await page.goto('https://example.com', { timeout: 5000 });
  } catch (error) {
    if (error instanceof puppeteer.errors.TimeoutError) {
      console.log('Превышен таймаут при навигации');
    } else {
      console.log('Неизвестная ошибка:', error);
    }
  }

  await browser.close();
}

run();

Это позволяет точно определить, когда именно произошло превышение времени ожидания.

Таймауты и асинхронные операции

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

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

Таймауты и стратегия повторных попыток

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

Пример повторной попытки: 

const puppeteer = require('puppeteer');

async function tryWithRetry(fn, retries = 3, delay = 1000) {
  for (let i = 0; i < retries; i++) {
    try {
      await fn();
      return;
    } catch (error) {
      if (i < retries - 1) {
        console.log(`Попытка ${i + 1} не удалась, повтор через ${delay} мс`);
        await new Promise(resolve => setTimeout(resolve, delay));
      } else {
        console.log('Все попытки не удались');
        throw error;
      }
    }
  }
}

async function run() {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();

  await tryWithRetry(async () => {
    await page.goto('https://example.com', { timeout: 5000 });
  });

  await browser.close();
}

run();

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

Заключение

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

Оглавление