Что такое Protractor?

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

Основные возможности Protractor:

1. Автоматизация тестов: Protractor предоставляет API для написания тестов, которые могут взаимодействовать с элементами на веб-странице так, как это делает пользователь.
2. Поддержка Angular: Protractor автоматически обрабатывает асинхронные операции, которые могут возникать в Angular-приложениях, исключая необходимость ручного ожидания завершения каждой операции.
3. Работа с браузерами: Protractor взаимодействует с различными браузерами, используя WebDriver, что позволяет запускать тесты на разных платформах.

Как установить Protractor?

Сначала необходимо установить Node.js, если он еще не установлен. Затем вы можете установить Protractor с помощью NPM (Node Package Manager):

npm install -g protractor

Помимо этого, необходимо обновить WebDriver:

webdriver-manager update

Пример теста с использованием Protractor

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

1. Настройка конфигурационного файла

Создайте файл conf.js для настройки Protractor:

exports.config = {
  framework: 'jasmine',
  seleniumAddress: 'http://localhost:4444/wd/hub',
  specs: ['spec.js'],
  capabilities: {
    'browserName': 'chrome'
  }
};

2. Создание теста

Теперь создадим файл spec.js, в котором мы напишем тест:

describe('Заметки', function() {
  it('должен добавлять новую заметку', function() {
    // Открываем приложение
    browser.get('http://localhost:4200');

    // Находим поле для ввода
    let noteInput = element(by.model('newNote'));
    let addButton = element(by.buttonText('Добавить'));

    // Вводим заметку
    noteInput.sendKeys('Первая заметка');
    addButton.click();

    // Проверяем, что заметка появилась в списке
    let noteList = element.all(by.repeater('note in notes'));
    expect(noteList.count()).toBe(1);
    expect(noteList.first().getText()).toEqual('Первая заметка');
  });
});

3. Запуск тестов

Теперь мы можем запустить тесты. Для этого сначала запустите Selenium Server:

webdriver-manager start

После этого вы можете запустить Protractor с вашим конфигурационным файлом:

protractor conf.js

Заключение

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