A newbie’s toe dip into JS based Test automation using Cypress.io

Recently, I have started exploring alternatives to Selenium Webdriver for E2E Web UI automation and the first tool set that I tried my hand at was Cypress

Cypress is a compellingly marketed offering with a touted usp of –

  • Not being a framework based off Selenium
  • Leveraging off existing JavaScript BDD ecosystem ( Mocha and Chai)
  • Promising out of the box reporting,debugging and test recording functionality

Details here –>  https://www.cypress.io/features/

Here is my initial experience report,after spending couple of hours with Cypress .

  1. Got started by viewing Brian Mann’s (creator of Cypress) introductory talk on Cypress and heard out the problems he was trying to solve through Cypress and the architectural decisions that he took and why he took?
  2. Next up I started exploring the documentation – https://docs.cypress.io/guides/overview/why-cypress.html#
  3. Then tried installing Cypress through it’s NPM package but did not have smooth time with the installation failing to initialize the tool and about 30 minutes later it turned out to be a show stopping recently reported issue 
  4. Took the alternate route of their direct download non-NPM based installer and finally after an hour of jiggery-pokery was able to get Cypress up and running

Things were smoother (and very impressive) from here on though

5. The API documentation is informative and using their  tutorial,within 15 minutes I had written a simple BDD-esque test that ….

a) Opened Amazon.com’s sign on page(by querying and clicking an element from the homepage) and assert on the text in the title of the web page

b) Provided me live debugging(including page events) and snap shot capability

c) Provided me post test execution capability to travel back in time to view those snap shots and debug the visual state of the browser at various steps in the test

d)Provided me nicely formatted side-by-side visual logging of my assertion ,test results and page events (including stuff like XHR requests)

All this just by writing the below lines of code ( and without having to worry about including explicit waits 😉 )


describe('First_Cypress_Test',function() {
it("Verifies that the correct title of the Amazon.com's sign in page is displayed",function() {
cy.visit('https://amazon.com')
cy.get("#nav-link-accountList > span.nav-line-2").click()
cy.title().should('eq','Amazon Sign In1')
})
})

view raw

cypress.js

hosted with ❤ by GitHub

Although there are some sobering aspects to Cypress in terms of support only for Chrome and no Appium alternative, but from an initial peak this looks like a very impressive ( and powerful) alternative to Selenium focusing on stability,Tester/Developer efficiency and mature Test/SUT debugging capabilities

With my toe dipping experience being positive, I am firmly motivated now to take a deeper dive into Cypress.io !

 

 

One thought on “A newbie’s toe dip into JS based Test automation using Cypress.io

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s