Choosing the Right Front End Tools

Rick HerrmannRecently, I had the opportunity to meet with a client that was in the process of deciding on a front-end technology for their dev team to use.  They already did quite a bit of research and formed some opinions about different technologies, and wanted to get our opinion about the way they evaluated their options. One point I made early on in our discussion was that there is no one “right” answer to the question of “which tool(s) should we use?”.   Continue reading “Choosing the Right Front End Tools”

Angular JS Routing Interception and Redirection Failure

Mike BerrymanRecently I had built an Angular JS application that would prompt the user for some information in a popup whenever they tried to navigate to a specific route, before that route’s page actually shows to the user.  If the user provided some invalid data or they cancelled/closed the popup I needed the app to either a) take the user back to the route they were on or b) redirect to the home page of the app if they weren’t coming from a route within the app.

Continue reading “Angular JS Routing Interception and Redirection Failure”

Decorators in TypeScript

3Decorators are an experimental feature of TypeScript and, to an extent, of JavaScript itself. They are a concept borrowed from Python, and a way to modify classes using higher order functionality.

The idea is that you pass the class/function/attribute through a function and the result becomes the class/function/attribute.

As an example, if you make a @final decorator and have the code…

Continue reading “Decorators in TypeScript”

Testing Angular Services

Rick HerrmannUntil recently, the front-end testing I’d done had not directly tested any Angular services. In almost every case, the $http calls in the services were just returning data from an API back to a controller. However, on a recent project I had a scenario where the data from the API had to have some filtering and permission logic applied before passing on the data. This was a case where unit testing the service made sense.

As it turns out, testing a service is very similar to testing a controller in terms of setting up the test, injecting dependencies, and making assertions. The only real difference is the need to mock the $http call in the service. To do this the angular-mocks library provides the $httpBackend tool. Let’s walk through an example of testing a service.

Continue reading “Testing Angular Services”

Mocking Time with sinon.js

Rick HerrmannI was writing some tests for an Angular app and ran into a scenario where I needed a page to behave differently if the time of day was before or after 6AM.  The logic is simple enough to capture in my controller: = moment().subtract(6, 'hours').toDate();

Basically, if it is before 6AM, display the prior day, otherwise display today. However, as I was trying to write a test for this controller the problem came up: how do I take control of the current time to test both scenarios?

Continue reading “Mocking Time with sinon.js”

index.html commit hell

3One of the issues we face when dealing with angular apps is the number of js files that need to be included in the index.html. Especially when you are working on a large project, the number of js files can reach over 100. In order to combat that, and make things easier for developer, tools like wiredep and gulp-inject were created. These tools search the directory structure, and add the js and css files to the index.html.

Continue reading “index.html commit hell”