Running Cypress Tests on Jenkins
Ever since automation was introduced, many benefits have been provided to the Quality Assurance department of every organisation that embraced it. Software testing has come a long way due to the various advantages of automation, such as time saving, early bug catching, etc. With time, various test frameworks have been introduced for different platforms. One such is Cypress, which is used for automation of web applications test cases. Cypress helps QA engineers write test cases faster and in a more reliable way, and it’s also very easy and quick to set up. With its user-friendly framework, Cypress has made automation easier in many ways and requires little configuration before you start writing your tests.
Typically, every project team uses a Continuous Integration tool. Running your tests in CI is important as it helps catch bugs and ensures that changes to the code do not affect the existing features by running automated tests to reduce manual effort. Therefore, it is crucial for test engineers to be familiar with the basics of any CI/CD tool.
This document will provide a brief overview on how to create a basic job to run Cypress tests with Jenkins on your machine. As prerequisites, you must have Jenkins already installed, and be familiar with the structure of the Cypress framework.
The first step is to start Jenkins. On Mac, you can execute the following command on your terminal to do so:
brew services restart jenkins-lts
This will launch Jenkins on the port specified during setup. Login and go to the Jenkins Dashboard and then click Manage Jenkins:
Then, under System Configuration, go to Manage Plugins:
Search for “Node” under Plugin Manager > Available and install the below mentioned plugins. After successful installation, they should appear under the Installed tab:
After this, go back to Manage Jenkins and click Global Tool Configuration:
Here, as you scroll down, you will see a section for NodeJS. Click NodeJS installations to verify:
No changes are needed here. Alternatively, you can specify the version of NodeJS here or mention any command to install any npm packages needed globally.
That’s it, now you can create your first job with Jenkins. Go back to Dashboard, and click New Item:
Enter a name and select the Freestyle project. Alternatively, if you prefer to create a pipeline and use a JenkinsFile, you can do that as well; but for starters we will create a Freestyle project.
Under the General tab, check the box for GitHub if your project is hosted on GitHub, and enter the URL. Skip this part if your project is not on GitHub.
Under Source Code Management, enter your SSH link and add credentials if it is a private repository. Also enter your branch name.
Under Build Triggers, select how and when you want the tests to run. You can add triggers for Pull Requests or you can add a scheduler with the time specified. For details on how to mention the time format, click the ? icon.
Since we installed the plugin for NodeJS, we can see the option for it under Build Environment. This is necessary as our project requires NodeJS to be installed so that we can run npm commands. No need to make any changes here, just check the box as shown:
Next, under the Build section, select ‘Execute Shell’ if using a Mac or Linux machine, or ‘ Execute Windows Batch command’ if using Windows OS. Here, you can mention any commands that you want to run to execute your Cypress Tests.
At this stage, you can save your changes and go to your Dashboard, and you’ll see your newly created item there. Click on the name, then click Build Now.
Once your build has completed, you can check the Console Output
Based on the commands and your tests, you will see the commands executed one by one, followed by your tests. However, you might get a messy output similar to this:
This is not an issue with Cypress, but can still occur due to several reasons. This can be fixed in a number of ways.
1- There could be a problem with Java file encoding. Go to Manage Jenkins > Configure System > and add the following environment variable under Global Properties.
2- Cypress uses ANSI color escape characters to format the output on the console, and Jenkins isn’t configured to read and convert this. This can be solved by installing the following plugin:
3- Simply disable the output of ANSI color control characters by setting the environment variable NO_COLOR. Go to Configure Settings and add it before the test script in the shell command:
After performing any of these three solutions, you can build again and observe the console output. It should be readable now.
Similarly, you can also add post build actions as per the requirement. These actions are performed at the end of the build. These can include closing pull requests, publishing reports, sending emails, sending the generated report with the email, etc. As an example, the post build actions may look as follows depending on the plugins installed. These can be configured if you need to perform any post build actions.
