As a frontend developer aiming to prioritize an exceptional user experience, ensuring the web app's UI alignment with the Figma file stands as a crucial initial step, followed by validating functionalities. Amidst a busy workload encompassing updates and new feature additions, manually testing each feature might not guarantee accurate results regarding their performance and expected behavior.
This is where writing testing becomes very useful.
There are a million and one reasons to write tests but my convincing reasons are :
Tests ensure code functions as intended, enhancing the overall quality of the product.
They act as a safety net, maintaining code reliability during changes or updates.
They serve as living documentation, aiding in understanding different parts of the codebase.
While initially time-consuming, tests save time by reducing manual testing needs in the long run
These four points summarize the essence. That said, there is an abundance of testing libraries, including Cypress, Selenium, Jest, Mocha, Puppeteer, and others. Yet, in my view, the two most popular ones are Cypress and Jest
I choose Cypress because of its numerous advantages, including the ability to facilitate E2E testing, real-time debugging, and its remarkable versatility in seamlessly integrating with modern frontend frameworks like React, Angular, and Vue.js.
For further information, I recommend referring to the Cypress documentation
https://docs.cypress.io/guides/getting-started/opening-the-app
Installation:
Considering Cypress's compatibility with numerous frameworks, as a Next.js developer, I referred to the Next documentation on Cypress and followed their guided instructions. Additionally, you'll find other suggestions there to further explore and learn more about Cypress.
https://nextjs.org/docs/pages/building-your-application/testing/cypress
In a nutshell, Cypress isn’t just a testing tool; it's a game-changer in how we build and test web creations. From end-to-end testing to dissecting the tiniest components, Cypress simplifies it all.