Поиск по сайту
Ctrl + K
Вопросы по Angular

Что такое Protractor?

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

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

  • Автоматизация тестов: Protractor предоставляет API для написания тестов, которые могут взаимодействовать с элементами на веб-странице так, как это делает пользователь.
  • Поддержка Angular: Protractor автоматически обрабатывает асинхронные операции, которые могут возникать в Angular-приложениях, исключая необходимость ручного ожидания завершения каждой операции.
  • Работа с браузерами: 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. Благодаря своим функциям, таким как автоматическое ожидание асинхронных операций и простота использования, он значительно упрощает процесс тестирования. Разработчики могут сосредоточиться на написании качественного кода, не беспокоясь о сложностях, связанных с ручным тестированием.