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:

vm.date = 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”

Angular.js – Testing Directives

Rick HerrmannOne of the features of Angular is that it was built with testability in mind.  The separation of the DOM layer, controllers, and services, as well as the use of dependency injection make it relatively easy to develop testable code.

I am very familiar with the practice of writing unit tests and have been testing C# code for several years.  Although I did find testing in Angular to be a little confusing at first, once I got used to the code required to set-up the tests – it was pretty easy.

Continue reading “Angular.js – Testing Directives”

Learning Angular.js

misc4_bgOver the past few months I have been working with Angular a lot.  I had no previous knowledge of Angular before this.  The Pluralsight course that helped me out the most was AngularJS: Get Started by Scott Allen.  It was very easy to follow along.  Scott was very good at explaining what he was doing.

One other resource that I found was very helpful was a walkthrough on scotchio.  This was good to go through after watching the training video.  This walkthrough actually showed how to set up a simple project.  It didn’t have as much explanation involved but it was a good walkthrough of exactly how to get a sample project set up and was a good starting point for creating a project to play around with.

Continue reading “Learning Angular.js”

Angular.js 2.0 Reactions

Mike BerrymanHave you heard the news? Angular 2.0 is on it’s way, and it’s really shaking things up. Not only is 2.0 going to be a complete departure from Angular 1.3, they’re discontinuing 1.3 within 24 months of the 2.0 release, and there will be no upgrade path from 1.3 to 2.0. The community is having some very strong reactions – from absolute condemnation to praise for such a  bold move. I’ve included some of my favorite reactions below:

Continue reading “Angular.js 2.0 Reactions”