Автор: Филип Рик (Filip Hric)
Оригинал статьи: https://filiphric.com/cypress-basics-using-baseurl
Перевод: Ольга Алифанова

Cypress создан для тестирования вашего приложения. Иными словами, он спроектирован, чтобы протестировать приложение, к которому у вас есть доступ, которое вы активно разрабатываете. Поэтому в Cypress встроен параметр baseUrl, помогающий настроить стартовую точку ваших усилий по тестированию. В этой статье мы разберемся, что это такое, и как этим пользоваться.

Настройка baseUrl в конфигурации Cypress

Первый шаг на пути использования baseUrl в Cypress – это его настройка в файле cypress.config.js. Этот файл расположен в корне вашего Cypress-проекта и содержит различные опции настройки тестов. Конфигурация будет выглядеть примерно так:

cypress.config.js

1  const { defineConfig } = require('cypress')
2
3  module.exports = defineConfig({
4    e2e: {
5      setupNodeEvents(on, config) {
6      },
7      baseUrl: 'https://example.com'
8    },
9  })

Вам нужно заменить https://example.com на реальный URL вашего веб-приложения. Это может быть локальный адрес (если вы тестируете локально), препрод или прод. Конфигурация делает заданный тут URL доступным в качестве baseUrl в ваших тестах.

Доступ к baseUrl в тестах

После настройки baseUrl в конфигурации можно получить к нему доступ различными способами. К примеру, команды cy.visit(), cy.request() и cy.intercept() будут пользоваться этим baseURL, поэтому вместо ввода полного URL используйте только путь.

1  cy.visit('/home')
2  // превращается в https://example.com/home
3
4  cy.request('/api/items')
5  // превращается в https://example.com/api/items
6
7  cy.intercept('/api/logout')
8  // превращается в https://example.com/api/logout

???? Знаете ли вы, что вместо перехода по URL можно открыть файл html? Используйте cy.visit('index.html') для открытия файла index.html в корневой папке вашего проекта.

Изменение baseUrl в ходе прогона тестов

В некоторых случаях может понадобиться поменять baseUrl на уровне теста. Это может пригодиться для дымовых тестов, предназначенных для покрытия более крупной системы, состоящей из приложений, разделенных на несколько доменов. Для настройки другого baseUrl в тесте можно использовать объект конфигурации теста:

1  describe('smoke tests', () => {
2    it('test default domain', () => {
3      cy.visit('/home')
4      // перейдет на https://example.com/home
5    })
6
7    it('test some other domain', { baseUrl: 'https://other.com '}, () => {
8      cy.visit('/home')
9      // перейдет на https://other.com/home
10    })
11  })

Проверки с baseUrl

В тестах могут понадобиться проверки, задействующие baseUrl. К примеру, нужно убедиться, что после определенного действия приложение переходит на правильную страницу.

Вот пример, как это сделать:

1  describe('Redirect Test', () => {
2    it('Redirects to the login page after signing out', () => {
3      const baseUrl = Cypress.config('baseUrl');
4      // Выполнение выхода из системы
5      cy.get('#sign-out-button').click();
6      // Проверка, что пользователь переходит на страницу авторизации
7      cy.url().should('eq', `${baseUrl}/login`);
8    });
9  });

Передача baseUrl через CLI

На самом деле можно вообще не настраивать baseUrl в файле cypress.config.js. Вместо этого можно указывать его при открытии Cypress:

1  npx cypress open --config baseUrl=https://staging.example.com

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

Динамическое определение baseUrl

Можно пойти на уровень выше и динамически определять baseUrl. Это можно сделать как в самом параметре, так и применив функцию setupNodeEvents(). Посмотрим на примеры.

cypress.config.js

1  const { defineConfig } = require('cypress')
2
3  module.exports = defineConfig({
4    e2e: {
5      setupNodeEvents(on, config) {
6      },
7      baseUrl: process.env.CI ? "https://staging.example.com" : "http://localhost:3000"
8    },
9  })

В этом примере локация https://staging.example.com установлена для прогона тестов через процессы CI. Большинство сервисов CI устанавливают переменную CI=1, которой можно воспользоваться для принятия решения. Мы добавляем условие, которое установит https://staging.example.com, если мы в CI-окружении, и http://localhost:3000, если это не так.

Если нужно переключаться между несколькими URL, воспользуемся функцией setupNodeEvents():

cypress.config.js

1  const { defineConfig } = require('cypress')
2
3  module.exports = defineConfig({
4    e2e: {
5      setupNodeEvents(on, config) {
6
7        const version = config.env.VERSION || 'local'
8
9        const urls = {
10          local: "http://localhost:3000",
11          staging: "https://staging.example.com",
12          prod: "https://example.com"
13        }
14
15        // выбор версии из объекта urls
16        config.baseUrl = urls[version]
17
18        return config
19      },
20    },
21  })

Теперь можно легко переключаться между разными URL, передавая имя версии приложения во флаг -env:

1  # будет использоваться http://localhost:3000
2  npx cypress open --env version="local"
3  # будет использоваться http://staging.example.com
4  npx cypress open --env version="staging"
5  # будет использоваться http://example.com
6  npx cypress open --env version="prod"
7  # будет использоваться fallback to http://localhost:3000
8  npx cypress open

Best practices using baseUrl

Хорошие практики использования baseUrl

Распространенная ошибка применения baseUrl:

❌ не делайте так

1  cy.visit(Cypress.config('baseUrl') + '/home')

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

Настройка baseUrl позволяет писать тест так, чтобы запускать его в любом окружении. Это жизненно необходимо для гибкости ваших тестов.

Обсудить в форуме