Cypress Basic Learning

Vital — Mon, 27 Sep 2021 11:17:38 +0000

What is Cypress
• Cypress is a next generation front end testing tool built for the modern web. We address
the key pain points developers and QA engineers face when testing modern
applications. This enables you to write faster, easier, and more reliable tests.
• Cypress is a JavaScript-based tool for frontend testing.
• With it, you can write all types of tests: End-to-end tests, Integration tests, and Unit
tests.
Fast, easy and reliable testing for anything that runs in a browser.
Cypress Features
• Time travel: Cypress takes snapshots as your tests run
• Debugging: Readable errors and stack traces make debugging easier
• Automatic waiting: Automatically waits for commands and assertions before moving
on
• Spies, stubs, and clocks: Verify and control the behavior of functions, server
responses, or timers
• Network Traffic Control: Control, stub, and test edge cases without involving the
server
• Screenshots and videos: View screenshots taken automatically on failure, or videos of
your entire test suite when run from the CLI
• Cross browser Testing: Run tests within Firefox and Chrome-family browsers
(including Edge and Electron) locally
Pros & Cons
Pros..
• Cypress framework captures snapshots at the time of test execution. This allows QAs or
developers to hover over a specific command in the Command Log to see exactly what
happened at that particular step.
• One doesn’t need to add explicit or implicit wait commands in test scripts, unlike
Selenium. Cypress waits automatically for commands and assertions.
• Auto reload, act as real user
• Uses Mocha as a testing framework & chai is assertion library
• Rich documentation
Cons..
• Only supports Javascript language
• Only supports css selector
• It doesn’t provide support for multi-tabs
• Cypress doesn’t provide support for browsers like Safari at this moment.
Tech Stack
• Cypress
• VS code
• Javascript Programming
• Mocha framework
• Reports: Mocha Awesome
Installation of Cypress
• Download Node.js from https://nodejs.org/en/download/ as per your operating
System, as the Cypress is build on the node.js
• Create a folder and import the folder in Visual Studio code editor (or Atom,sublime) and
open the terminal
• Setup a new npm package : npm init
• Open the terminal and enter npm install cypress --save-dev
• Enter following command to open cypress studio ./node_modules/.bin/cypress open.
• Refer Cypress installation documentation
https://docs.cypress.io/guides/getting-started/installing-cypress#npm-install
Understanding folder structure
• Fixtures: for all the test data information
• Integration: for writing test cases
• Plugins: kind of listeners, customized methods to handle cypress events
• Support: for utility methods, like method, is getting used by many test cases. No need
to import support folder, Cypress will automatically sense the method
• Videos/Screenshots: for running tests

Thanks,
Vital Kumar U
Linkedin

DEV Community: Vital

Cypress Basic Learning