2. cd to cypress-example folder and run npm install

✔️ Run tests

• If you installed Cypress via npm:

  • cypress test runner (cypress open):

    • npm run cy:open:web OR cypress open --env device=web (change web to mob to switch to mobile view)

  • cypress headless mode (cypress run):

    • npm run cy:run:web OR cypress run --env device=web
• If you installed Cypress zip:
  • import cypress-example folder and you are good to go

💡 Information

ℹ️ Feel free to delete .circleCI folder and Jenkinsfile from your machine. (These files are for CI to run tests automatically once a week)

🧪 Tests

📁 Tests are located in cypress/e2e folder

📁 Custom commands are located in cypress/support folder (.cmd.js suffix)

📁 Selectors (CSS selectors) are located in cypress/selectors folder [only difference from cypress default project structure] - not using page object model(POM) design pattern but keeping selectors (only selectors) separately Read more

Stress test

NOTE: this portion is dependant on having the following library installed: cypress-utils This is available here: https://github.com/trentrand/cypress-utils.git

To ensure your Cypress tests are not irregularly failing with false-negatives, stress testing new test files can be a reliable way of filtering out bad test code.

To stress test one or more test files, simply specify the files to run:

  cypress-utils stress-test specFileA specfileB

Additional command-line options may be specified, such as the sample size or number of concurrent threads:

 cypress-utils stress-test --trialCount 12 --threads 4

See more command-line options with cypress-utils stress-test --help

🛠️ Configuration

Config files:

1. cypress.config.js - Main config file where default behavior of Cypress can be modified. More info
2. plugins/index.js - Plugins file is where we can programmatically alter the resolved configuration More info

This test suite is supporting multiple viewports (mobile and desktop). See plugins/index.js file

One solution is to use cy.viewport() command inside the test, to change the viewports, but very often websites also check user agent to get the device information(and show the mobile view). Since user agent is something we can't change in the middle of the test, we need to pass config value when launching tests. In cypress.config.js we have a device parameter and in plugins file index.js, we decide viewports and user agent parameter values based on that device value.