Seeing the Importance of Testing

Image credit: https://edge.siriuscom.com/digital/continuous-integration-and-continuous-delivery-beyond-the-conveyor-belt-mentality
Disclaimer: I'm an engineer at Fave, but the content of this post is not related to Fave, it is a side project that I am working on.

Having gone through setting up CI/CD for my small project, I realized that TDD is a pretty cool thing to have and it helps to automate stuff and also gives confidence not just to the coder but also to the reviewer.

The lead up to this blog can be found on the following blogs:

I had implemented Jest and Enzyme to set up the tests. Now, as a developer, I am interested in knowing more about testing. The company which I work for, Fave (We are hiring, link at the end of this post), focuses a lot of TDD and I see where and why is it needed.

So obviously I had to go with the most popular option, Jest paired with Enzyme. I still don’t have any idea why did I go with that. But hey, after a damn long setup, which can be found in the above links provided.

Got the CI to work

GOSH DARN AWESOME! 😱

I was thrilled until I refactored my code right now, and ran into this bad boy.

So apparently Jest can’t deal with importing images.

When you import image files, Jest tries to interpret the binary codes of the images as .js, hence runs into errors.

Did some research, found out that there is something called moduleNameMapper, that needs to be configured for things to work out.

It looks like too much work… NETFLIX BREAK!

*2 episodes later*

Alright! Let’s do this!

As I already had a `jest.config.json` for setting up polyfills for tests and also to set up the Enzyme adapter (I don’t know why, but it wasn’t working otherwise).

All I had to do was add:

“moduleNameMapper”: {
“\\.(jpg|ico|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$”: “<rootDir>/__mocks__/fileMock.js”,
“\\.(css|less)$”: “<rootDir>/mocks/fileMock.js”
}

Now comes to mocking the files. Created them with a simple
`exports default ‘’;`…

“moduleNameMapper”: {
“\\.(jpg|ico|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$”: “<rootDir>/__mocks__/fileMock.js”,
“\\.(css|scss)$”: “<rootDir>//__mocks__/fileMock.js”
}

Freakin forgot to add SCSS… Alright, let’s try it again.

The feeling right here is why I choose to be a developer!

Now since everything works out and the branch passes all the unit tests, I can confidently deploy this code knowing it won’t fail in production (most of the time).

You can check out my itsy bitsy open-source org at https://github.com/WrippleFoss/
I am trying to build an open-source platform for something 😉 secret.
You can also join the discord channel using this [link](https://discord.gg/7TahF4D).

Fave is hiring, apply to https://careers.myfave.com/

Until next time…

You can also check out the original blog post at:

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Abhishek Prasad

Abhishek Prasad

Full-stack software engineer @carsomeMY , newbie lifter, still trying to figure things out and sow things to reap