SonarQube is a server that allows to track coverage statistics, find bugs in your code and more. It is language-agnostic and can be installed on premises, and you can integrate it easily with Buddy.
Set up code and tests with coverage
First, let's create the repository on Buddy. It will be a simple Git repo.
Create a new Buddy repository
Now let's clone it:
Let's quickly set up something testable to have a coverage to upload. We will useas our test command:
Now, let's install some dependencies:
Jest is a test/coverage tool, and Sonar Scanner is a tool that uploads the coverage. Also, we installed Jest types for better code completion as all major IDEs support it.
Now let's make a sample code & test:
Create a filewith the following code:
Create a test file:
Now, if you run the following command:
You will get an output like this:
Also, note that thedirectory has been created in the root of your cloned repo.
Now let's create the Sonar Scanner config file:
Let's add the coverage folder toalong with Node modules:
The next step is adding our files to Git and pushing them to master:
For the sake of simplicity, we will use a local installation of SonarQube using Docker and put it online using Ngrok service. This kind of installation can be easily repeated elsewhere if you have a Docker instance deployed somewhere.
You will see the following output:
If you see no errors it means that the server is up and running.
Once this is done, follow these steps:
Openin your browser
Clickand use as the username and password
Clickin the upper right corner →
Enter the project keyand the project name and click to proceed
Give a name to the token:and click
Copy the created token, it will look like this:, you will need it later
Use it with care, it makes your local installation accessible. It is recommended to change the admin's password at the very least.
Now we can expose the Sonar Server by running this command:
Your console will produce an output like this:
Copy the URL– you will need it later.
Integrate SonarQube with Buddy
Now we're ready to configure a pipeline that will automatically run the tests on every push to the repository.
Buddy will automatically detect the type of files in the repository and label the project with corresponding logos.
Clickto begin. Enter the name of the pipeline, select the branch that you want to test, set it to run on push:
Configure the action
The pipeline is ready, now we need to add some actions to it. Click Node.js from the action roster:
Adding the Node.js action
A modal will launch with configuration details. Addand set up SonarQube credentials in addition to the default scripts :
The action should look like this:
Set up environment
Sonar Scanner needs Java to run, so we will have to use a custom Docker image with both Node.js and Java. To do so, switch the tab toand set the image to and the image version to :
Action environment configuration
You may remove everything from thesection as we won't be needing that.
Set up cache
Sonar Scanner's performance can be improved by enabling the action cache. Switch to thetab and add the following paths to the section.
The tab should look like this:
Set up variables
Now we need to configure the ENV variables needed for the coverage to upload. Switch to thetab and add the following variables:
— the SonarQube token ( 's value ) that you've obtained earlier
— the Ngrok URL that you've obtained earlier
— the URL of your Git repo at Buddy:
— the URL of your Git repo at Buddy:
— the URL to the pipelines section of your Buddy project:
Adding a variable
For security reasons, you should encrypt sensitive data like.
The complete page should look like this:
Buddy variables page
Add npm script
Now let's go back to the code editor and add a few things to make the setup work. In order to upload the coverage, we need to create an npm script. Add the following to your:
With everything in place, we're ready to give the pipeline a test ride. Make a push to the associated branch or click thebutton to initiate the pipeline. A progress bar will appear:
You can click the actions within to take a look at how the execution is going, as well as browse execution logs once it's over:
A proper console output should look like this:
If the pipeline has finished successfully, you can openand then fire up your project. You will see that the coverage has been properly collected:
Sonarqube overview page
You can drill down tostats to see which lines were covered:
Sonarqube coverage page
Thanks for reading and good luck with setting up the pipeline!
Bonus: YAML configuration
If you prefer, you can flick the YAML switch and commit the following asfile to avoid setting everything up in GUI: