Running Cypress Tests in GitHub Actions (Part 10)

Cypress with Github Actions

Shalom,

In the previous article of this series Running Cypress Tests in Docker (Part 9) we went through how can you run your tests from the Cypress-TestFramework inside the Docker container, now in this article we will see how can we leverage running these tests automatically in docker using GitHub Actions

Getting Started:

GitHub provides Actions feature option on every repository:

GitHUb Actions buttonin the repo

There are lots of out of the box workflows provided by GitHub Actions

then click on “New Workflow” button and select “set up a workflow yourself”

and you will see the following editor on your screen:

creating a main.yml workflow in your repo

Now replace the content of main.yml with the following configuration details:

name: run-on-docker
on:
  # Triggers the workflow on push or pull request events but only for the develop branch
  push:
    branches: [ develop ]
jobs:
  cypress-run:
    runs-on: ubuntu-latest
    # Docker image with Cypress pre-installed
    # https://github.com/cypress-io/cypress-docker-images/tree/master/included
    container: cypress/included:9.2.0
    steps:
      - uses: actions/checkout@v1
      - run: cd "Part 09" && npm install && npm run cy:test:qa

Explanation of main.yml:

On a Push/every commit to the develop branch of this repo the code will be run in docker container spin up by GitHub Actions using docker image “cypress/included:9.2.0” running ubuntu-latest

Now the steps section use “actions/checkout@v1” which can be safely used, This action checks out your repository under $GITHUB_WORKSPACE, so your workflow can access it.

one can also use “actions/checkout@v2” or “actions/checkout@v3” and then the command cd “Part 09” && npm install && npm run cy:test:qa is run inside the workflow.

Which will first change the context to repo sub-folder “Part 09” and run an “npm install” command to download all done dependencies from the npm registry finally it calls the script using “npm run” which will run the tests in “QA” environment

since one might not use a repo with sub-folders like we have been using you can simply use npm install && npm run cy:test:qa

after adding the main.yml just commit it to the repo which will automatically trigger Github Actions workflow.

Analyzing the results:

after the workflow is run you will see a successful run based on your commit name

then goto successful workflow > cypress-run which will give you a nice summary of all the actions which took place

these actions are as below (more details on which you can get after expanding each individual action):

• Set up job
• Initialize containers

cypress/included:9.2.0 being pulled

• Run actions/checkout@v1

checking out repo

• Run cd “Part 09” && npm install && npm run cy:test:qa

running the “run” command

final result

• Stop containers
• Complete job

Lehitra’ot!

Github Code:

https://github.com/far11ven/Cypress-TestFramework/actions/runs/2044277040

Originally posted on https://kushalbhalaik.xyz