We recently had a WEBDEV project that is being used in an extremely security conscious industry. And they flagged our app because it was using JQuery 3.1.1, which has a few know vulnerabilities. It should be noted these vulnerabilities are low to medium risk and mitigated other ways via server configuration etc., but the client did not wish to use the application as long as there was anything flagged as a vulnerability. So strap in and we will explore how we resolved this.

So the first question you might ask is how do you know if you are running any JavaScript libraries with known vulnerabilities. There are quite a few different tools out there for just such a task, the one I choose to use was Retire.JS which has a Chrome Plug in.

So head over to https://retirejs.github.io/retire.js/ and download the zip file. Once you unzip it, you will see that it has a build_chrome.bat file, as well as a chrome directory. You need to run the .bat file, which sets up the chrome directory with everything it needs.

Next in the Chrome directory you will find a ReadMe.md text file with further instructions.

We have already handled Steps 1 and 2 (in Windows fashion instead of Linux), so now just complete steps 3-5 in chrome. At this point the extension is installed and ready to go, if you visit a website and look at the developer console (Ctrl-Shft-J), it will show you if the site is loading any JavaScript/JQuery Libraries with known vulnerabilities.

That is a bit inconvenient and not as easy to read. The extension actually has a interface that is much more attractive. On the Chrome tool bar there is an icon that looks a bit like a puzzle piece

Clicking on that will show you all of the installed extensions and let you choose which ones show up on the toolbar, by turning on the pin/thumbtack icon.

In the above screen show the icon that looks a bit like a blue earth and a red 3 overlaid on it is Retire JS, and it is indicating that there are 3 issues on the site I am on. Which brings us to out next topic, by no means should you think that this is a PCSOFT / WEBDEV issue. No matter what web environment you are developing in, you will constantly be chasing updates to JavaScript libraries, etc. To prove that point lets take a look at a couple sites you might recognize.

First those 3 issues in the above screen shot? If you click on the icon you will get a popup with what the issues are (see below). Wow that looks pretty serious, what site could possibly be that bad? Well that happens to be WordPress.com, that I am using to write this blog post. I am going to go out on a limb and bet they are a larger QA budget than you or me but as you can see they still are not using the latest libraries.

Let’s take a look at a couple of others.

I hope I have made the case that this isn’t a WEBDEV issue painfully clear, even the folks at Jquery.com can’t keep on top of it!!!

I will climb down off the soapbox and continue on now, lets take a look at your favorite WEBDEV site (www.windev-us.com). That is your favorite, site right?

So our JQuery has a few vulnerabilities. They are not really that serious. XSS is prevented with server configuration as I have written about before. And it appears the other issue only has to do with CMS products like Drupal. Our other libraries that it recognized it doesn’t have issues with so all we need is to update the JQuery library. But how do we do that?

I spoke to PCSOFT about this and I have been told that the next release will have an updated JQuery library, but of course that doesn’t help us much right now. So how to proceed? We could manually update it on the server, but then every time we publish it would get overridden and we could have to update it again.

Notice it is in the /res directory, we can find that directory under our project _WEB directory. Its under the US directory in that particular site because it is an AWP site, but for WEBDEV session sites it will be under the _WEB folder. We could replace the jquery-3.js file there, and when we publish it would go up to the server. But that still not a great solution, as soon as we recompile / regenerate HTML in our project, the file would get updates with the version from WEBDEV.

The correct place to replace the file is in the Programs/Resource directory of the IDE. Note I am using v25, and I have all 3 products installed as integrated in to WINDEV, so the directory is under my WINDEV 25 folder.

So now we know where to update the file, and you should be able to guess where to get the latest JQuery.com, at the time of this writing that was v3.5.1. Just click that giant button.

Which takes you to a second page, where you can download the compressed production version

This may download the file as you would expect. But it also might just display it in chrome if your system is setup similar to mine, if it does just do a File Save As. It wants to name it with the full version info included (jquery-3.5.1.min.js), but of course our standard WEBDEV code is going to refer to it as jquery-3.js. So at some point you will need to rename it to that.

What I choose to do was rename the original file, and then rename the new one and copy it into the directory.

I kept the original from PCSOFT just incase I run into any unintended consequences. It should be noted that I have done some rudimentary testing but this hasn’t been heavily tested yet. And as we all know updating versions of libraries are not suppose to break things but reality is generally a little more disappointing than marketing.

Now that we have updated the library all we need to do is open the project and recompile and generate the HTML, at which point the file in the local _WEB/res directory will be updated

Then publish the site. After which when we visit the site we see we are no longer being flagged for library issues!!! The client can start using the app, and we can get paid, always a red letter day!!

As mentioned above there can always be unintended consequences when updating libraries, so if you go through this process, which I would only recommend if you are in a situation like we were, be sure to extensively test your UI, and keep the original file, just in case!

• WEBDEV