Это пример приложения, используемое для демонстрации тестирования Cypress.io. Приложение демонстрирует использование большинства команд Cypress API. Кроме того, это пример приложение настроено для запуска тестов E2E на различных платформах CI. Несколько рабочих процессов демонстрируют использование CI Cypress Docker Images, которые обеспечивают удобные, предварительно сконфигурированные совместимые среды для кипресса. Тесты также в значительной степени прокомментированы.
Чтобы увидеть применение кухонной раковины и просмотреть команды Cypress API, продемонстрированные приложением, посетите пример.
Для полной ссылки на нашу документацию перейдите на docs.cypress.io.
Для примера платежного приложения, демонстрирующего реальное использование тестирования Cypress.io end-to-to (E2E), перейдите в репозиторий Cypress-IO/Cypress-Realworld-App.
В следующей таблице перечислены живые рабочие процессы от различных поставщиков CI. Каждый из них независимо проверяют содержание этого примера репозитория. Они запускаются и записывают с использованием Cypress Cloud с их результатами, отображающими централизованно под Cypress Cloud ProjectId 4b7344
. Каждый поставщик CI показывает свой статус сборки на своем собственном сайте:
CI -провайдер | Рабочий процесс | Статус сборки | Пример Docker |
---|---|---|---|
Приложение | Appveyor.yml | ||
Circleci | .circleci/config.yml | ✅ | |
Cypress-IO/Github-Action | Использование Action.yml | ||
Действия GitHub | Single.yml | ||
Действия GitHub | Parallel.yml |
Вы можете найти все результаты CI, записанные в Cypress Cloud
В этой таблице показаны дополнительные примеры рабочих процессов CI. За исключением рабочих процессов действий GitHub, это не живые примеры, как в таблице выше, и они могут потребовать модификации перед использованием. Рабочие процессы Actions GitHub живые, и они работают без записи в Cypress Cloud.
CI -провайдер | Базовая конфигурация | Полная параллельная конфигурация | Пример Docker |
---|---|---|---|
AWS Amplify | amplify.yml | ||
AWS CODEBUILD | Basic/buildspec.yml | BUILDSPEC.YML | |
Лазурные трубопроводы | Basic/Azure-Ci.yml | Azure-Ci.yml | |
Buddy.works | Buddy.yml | ✅ | |
BUILDKITE | .buildkite/Pipeline.yml | ||
Circleci | Basic/.circleci/config.yml | ✅ | |
Cloudbees Codeship Pro | Базовый/Codeship-Pro | CodeShip-Services.yml | ✅ |
Действия GitHub | Chrome.yml | ||
Действия GitHub | Chrome-Docker.yml | ✅ | |
Гитлаб | Basic/.gitlab-ci.yml | .gitlab-ci.yml | ✅ |
Дженкинс | Basic/Jenkinsfile | Jenkinsfile | ✅ |
Семфор 2.0 | Basic/.semaphore.yml | .semaphore/semaphore.yml | |
Трэвис CI | Basic/.travis.yml | .travis.yml |
Примеры CI Provider Provider Cypring Procating Prescentation представлены еще несколько примеров с обширными руководствами для использования Cypress с некоторыми из самых популярных поставщиков CI.
Чтобы запустить тесты из этого репо на вашей локальной машине, сначала убедитесь, что ваша машина соответствует требованиям системы Cypress, включая установку node.js в соответствии с версией, указанной в файле. Переверсия.
Выполнение следующих инструкций будет клонировать репозиторий, установить зависимости и запустить Cypress:
git clone https://github.com/cypress-io/cypress-example-kitchensink.git
cd cypress-example-kitchensink
npm ci # install dependencies
npm run local:run # run Cypress headlessly
local:run
- это скрипт Package.json, который запускает локальный веб -сервер, а затем использует Cypress Run для запуска Cypress без головного. Если вы хотите запустить тесты Cypress в интерактивном режиме, запустите следующую команду, которая использует Cypress Open для запуска Cypress в режиме головы. Вы можете выбрать отдельные тесты для запуска.
npm run local:open
В качестве альтернативы использованию local:open
и local:run
сценарии, вы также можете запустить сервер за один шаг, а затем запустить Cypress на втором этапе.
npm start # start server on port 8080
Вы можете проверить, что сервер работает, если вы откроете веб -браузер и перейдите на http://localhost:8080
.
Затем в отдельном окне терминала выполнить либо
npx cypress run # for headless mode
или
npx cypress open # for headed interactive mode
Scripts local:run
и local:open
Используйте псевдоним start-test
модуля NPM, чтобы запустить ./Scripts/start.js, который запускает веб-сервер, ждет, пока он станет готовым, а затем, а затем Запускает Cypress.
Скрипт start
создает веб -сервер, используя модуль NPM, и отображает приложение Kitchen Sink на порту 8080
.
Если у вас установлен Docker, например, на рабочем столе Docker, вы можете запустить тесты из этого репо интерактивно в контейнере Docker. Используйте изображения Cypress Docker, которые построены со всеми предварительными условиями для запуска Cypress. Они доступны в качестве базовых, браузеров и включенных вариантов от Docker Hub и общедоступной галереи Amazon ECR (реестр эластичных контейнеров).
Как указано выше, начните с клонирования репо и установки зависимостей:
git clone https://github.com/cypress-io/cypress-example-kitchensink
cd cypress-example-kitchensink
npm ci
Примечание
Для простоты приведенные ниже примеры Docker используют ссылку на репозиторий, такой как cypress/base
с latest
тегом версии. Чтобы выбрать более раннюю версию, замените latest
на явную тег, например, cypress/base:20.15.1
. Явные теги версии рекомендуются для производства. Использование дополнительно объясняется в выборе тегов.
В следующем примере используется кипарисовое/базовое изображение, которое само по себе не содержит браузеров. Вместо этого вы будете использовать электронный браузер с кипарисом. Чтобы запустить контейнер Docker, выполните следующее:
docker run -it --rm -v .:/e2e -w /e2e cypress/base:latest
Когда появляется подсказка контейнера, введите:
npx cypress install # install Cypress binary
npm run test:ci # start server and run tests in Electron browser
exit
С изображением кипариса/браузеров у вас есть дополнительный выбор браузеров Chrome, Edge и Firefox. Выполнить следующее:
docker run -it --rm -v .:/e2e -w /e2e cypress/browsers:latest
Когда появляется подсказка контейнера, введите:
npx cypress install # install Cypress binary
npm run test:ci # start server and run tests in Electron browser
npm run test:ci:chrome # start server and run tests in Chrome browser
npm run test:ci:edge # start server and run tests in Edge browser
npm run test:ci:firefox # start server and run tests in Firefox browser
exit
Cypress/Включенные изображения добавляют полную установку Cypress по сравнению с Cypress/Browsers. Выполните следующее, чтобы запустить контейнер с командой одной линии, тестируя с браузером Chrome:
docker run -it --rm -v .:/e2e -w /e2e --entrypoint bash cypress/included:latest -c ' npm run test:ci:chrome ' # use for matching Cypress versions
Замените latest
тег в вышеупомянутой команде, используя версию Cypress из Package repo.json, если этот репозиторий еще не был обновлен до последней выпущенной версии Cypress. Обратите внимание, что несоответствующие версии вызовут ошибки.
Примечание
Дополнительные браузеры Chrome, Edge и Firefox устанавливаются только на изображениях архитектуры linux/amd64
cypress/browsers
и cypress/included
. Браузеры недоступны предварительно установлены для архитектурных изображений linux/arm64
. Электронный браузер, встроенный для кипариса, доступен на всех изображениях и архитектурах.
Если вы хотите попробовать запуск тестов в поставщике непрерывной интеграции (CI), вам нужно сначала разобраться в хранилище, чтобы у вас была собственная копия. Обратитесь к документации GitHub для настройки псевдонимов для remote upstream
(для этого репо) и правильного remote origin
(в вашу вилку). Вам также нужно будет иметь учетную запись с поставщиком CI, с которым вы хотите проверить.
Ознакомьтесь с руководящими принципами.
Смотрите релизы.