Getting Started with

About Me

  • From Miami, FL
  • Problem Solver @  
  • Mentored at The Collab Lab
    • Cohort 13
    • Cohort 16
  • Family, Movies, Anime, Sports and CSS

What is End to End Testing?

An end to end test checks whether a application works as expected or not from beginning to end to ensure the application flow behaves as expected

What About Other Testing Tools

Selenium

  • Steep learning curve
  •  No reporting capabilities
  •  WebDrivers - Chrome, Firefox, Safari, Edge, and Opera
  •  PHPUnit

What is Cypress

 

  • End-to-end testing
  • Integration testing
  • Unit testing

Cypress is a Javascript based testing framework.

 

Why Cypress

  • Time Travel
    • snapshots as your tests run
  • Automatic waiting

    • no need waits or sleeps in between commands and assertions

  • Screenshots and videos

  • Network traffic control

  • Real time reloads

  • Cross browser Testing

    • ​Even Edge and Electron

  • Easy to pickup

 

Installing Cypress

npm init

npm install cypress

 

 

 

 

Cypress Console Commands

cy:open

cy:run

Cypress Dashboard

Writing Your First Test

touch /cypress/integration/consumer/login_spec.js

 

Describe - Cypress method for containing one or more related tests. New suite of tests for a functionality should be wrapped in a describe block.

  • 2 arguments:
    • string describing the test
    • callback function for wrapping the actual test

 

Writing Your First Test

It - The actual test block. Write your test logic inside the it block using Cypress commands

  • 2 arguments:
    • string describing out come of test
    • callback function for wrapping the test logic

Writing Your First Test

Reminders:

 

  • Set up the application state.
  • Take an action.
  • Make an assertion about the resulting application state.

Writing Your First Test

Demo Time

Lets Improve It

Cypress Resources

https://www.cypress.io/support

 

https://docs.cypress.io/guides/references/best-practices

 

Cypress Youtube Channel

 

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

 

https://github.com/dolthub/dolthub-cypress

Made with Slides.com