How to Fix Vulnerable Npm Dependencies

Fix vulnerable dependencies using an automation tool

Nuno Brites
Apr 26 · 6 min read
Image by Federico Beccari

Like nearly every programming language, Javascript is not without its vulnerable packages, which may get included in a development team’s project as dependencies using npm. The best defense against vulnerable dependencies in JavaScript is to keep track of them and implement proper controls to reduce exposure.

Every single team faces the challenge of keeping all their dependencies up to date and without vulnerabilities. As the number of dependencies in a single repository or the number of repositories grows, this challenge becomes bigger and harder to manage. If a team needs to manage all the package dependencies manually, it will spend a lot of effort and time constantly ensuring the dependencies are up to date and aren’t making the project vulnerable.

To avoid diverting your developers’ focus and time on tasks that don’t need to be done manually, you can adopt an automation tool to scan all the dependencies and suggest fixes, no matter what platform or language your team uses.

In this article, we’ll look at some JavaScript vulnerabilities and how you can fix them using an automated tool for scanning dependencies.

JavaScript Vulnerabilities

All softwares have vulnerabilities at some point in time, and JavaScript is no exception. Let’s look at some types of vulnerabilities and walk through some examples of actual vulnerabilities found in the Electron library in previous versions.

The Electron framework lets you write cross-platform desktop applications using JavaScript, HTML and CSS. It is based on Node.js and Chromium and is used by the Atom editor and many other apps.

Source: npmjs.com

📝 The following vulnerabilities are currently fixed and are only being used as an example and not with any intention of promoting vulnerability exploitation in any way.

Out of Bounds Write

Out of Bounds Write allows data to be written outside the boundaries of an allocated buffer. If this vulnerability occurs, it can result in corrupted data being processed, the system crashing, or in the execution of malicious code.

One example of this kind of vulnerability has been reported in this pull request and is related to a data race in an audio component. Through this vulnerability, a remote attacker could have created a heap overflow using a crafted HTML page.

This vulnerability was fixed in version v11.4.1 of Electron.

Improper Input Validation

Improper Input Validation allows receiving input but without validating or incorrectly validating it. If this vulnerability occurs, the system can process incorrect/unsafe data.

One example of this kind of vulnerability is being reported in this pull request, where an attacker used a specifically prepared HTML page to expose cross-origin data.

This vulnerability was fixed in version v11.4.1 of Electron.

Improper Access Control

Improper Access Control allows that an unauthorized actor can access a system with unrestricted or incorrect privileges.

One example of this kind of vulnerability has been reported in this pull request. This vulnerability was based on an insufficient policy enforcement flaw found in the networking component of Chromium.

This vulnerability was fixed in version v9.4.0 of Electron.

Now that we have had a look at some vulnerabilities, let’s create a simple repository with a dependency of version 8.4.0 of Electron, which contains the previously mentioned vulnerabilities.

Project and Repository Setup

Let’s start by initializing the project and run the following command from the command line terminal.

npm init

The command line terminal will prompt several questions and, by the end of it, you should have a file named package.json.

With the project ready, the first thing we need to do is add one vulnerable dependency. For this, we will use version 8.4.0 of Electron.

npm install electron@8.4.0

By now, the package.json file should look like this:

{
“name”: “npm-vulnerable-dependencies”,
“version”: “1.0.0”,
“description”: “Update npm vulnerable dependencies with renovate”,
“scripts”: {},
“dependencies”: {
“electron”: “8.4.0”
}
}

Just push those file into the repository, and you’re done.

With the repository in place, let’s scan the dependencies with WhiteSource’s free tool, Renovate. It will automate the project dependencies update, this way we can detect the old dependencies versions and update them to the most recent.

As we keep on developing and growing our project, Renovate will provide us with some features that will come in handy:

  • Continuously run and detect the latest available versions.
  • With each update we do, changelogs and commit histories are extracted and included so we don’t lose track of what changed and why.
  • If we have in place a test suite, it will run the tests on every update to avoid regression errors.

Now that we have a better overview of the tool let’s go on and install it.

Install and Configure Renovate

The next step is to install Renovate’s bot in the version control platform. In this case, I have used GitHub. The installation process is quite straightforward. Just follow the instructions on the GitHub website.

After installing it, a pull request titled “Configure Renovate” will be automatically created, which will help you configure its integration into the repository.

Configuration pull request

This pull request will contain a “Configuration Summary” that describes Renovate’s default behavior and a “What to Expect” section, which shows the plan of the branches that will be created.

‘What to Expect’ section showing future pull requests

To enable Renovate, just go through the initial pull request and merge it.

Let’s see how it works after being enabled.

How does Renovate work?

After you merge the initial pull request, Renovate is enabled and ready to scan the project dependencies. When a dependency needs to be updated, Renovate will do the following actions:

  • Create a separate branch (a different one for each dependency that needs to be updated)
  • Create a pull request for the newly created branch

At this point, it will notify you that a new pull request was open. You can decide if you want to deal with the dependency update by merging the pull request or postpone the update to a later phase. Independent of what you decide, the awareness of the dependency update has been registered in the form of a pull request.

Merged pull requests with the suggested updates

After merging the suggested pull requests, the dependencies will be updated, and the repository will record the applied fixes in the “Pull Request” section.

Renovate job log

On the Renovate app dashboard, you’ll find the corresponding jobs that have been run and have resulted in the branches/PRs we saw earlier.

Wrapping Up

Dependency management is an important part of ensuring that you avoid or mitigate vulnerable dependencies.

The first step is to create awareness about the vulnerabilities and provide a plan to tackle them. Once the plan is in place, it’s just a matter of making the fixes happen based on the severity of the vulnerability.

If you’re currently not taking care of the dependencies on the projects you’re working on, take some time to scan them to get an overview of the status of your project.

Happy coding!

Geek Culture

Proud to geek out.

Sign up for Geek Culture Hits

By Geek Culture

Subscribe to receive top 10 most read stories of Geek Culture — delivered straight into your inbox, once a week. Take a look.

By signing up, you will create a Medium account if you don’t already have one. Review our Privacy Policy for more information about our privacy practices.

Check your inbox
Medium sent you an email at to complete your subscription.

Geek Culture

A new tech publication by Start it up (https://medium.com/swlh).

Nuno Brites

Written by

Software engineer driven by curiosity 🚀 writing about software development and tech ✏️

Geek Culture

A new tech publication by Start it up (https://medium.com/swlh).

Medium is an open platform where 170 million readers come to find insightful and dynamic thinking. Here, expert and undiscovered voices alike dive into the heart of any topic and bring new ideas to the surface. Learn more

Follow the writers, publications, and topics that matter to you, and you’ll see them on your homepage and in your inbox. Explore

If you have a story to tell, knowledge to share, or a perspective to offer — welcome home. It’s easy and free to post your thinking on any topic. Write on Medium

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