madhawar / crvcodecy

Cypress Test Suite

I've created this Cypress test automation project after work hours during COVID-19 lockdown. My goal was to reduce the amount of time I spend for repetitive testing occurs during a sprint, and as well as bug verification.

We already have a Robot Framework test automation suite at the company but it doesn't yet cover the CRs I'm working on. Therefore, for my personal use, I wanted something quick, easy. I've tried Cypress before for few hours and had an overall idea about it.

With that, I was able to write a very bad, structured code that executes sequentially and with hardcoded values in few hours. Now I'm improving this test suite with page object like patterns, storing data elsewhere. Hope this helps for someone who learns Cypress.

Installation

Installing Cypress

https://docs.cypress.io/guides/getting-started/installing-cypress.html#npm-install

Current version: 7.x.x

Usage

Visual Studio Code alone is enough to get started. I use following combination of software tools.

1. Node.js https://nodejs.org
2. Windows Terminal: https://www.microsoft.com/en-us/p/windows-terminal/9n0dx20hk701
3. Git https://git-scm.com
4. Visual Studio Code: https://code.visualstudio.com

I use these extensions on VSCode. These are optional.

1. Visual Studio IntelliCode https://marketplace.visualstudio.com/items?itemName=VisualStudioExptTeam.vscodeintellicode
2. JavaScript and TypeScript Nightly https://marketplace.visualstudio.com/items?itemName=ms-vscode.vscode-typescript-next
3. GitHub Pull Requests and Issues https://marketplace.visualstudio.com/items?itemName=GitHub.vscode-pull-request-github
4. One Dark Pro https://marketplace.visualstudio.com/items?itemName=zhuangtongfa.Material-theme
5. vscode-icons https://marketplace.visualstudio.com/items?itemName=vscode-icons-team.vscode-icons

Because I don't want screenshots and video recordings when tests fail, I've added this on support > index.js

Cypress.Screenshot.defaults({
    screenshotOnRunFailure: false
  })

...and on cypress.json

"video": false,
"screenshotOnRunFailure": false

Learning

I found Cypress documentation very helpful, as well as the usual Stack Overflow. Folks at Cypress even have a real-world app for you to test.

https://github.com/cypress-io/cypress-realworld-app

Don't forget to check Cypress blog and these recipes when you're coding.

https://github.com/cypress-io/cypress-example-recipes

You can always Google, nevertheless for a start I suggest following YouTube channels to get started swiftly.

1. Cypress YouTube channel: https://www.youtube.com/channel/UC-EOsTo2l2x39e4JmSaWNRQ/videos
2. Cypress Web Automation: https://www.youtube.com/watch?v=yM38NmF-LC4&list=PLUDwpEzHYYLu4jKg-rNSKH3aJeBinlPXp

Disclaimer