Handling Cypress unit testing with React TypeScript ( Part I )
Introduction unit testing and examples
What is unit testing
Unit testing is a process to reproduce your code behavior by an automated script in order to ensure the quality of the block. In our case, React is our library. that’s why components are the essential target for unit testing. The test process will be composed of three:
- Describe your method
- Predict your result or what your method should return
- TRY it and compare your EXPECTATION vs the REALITY ( result )
It’s the same logic with our React components. However, we will need some tools to ensure the unit testing. There are several libraries that cover these functionalities.
- Jest JS
- Grung JS
What is Cypress
Cypress is a new modern end-to-end testing framework. In fact, it is fast, easy, and reliable testing for anything that runs in a browser. We address the key pain points developers and QA engineers face when testing modern applications. We make it possible to: Set up tests.
The benefit of testing with Cypress
The features that define Cypress one of the quickly adaptable choices for Web automation. Here is some point :
- It delivers fast, consistent, and reliable test execution due to its architectural structure.
- Handling async / await — Cypress automatically waits for commands and assertions before moving on.
- Ability to test edge test cases by mocking the server response. (Network Requests)
- Debugging — It takes snapshots as your tests run. Navigating in the Command Log to accurately each step.
- View videos of the execution of your entire tests when running from the Cypress Dashboard.
So it revolutionary tool that changes the ways of testing
Cypress hooks
As we are tending to use Hooks, cypress offers several hooks:
- Before()
- After()
- BeforeEach()
- AfterEach()
Example with steps
1. Setting up
Let’s suppose you have ready React Boilerplate or App, here is the first steps
npm i -D cypress cypress-react-unit-test Cypress Structure
To Recap
Let me recap, in this article we went through the advantages of testing and more specifically testing End-to-End with Cypress. I hope enjoyed reading my writing. We will dive into more details in the next Medium review
This has been developed by myself at eDonec .
