Testing a ReactJS calculator with Jest

by React

Calculator ReactJs/Hooks/Typescript/Jest

This Calculator is a modern style app which provides a standard calculator functionality, it is written in ReactJS letting us split UI components, flexible, easy to update and maintain due to its modular structure. As state logic of these calculations and functionalities are quite complex, I decided to use Hooks for a better optimization in performance for component. To make sure errors/bugs are being caught at build time, long before the app goes live we implement the project installing Typescript, and finally unit testing is running thanks to Jest and React Testing Library for UI demonstrate that rendering is successfully done.

SRC Structure…

Dependencies Installed…

  • “@testing-library/jest-dom”: “^5.16.3”,
  • “@testing-library/react”: “^13.0.0”,
  • “@testing-library/user-event”: “^14.0.4”,
  • “@types/jest”: “^27.4.1”,
  • “@types/node”: “^17.0.23”,
  • “@types/react”: “^17.0.43”,
  • “@types/react-dom”: “^17.0.14”,
  • “typescript”: “^4.6.3”

Installation:

  • git clone https://github.com/JoseMMorales/CaculationTest-React-Jest.git
  • cd CaculationTest-React-Jest.git
  • npm install
  • npm start

Author:

Jose MMorales

GitHub

View Github