Использование debugger

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

Основные принципы работы debugger

debugger в JavaScript — это оператор, который останавливает выполнение кода в том месте, где он вызван, если запущен процесс в режиме отладки. В контексте Protractor это позволяет:

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

Подготовка к отладке в Protractor

Для использования debugger необходимо запускать Protractor с Node.js в режиме инспекции. Это делается через ключи:

node --inspect-brk ./node_modules/.bin/protractor protractor.conf.js
  • --inspect-brk — запускает процесс Node.js с включенным отладчиком и приостанавливает выполнение перед стартом теста.
  • После запуска можно подключиться через Chrome DevTools или любой совместимый отладчик, чтобы управлять выполнением тестов.

Использование debugger в тестах

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

describe('Angular приложение', function() {
    it('должно корректно загружать главную страницу', async function() {
        await browser.get('https://example.com');

        const title = await browser.getTitle();
        debugger; // выполнение остановится здесь

        expect(title).toEqual('Example Domain');
    });
});

В момент срабатывания debugger выполнение теста приостанавливается, и можно проверить:

  • Состояние DOM.
  • Значения переменных (title в примере).
  • Статус промисов и асинхронных операций.

Отладка асинхронного кода

Protractor использует async/await для работы с промисами WebDriver. При использовании debugger важно помнить:

  • await завершает промис и возвращает его значение.
  • Если поставить debugger до await, можно увидеть сам объект промиса, а не результат.
  • Если поставить debugger после await, можно проверить уже вычисленное значение.

Пример:

const button = element(by.id('submit'));
debugger; // проверка объекта ElementFinder
await button.click();
debugger; // проверка результата клика и состояния страницы

Управление точками остановки

Вместо явного debugger можно использовать:

  • Breakpoints в Chrome DevTools.
  • browser.pause() — встроенный метод Protractor, который запускает интерактивную паузу в консоли Node.js.

Пример использования browser.pause():

it('тест с паузой', async function() {
    await browser.get('https://example.com');
    await browser.pause(); // можно управлять шагами через REPL
    const header = await element(by.tagName('h1')).getText();
    expect(header).toBe('Example Domain');
});

browser.pause() особенно полезен для визуальной проверки состояния страницы и элементов без остановки всего Node-процесса.

Советы по эффективной отладке

  1. Разбивать тесты на небольшие шаги — длинные тесты сложнее анализировать при остановке.
  2. Сохранять состояние DOM между шагами — использование debugger после важных взаимодействий помогает выявлять проблемы с рендерингом Angular.
  3. Проверять промисы — важно удостоверяться, что промис завершился до проверки его значения.
  4. Комбинировать с browser.sleep() осторожно — иногда используется для визуального контроля, но может скрывать проблемы синхронизации.

Особенности работы с Angular

Protractor автоматически ждет завершения асинхронных операций Angular (зон и HTTP-запросов). Однако при сложных сценариях с внешними библиотеками или нестандартными промисами debugger помогает:

  • Поймать момент, когда Angular уже обновил DOM.
  • Проверить состояние элемента перед взаимодействием.
  • Убедиться, что тест корректно синхронизируется с приложением.

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

Оглавление