Recently I fixed a bug in one of my employer's web applications, that would only sometimes occur, and only when using Internet Explorer 11. It had to do with application behavior that requires JavaScript.

Our mind may race to some obscure JavaScript Internet Explorer facts like the missing URL object constructor or that console.log() will fail if the console is not open. The actual cause was much more mundane.

The URL to the JavaScript relating to this feature was not relative to the root. It was missing the initial forward slash, / . As a result it refers to a file at the same node as the file the reference occurs in. Resources with URLs that do not specify the root will not be loaded if the user visits a subpage directly. An easy mistake to make, but less easy to discover due to the modern web application and browser landscape.

Some modern web applications consist of a single page. This type of application is referred to as a Single Page Application, SPA . All JavaScript is loaded through that one page. Other applications may have a single page where the user lands, the main page of the application. In this situation the main page is likely to load most or all of the JavaScript for the application. In both cases, the JavaScript will load correctly even if the / has been omitted, as the URL for the page will be equal to the web application root.

If we were to use a nested URL directly, without visiting the main page, it would go wrong. The reference to the JavaScript file will be parsed as relative to the nested URL rather than to the root.

In a stand-alone web application this may never be a problem. However, many modern applications integrate with other applications. Software vendors may provide one main application and several other linked applications for added value. Even a small business is likely to use a series of interconnected tools.

Please always use root relative URLs to avoid this type of issue. To make this more easy to do we can stop putting slashes at the start and end of variables, and always put them between the variable names. This practice also makes the code more easy to read because we never have to asks ourselves if the slashes are correct; we see them immediately.

The surprising part is that the failure situation does not occur in other browsers because they retrieve the correct file from the cache even though technically a wrong file is referenced. In my opinion Internet Explorer 11 shows the correct behavior. The other browsers make it impossible to reliably use the same JS file name in nested directories.

Due to the fact that Microsoft product support dates are linked to Operating System support dates , Internet Explorer 11 will be supported until September 2029 in some situations . An example is the Windows 10 Enterprise 2019 Long Term Servicing Channel.