First of all, let´s see what are unit tests?.
Start with this question: How do you ensure the quality of your project?
The goal of unit testing is to isolate each part of the program and show that the individual parts are correct. A unit test provides a strict, written contract that the piece of code must satisfy. As a result, it affords several benefits.
Unit testing finds problems early in the development cycle. This includes both bugs in the programmer's implementation and flaws or missing parts of the specification for the unit. The process of writing a thorough set of tests forces the author to think through inputs, outputs, and error conditions, and thus more crisply define the unit's desired behavior. The cost of finding a bug before coding begins or when the code is first written is considerably lower than the cost of detecting, identifying, and correcting the bug later. Bugs in released code may also cause costly problems for the end-users of the software. Code can be impossible or difficult to unit test if poorly written, thus unit testing can force developers to structure functions and objects in better ways.
Since there is no need to reinvent the wheel, I will take advantage of an existing github action in the
Continuous integration workflows category:
Node.js. With this action I will set up this action in one of my public repositories. I will set up Node.js action for automating my unit test and also integrate with coveralls.io for getting a badge of how much my tests covers relevant lines.
What do I need?
A coveralls account:
This is pretty simple. Just go to https://coveralls.io and create an account using your Github account. This is important, since you will need to grant access to
coveralls.io to your repo. Finally, enable the permission that allows
coveralls.io to acces to your repo like I did. Once the account is created using github, go to the left panel and click on "Add repos".
Click on the switch to enable the access to the desired repo. In my case, I filter the repos to get
Copy the repo token because we will need it for the set up.
Create unit tests
You can take my simple unit tests as a simpe example. Of course, there are more complex unit test when working with react or other libraries.
Create a .coveralls.yml file
Remember we copied a repo token? Well, in our project, we need to create a .yml file that contains just one line:
Set up the github action
Now, in your github repo, go to
Search for Node.js action and click on "Set up this worklow".
Then we need to edit the code to get something like this:
We just need to set the node version. In my case, I'm using node version
After that, we need to set the commands in the last lines, we only need 2:
- npm ci (for installing dependencies)
- npm run test:coveralls (for testing and sending results to coveralls.io). This command was set previously in
Finally, make a commit to save the configuration:
This will save the .yml file in this location:
Commiting will also trigger the job to be executed. Now, every time we push a commit, the job will be triggered, execute the unit tests and send results to coveralls.
Let´s check the result of the action. Let´s go to the actiontab again. In my process, I can see that my code passed all tests and sent result to coveralls. I got a 93% of coverage in relevant lines of code. Also, we can see that job finished successfully.
Now, if you go to you coveralls account in your repo you will se something like this:
Final step: get your badge
And you are done! At this point we created a job for testing our code using github actions.
Now we can get our badge an embeb it on our README.md file.
Embed button and copy the markdown code:
Finally we can add the badge in our readme file, commit, push and we'll get something like this.
Yaml File or Link to Code
The coveralls result can be accessed here.
The coveralls .yml file can be accessed here.
The github action .yml file can be accessed here.
The repo can be accessed here.
With DinamiCSS you can manage CSS style sheets dynamically
DinamiCSS is available as an npm package.
// with npm npm i @dynamicss/dynamicss
- Edit stylesheets at run-time.
- Remove style sheet.
- Check whether a style sheet has already been inserted into the DOM
- Create a DynamicSheet object rpresentation
Usage (basic example)
Here is a quick example to get you started, it's all you need:
Interactive and live demo:
||Object that represents a css style sheet||
||Object that represents a set of css rules for a classname||
DynamiCSS namespace Functions:
||Inserts the stylesheet into the DOM|
||Edits an existing stylesheet in the DOM|
Additional Resources / Info
- Unit test info was taken from wikipedia.
Top comments (0)