Структура test spec файла

Test spec файл в Protractor — это основной элемент, где описываются тесты, их шаги и проверки. Он написан на JavaScript (или TypeScript) и представляет собой сочетание синтаксиса Jasmine или Mocha с API Protractor, который обеспечивает взаимодействие с браузером через Selenium WebDriver.

Основные компоненты test spec файла

1. describe блоки describe используется для логического объединения тестов. Он позволяет структурировать тесты в группы и задавать контекст для набора проверок. Синтаксис:

describe('Название группы тестов', function() {
    // Тестовые сценарии
});

Особенности:

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

2. it блоки it определяет отдельный тестовый сценарий. Каждый it должен быть автономным и проверять конкретное поведение.

it('Должен открывать страницу логина', async function() {
    await browser.get('https://example.com/login');
    const title = await browser.getTitle();
    expect(title).toBe('Login Page');
});

Особенности:

  • Используется async/await для асинхронных операций с браузером.
  • Внутри it описываются действия пользователя и проверки с помощью expect.

3. beforeAll и afterAll Эти блоки выполняются один раз перед всеми тестами и после всех тестов внутри текущего describe. Обычно применяются для подготовки данных или открытия страницы.

beforeAll(async function() {
    await browser.waitForAngularEnabled(false); // Для не-Angular страниц
    await browser.get('https://example.com');
});

afterAll(async function() {
    await browser.quit();
});

4. beforeEach и afterEach Эти функции выполняются перед и после каждого it блока соответственно. Используются для сброса состояния приложения или подготовки тестовых данных.

beforeEach(async function() {
    await browser.refresh();
});

afterEach(async function() {
    // Логирование или снятие скриншотов после каждого теста
});

5. Работа с элементами страницы Protractor использует element и by для поиска элементов:

const usernameInput = element(by.id('username'));
const passwordInput = element(by.css('.password-field'));
const loginButton = element(by.buttonText('Login'));

await usernameInput.sendKeys('admin');
await passwordInput.sendKeys('12345');
await loginButton.click();

Особенности:

  • by.id, by.css, by.xpath и другие стратегии позволяют гибко искать элементы.
  • Все действия асинхронны, поэтому необходим await.

6. Проверки с expect Jasmine предоставляет функции для утверждений (expect), которые проверяют результаты действий:

const errorMessage = element(by.css('.error-msg'));
expect(await errorMessage.getText()).toContain('Неверный логин');

Ключевые моменты:

  • expect всегда используется с результатом асинхронной операции (await).
  • Можно проверять видимость элемента, текст, наличие атрибутов и состояние.

7. Организация больших spec файлов Для поддерживаемости и читаемости больших проектов часто применяются следующие подходы:

  • Разделение тестов на несколько spec файлов по функциональности (login.spec.js, dashboard.spec.js).
  • Использование Page Object Model для инкапсуляции логики работы с элементами страницы.
  • Вложенные describe для группировки по подфункциональности.
describe('Dashboard', function() {
    describe('Widgets', function() {
        it('Должен отображать виджет статистики', async function() {
            const widget = element(by.css('.stats-widget'));
            expect(await widget.isDisplayed()).toBe(true);
        });
    });
});

8. Асинхронность и Protractor Protractor полностью построен на Selenium WebDriver, поэтому все операции с браузером возвращают промисы. В современных версиях используется async/await, что делает код читаемым и линейным:

await browser.get('https://example.com');
await element(by.css('.submit-btn')).click();
expect(await element(by.css('.success-msg')).isDisplayed()).toBe(true);

9. Дополнительные возможности spec файла

  • Skips и фокусировка тестов:

    • xit — пропуск теста
    • fit — запуск только этого теста
  • Параметризация тестов: можно использовать массив данных и forEach для генерации нескольких сценариев.

const credentials = [
    { user: 'admin', pass: '12345' },
    { user: 'user1', pass: 'pass1' }
];

credentials.forEach(cred => {
    it(`Логин для пользователя ${cred.user}`, async function() {
        await element(by.id('username')).sendKeys(cred.user);
        await element(by.id('password')).sendKeys(cred.pass);
        await element(by.buttonText('Login')).click();
        expect(await element(by.css('.dashboard')).isDisplayed()).toBe(true);
    });
});

10. Советы по поддерживаемости

  • Каждый spec файл должен тестировать один аспект приложения.
  • Логические блоки (describe) помогают структурировать отчеты и делают их читаемыми.
  • Использование Page Object Model уменьшает дублирование кода и облегчает поддержку.
  • Асинхронные операции всегда оборачивать в await для исключения ошибок синхронизации.

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