TGIMBA .NET Core Upgrade – Vanilla JavaScript Login View Added

NOTICE: The TGIMBA git hub repository has been corrupted and I had to start over.  The link to the repository is here -> Git  Code Commit

To use any application online, you have to authenticate and The Globe In My Bucket Application (TGIMBA) is no different – we need a login screen. But before that, you need a place to store the evaluation of those credentials. Storage will be done using Hyper Text Markup Language (HTML) 5’s sessionStorage (reference #1).

NOTE: This will likely change in the future because I also want to support other types of authentication such as Facebook and Google.

In this implementation, I will be borrowing from the .NET 4.6.x site’s code base my Session.js structure. The JavaScript looks like this:


  • If you look at my github repository, you might notice JQuery is there. But this is to support a small app I wrote some years back to study Spanish. It is not used in TGIMBA and this is one of the big differences between this and the previous TGIMBA version.
  • I will not be testing sessionStorage being null or undefined as it is part of the HTML 5 spec and should be there. When I first started programming, I checked everywhere for null as well as wrapped everything in try/catch’s. Over time, I have learned that this is usually not a good thing. Over use of try/catch’s can hide errors. You generally only use those if you can recover. If not, you let the application fail with some global error handler. Over checking for null/undefined is also generally not a good thing. A very smart guy I worked with at Quicken Loans had a philosophy of only boundary checking (i.e. in and out of your system). Other locations internally, you assume it is set correctly.
  • I added some basic styling to the login user control.  I will remove this once functionality is done and I start the .css phase.


Logging in:

  • Bad credentials – enter username and password


  • Bad credentials – alert


  • Good credentials – main page (login screen not show)



All Tests:


When I started this post (almost two weeks ago), I had planned on going into a lot of detail on the JavaScript unit tests.  However, while working through the implementation, the ‘unit’ tests some how turned into integration tests.  I got over zealous in attaching files and managed to work my way through the entire JavaScript call chain.  That is until I got to ServerCalls.js.  JSTest.Net does not seem to handle constants (i.e. const) or promises.  Both seem pretty basic to JavaScript and I was surprised by this.  Given this and how difficult it is to debug the unit tests calling multiple files, I will be backing this out moving forward and only using JSTest.Net for unit tests and mock out any dependencies.  Integration tests will come as part of a future Selenium effort.

If not you notice, I ended up mocking out Login_Index() and Login_Cancel().  I plan to do the same with Login_Login() as I add the ability for a user to register in the next blog post.


Stay tuned!



Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s