Reviewing a web app

There’s a company here in Colorado that I’ve gotten to know over the past three/four years. They’re pretty successful in their particular market segment (which isn’t software or related to software, as it happens). To help with their success they use a database/web app from a third-party company (I’ll call them Hackjob Software) that essentially just targets this particular company’s market.

The company has just received a new version of this system from Hackjob and are ready to make it go live. They asked me to take a quick look at the outward-facing web app. Let me just say this as an executive summary: it is my considered opinion that this software company is crap. The new version just reeked of the "let's do the minimum we can get away with, our customers have nowhere else to go" attitude.

I am just outraged at the way the web app has been written, how it has been reviewed (if it even was), and how it has been tested. My first bit of investigation was to take a quick look at the HTML for the login page.

The first most obvious warning sign was that it uses a four-year old version of KendoUI (v2017.2):

<link href="/Content/kendo/2017.2.504/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="/Content/kendo/2017.2.504/kendo.office365.min.css" rel="stylesheet" type="text/css" />
<link href="/Content/kendo/2017.2.504/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" />
<link href="/Content/kendo/2017.2.504/kendo.dataviz.mobile.all.min.css" rel="stylesheet" type="text/css" />
<link href="/Content/kendo/2017.2.504/kendo.dataviz.office365.min.css" rel="stylesheet" type="text/css" />
<!-- some other JS files -->
<script src="/Scripts/kendo/2017.2.504/jquery.min.js"></script>
<script src="/Scripts/kendo/2017.2.504/jszip.min.js"></script>
<script src="/Scripts/kendo/2017.2.504/kendo.all.min.js"></script>
<script src="/Scripts/kendo/2017.2.504/kendo.aspnetmvc.min.js"></script>

Yes, OK, it's from one of the competitors of the company I work for, but my point is it's now at least seven versions out of date. I really don't know what has been updated in it in the meantime, but I will bet there have been security fixes. My guess is Hackjob was being cheap and just dropped their subscription (it's supposed to be renewed every year, like we do).

But it doesn’t stop there. Take a quick look back at that code and notice that it loads jQuery from the KendoUI folder. Now let me reveal what is behind the “some other JS files” comment I put in that code. Ready?

<script src="/Scripts/jquery-1.10.2.js"></script>
<script src="/Scripts/bootstrap.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>

Oh yes indeed. This page loads – and I’m really not making this up – three different jQuery scripts. Two minimized, the third not. One from an external server, two from the internal one. To be fully accurate, it is loading versions 1.8.2, 1.10.2, and 1.12.3 (this is the one from the KendoUI folder). Two things here: first, without trying it out in the debugger, I am not really sure which jQuery script will actually be the one used (is it the first loaded? the last? the newest?) and I don’t really care enough to find out; second, all of these are so out-of-date that they are not even maintained/patched any more (the current version of jQuery is 3.6.0). It’s another rabbit hole I don’t particularly want to go down: there certainly have been security fixes from (say) 1.12 to 3.6.

As it happens, that Bootstrap script is out-of-date too (from 2016, natch), v3.3.2. On further examination, I found out that they're using a different version for the Bootstrap CSS, v3.3.7. No, I have no idea why, it's just way beyond sloppy.

Bored with reading HTML, I decided to login when using Firefox's Developer Tools to see what happens. OMG.

•  It tries to load a script called main.js. Not once, mind you, twice. From exactly the same folder. Does not exist, returns 404 Not Found both times. I wonder what that script is supposed to do. Obviously not a lot since no one noticed that it wasn’t even being loaded.
•  It downloads font-awesome.min.css twice, from two different servers. (And yes, they're using an old version: 4.7.0, the current one is 5.15.3.)
•  A couple of images were returning 404 Not Found when the browser tried to load them.
•  It seems that every WOFF file (Web Open Font Format, that is, a font) it tries to download from the company’s server results in a 404 error. It could just be that the app wasn't installed properly on the server and those files are missing? Mind you, when this happened to me with my websites it was because a special entry had to be added to web.config. Any developer worth his salt would have fixed this. Mind you, it seems that the dev noticed that it wasn't working for a couple of the fonts and added a line to download them from the public site maxcdn.bootstrapcdn.com instead. Worth a laugh at least?
•  Talking of Bootstrap above, it seems that the dev left a line in the CSS file that pointed to the code map for it. Except that map file is not present on the server: 404 Not Found again.

At which point, my analysis delved into the look-and-feel of the app itself, which I’d rather not get into here. One point: it was designed as a SPA, but every page you visit is rendered completely afresh. Oh, OK, another point: it was also designed to be responsive, but as you shrink the browser window, suddenly panels overwrite each other.

So, in short, what a complete mess.

Obviously, no one has code-reviewed this web app. No one has taken care to make sure the latest version of various libraries and scripts were being used. No one even ran the app in the Developer Tools and noticed all those 404 errors and fixed them. I’m guessing the basic functionality of the app works (i.e., the storing and retrieving and displaying and analyzing the data without losing anything), but, other than that, it’s just freaking bad.

My viewpoint at the moment, especially with all these various security hacks going on, is this: if you are writing or maintaining a web app you should be making sure you are using the latest versions of your libraries. Once written, you should be monitoring updates and applying them quickly, especially if your users/customers are relying on the app to provide insights, etc, in their business.

  Loading links to posts on similar topics...