Simple Unit Testing Using React.js & Jest

https://jestjs.io/es-ES/

When you are starting as a Front-End dev or you are on your way of creating an amazing app, sometimes we forget about testing. We forget about making sure or code works properly, or at least the way we intended to. For that, as dev’s we need to make sure we properly test our code just to be sure we don’t break stuff while creating something awesome, and here we introduce JEST.

“Jest is a delightful JavaScript Testing Framework with a focus on simplicity. It works with projects using: Babel, TypeScript, Node, React, Angular, Vue and more!”

We need to cover some basics first so we can get going and start testing our apps!

• CODE COVERAGE: Generate code coverage by adding the flag — coverage. No additional setup needed. Jest can collect code coverage information from entire projects, including untested files.
• EASY MOCKING: Jest uses a custom resolver for imports in your tests, making it simple to mock any object outside of your test’s scope. You can use mocked imports with the rich Mock Functions API to spy on function calls with readable test syntax.

There are some ways of doing unit testing here with jest, mocking the component or doing it using snapshots (Make tests which keep track of large objects with ease. Snapshots live either alongside your tests, or embedded…