DEV Community

CDPhu
CDPhu

Posted on

1

Javascript Testing

This week we are going to have Lab 8 and along with the lab
it is also introducing a new tool to our SSG project. In lab 8, we are going to add testing functions for several functions that we have in our SSG. I somewhat have experience with this because one of my other course CCP555 has a lot of testing involved. The testing framework that was used in the program was Jest.

Procedure

After watching the videos and reading through the lab instruction. I just chose the testing framework that I'm going to use in this Lab 8, which is Jest. And then I just install the Jest to my program by using the command npm install jest. I updated the "test" command in the package.json file in order for it to run correctly.

I then extracted the htmlGen function and placed is into its own file that being htmlGen.js, and modified my-button.js to import htmlGen as an external function.

I then started coding the testing functions. At first all I coded was the html good value functions. So I set up a total of 7 tests where for htmlGen():

  • test would generate a html result with a string html argument
  • test where it generates a html result with a string html argument
  • test the htmlGen() function with bad or empty value types (lang, title, html, string, footer)

In CCP555, I have already learned about coverage using npm run coverage. But what was new was setting it up so that coverage would print out a report.

Thought

There were several things I was already aware of since I have done some of this in previous labs in a different course. Though what was new to me was the capability of being able to print coverage
files into a report. I will probably make more use of this on different projects.

NOTE: I didn't squash it correctly therefor having several commits.

Test Function
htmlGen file
Adding Jest
Updatting my-button.js
Coverage Files

Sentry blog image

How I fixed 20 seconds of lag for every user in just 20 minutes.

Our AI agent was running 10-20 seconds slower than it should, impacting both our own developers and our early adopters. See how I used Sentry Profiling to fix it in record time.

Read more

Top comments (0)

Qodo Takeover

Introducing Qodo Gen 1.0: Transform Your Workflow with Agentic AI

Rather than just generating snippets, our agents understand your entire project context, can make decisions, use tools, and carry out tasks autonomously.

Read full post

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay