Set Up CircleCI And Web application testing with the Cypress CircleCI

KailashPathak
3 min readFeb 16, 2021

--

What is CircleCI

CircleCI is a modern continuous integration and continuous delivery (CI/CD) platform.

Set up CircleCI and Integration of CircleCI with the repository

Pre-Condition: Some repo in Git Hub is already created

1.Login > Login /Sign up into CircleCI with existing .git account

2. Add Project > After login into the CircleCI click on Add Project

3. Created repo is displayed in Circle Ci project dashboard e.g see below one example

4. Click on “Set up Project” against the above repo “Hello-World” Below Screen is open

5. Click onUse Existing Config” from the above screen

6. Since in our repo “Hello-World” we don’t have a .yml file we have to create .circleci/config.yml and can Start building the project

.yml file given below

# Use the latest 2.1 version of CircleCI pipeline process engine. See: https://circleci.com/docs/2.0/configuration-reference

version: 2.1

# Use a package of configuration called an orb.

orbs:

# Declare a dependency on the welcome-orb

welcome: circleci/welcome-orb@0.4.1

# Orchestrate or schedule a set of jobs

workflows:

# Name the workflow “welcome”

welcome:

# Run the welcome/run job in its own container

jobs:

- welcome/run

One-Click on Start building should pipeline start to run automatically — and pass! So, what just happened? Click on the green Success button on your pipeline to investigate the following parts of the run

  • Pipeline: Represents the entirety of the configuration. Available in CircleCI Cloud only.
  • Workflows: Responsible for organizing multiple jobs.
  • Jobs: Responsible for running a series of steps that perform commands.
  • Steps: Run commands (such as installing dependencies or running tests) and shell scripts to do the work7.Investigate the steps of our job

What are obs

CircleCI orbs are shareable packages of configuration elements, including jobs, commands, and executors.

Use orbs to reduce configuration complexity and help you integrate with your software and services stack quickly and easily across many projects.

https://circleci.com/developer/orbs/orb/cypress-io/cypress?version=1.27.0

How to Run Cypress Test case in Circle CI

Pre-condition: GitHub and Circleci mapping already done as per the above steps

Step 1: Install cypress

Step 2:Create .circleci folder in the root level and create a config.yml file (*e.g Given below)

Step 3:Push the code

Step 4: View in Circleci dashboard

cypress/run job started and passed after few second

Test case execution report is attached below

See more blogs on Cypress and other tools under the below link

--

--

KailashPathak

|| Cypress.io Ambassador || https://qaautomationlabs.com/blog || PMI-ACP® |ITIL® || PRINCE2® || Cypress|| Selenium| WebdriverIO |API Automation QATube®