Hexastack / eazychart

EazyChart is a reactive chart library 📈, it allows you to easily add SVG charts in your React and Vue web applications.
https://eazychart.com
MIT License
23 stars 14 forks source link

🤔 [ISSUE] - @eazychart-[react & vue] - Add missing unit tests for the Area component #76

Closed IlyesBenAmara closed 2 years ago

IlyesBenAmara commented 2 years ago

Description

Description

It seems that we are missing the unit tests for the Area component. This should be eazy cause it's similar to the LinePath component unit tests. We need to do this for React and Vue.

React : For : packages/ez-react/src/components/Area.tsx We need to create : packages/ez-react/tests/unit/components/Area.spec.tsx

Vue : For : packages/ez-vue/src/components/Area.tsx We need to create : packages/ez-vue/tests/unit/components/Area.spec.tsx

swayamterode commented 2 years ago

@IlyesBenAmara can you explain what exactly here we can do, as I am beginner to Open source :)

IlyesBenAmara commented 2 years ago

Hello @swayamterode, in summary, you will have to add a unit test for a shape component named Area (you will find it packages/ez-react/src/components/shapes/Area.tsx and packages/ez-vue/src/components/shapes/Area.tsx). To do so, you will need to go through these steps:

  1. check the Area.tsx file that you will find packages/ez-react/src/components/shpes/Area.tsx, learn about that component and it's props.
  2. create a file called Area.spec.tsx under packages/ez-react/tests/unit/components/shapes/Area.spec.tsx.
  3. check the LinePath.spec.tsx under packages/ez-react/tests/unit/components/shapes/LinePath.spec.tsx. That file contains a unit tests similar to those that you need to add for the Area shape.
  4. go through the same steps for the Vue (if you first created the unit tests for React and vice versa).
  5. when you finish adding the unit tests for both React and Vue, navigate to one of the packages (React or Vue) and run yarn test -u. This will generate the snap file that is needed to test the other package. For example, if you wrote that command under the React package (packages/ez-react), it will create a snap, navigate to the other package (packages/ez-vue) run yarn test. If the tests go through, that means that both Vue and React generate a similar SVG for the Area shape.

I hope this is clear enough for you, let me know if you want me to assign this issue to you. Good luck and Happy hacking :technologist: :cat:

deathsh0ot commented 2 years ago

Can you assign this to me?

IlyesBenAmara commented 2 years ago

@deathsh0ot here you go. Good luck, and happy hacking :technologist: :cat: