devcshort / react-hls

Simple React component for playing hls/rtmp live streams.
https://www.npmjs.com/package/react-hls-player
MIT License
120 stars 48 forks source link

Add Unit Testing #6

Open devcshort opened 4 years ago

devcshort commented 4 years ago

This repo needs to have proper testing put in place to ensure the stability of future releases.

aortiz24 commented 4 years ago

This would be my first Hacktoberfest issue! I'll look into React Unit Testing if you'll assign me the issue.

devcshort commented 4 years ago

That would be great @aortiz24 ! 🙂

aortiz24 commented 4 years ago

Jest and Enzyme seem to be the go-to tools for React Unit Testing. Jest will help do all assertions and enzyme will help render React components in testing mode.

The link below explains the two tools and gives example code. https://itnext.io/how-to-unit-test-in-react-72e911e2b8d

@devcshort, what are your specific goals regarding the unit testing issue? I am new to unit testing :)

devcshort commented 4 years ago

@aortiz24 I'm actually new to unit testing as well. Ideally, I'd like to have automated testing of the react-hls-player component with several different scenarios. I don't want to accidentally push changes that break the entire package when deployed. At some point once CI/CD is set up, would like to have the tests run and then automatically deploy the package.

aortiz24 commented 4 years ago

@devcshort, if you create another issue for CI/CD setup and assign me to that issue. I'll help with CI/CD setup. I've found a medium article that guides through the process: https://medium.com/bettercode/how-to-build-a-modern-ci-cd-pipeline-5faa01891a5b

devcshort commented 4 years ago

@aortiz24 unfortunately I have someone assigned to CI/CD already :(

aortiz24 commented 4 years ago

I'm going to do some more investigating! @devcshort, What would those different scenarios be in regards to the automated testing of the react-hls-player component? It will help me in my research :)

aortiz24 commented 4 years ago

Hey @devcshort , I have confirmed from multiple sources that Jest and Enzyme are the go-to tools for React Unit Testing! Cypress is used for everything else :)

devcshort commented 4 years ago

Hi @aortiz24 sorry for not getting back to you sooner, was a busy day yesterday evening! Yes, I believe Jest and Enzyme would be the best and easiest to use for now. May look in to Cypress at a later point.

aortiz24 commented 4 years ago

No worries @devcshort! I did some more research and found that Jest alone can do the unit testing. This is a short & sweet 12 minute breakdown (11:07 - 23:09) of unit testing here: https://www.youtube.com/watch?v=r9HdJ8P6GQI The video is for people who are new to unit testing!

aortiz24 commented 4 years ago

Do you have a util.js? If not, I can make one with your guidance on what you would like unit tested.

Would you like me to make a util.test.js?

devcshort commented 4 years ago

I don't currently have one, if you'd like to make one, that'd be great :)

aortiz24 commented 4 years ago

Okay, sounds good.

Could you share with me your util.js file where you have written the functions you want unit tested.

Based on that util.js file, I can write the util.test.js file.

devcshort commented 4 years ago

I don't have a util.js file. I believe the only thing we need to test is the main video component to make sure it renders using commonly used props.

aortiz24 commented 4 years ago

Hey @devcshort, I've learned a lot by trying to work on this issue, but I can no longer devote the time to it. Best of luck!

osmarpetry commented 4 years ago

Anyone already is on this task? If yes, let talk about @testing-library? If not, I will try something with it

devcshort commented 4 years ago

@osmarpetry the last person wasn't able to continue on this, but if you'd like to give it a try then that'd be great. I'm not familiar with testing so if you have any ideas, I'm all ears

gnatal commented 2 years ago

Hi I found out a fix can I do a PR ??

cgilly2fast commented 2 months ago

I have add testing suite to this fork of the project https://github.com/cgilly2fast/react-hls, if you would like me to PR I am happy to do so.