Probably, the better title would be: where have I been all of Cypress.io‘s life? Now on version 5.1.0 as of this writing with more than 200 releases showing on GitHub, it’s projects like Cypress that make me wonder what rock I’ve been living under when it comes to exploring website dev testing platforms.
I had it installed and running tests on my simple resume website in about 10 minutes. Obviously, a comprehensive web app would take longer and, of course, require more comprehensive testing than a 10 minute run through. Still, Cypress provides an easy to implement testing platform that’s a great fit for a broad spectrum of web development. There are shortcomings, but the majority of web development (especially SPA) isn’t going to fall into those categories.
Setup in a project, is super simple:
npm I cypress --save-dev
node_modules/.bin/cypress openThe above gets you started with a solid set of example scripts. Cypress has a boatload more examples to play around with.
For my example, I have concurrently installed and just added the following script:
"dev-cy": "concurrently \"next\" \"node_modules/.bin/cypress open\""
I made some basic tests on a resume website that I built for myself and ran through a series of viewports. Then, with a viewport selected, you can actually run through each of the tests and see the test elements on the specific viewport. Here it is in action…
Feed My Blog 