Cypress demo

Cypress example tests for GitHub

An example implementation of Cypress tests with a GitHub workflow that generates a HTML report published on GitHub Pages.

Features

• Grep filtering of test cases by substrings of their names and/or Tags
• GitHub workflow with cron scheduling, Docker images, Artifacts storage, and HTML reporting on GitHub Pages

Local Installation

npm install
npm install --save-dev cypress@12.16.0npm

Command line (CLI) execution examples

Run tests with the web browser (test runner) user interface (for debugging purposes):

npx cypress open

Run tests headlessly:

npx cypress run

Run tests with the substring "check" in the title (passed as an environment variable):

npx cypress run --env grep=check

Run tests with the Tag "@smoke" (passed as an environment variable):

npx cypress run --env grepTags=@smoke

HTML Report generation (2 steps):

npm run report:merge
npm run report:generate

GitHub example workflow

The GitHub example workflow uses a cron schedule to trigger a build on every push and runs at minute 5 past every 3rd hour from 0 through 23.

It uses Docker Hub images with all operating system dependencies and some pre-installed browsers provided by Cypress.

It merges all mochawesome report JSON files into one single JSON file and then generates a HTML report from this merged JSON file. The HTML report then gets published on GitHub Pages (a static web site on GitHub).

All Artifacts get attached as a zip file to the build results (in the "Actions" section of GitHub). Artifacts include the HTML test reports, videos of the test executions, and screenshots of test failures (on failed tests only).

NPM package used

The example implementation uses this NPM package:

• cypress-grep - Enables filtering of test cases by substrings of their names and/or Tags. The filtering can be done via environment variables.