Posts tagged with 'JavaScript'

Mock out Google Maps Geocoder with Jasmine Spies

The Google Maps Geocoder is a handy utility that lets you do this: var geocoder = new google.maps.Geocoder(); geocoder.geocode( { address: '1600 Amphitheatre Parkway, Mountain View, CA 94043' }, function (results) { // address results of Google HQ }, ); When writing unit tests though, we don't really want…

Use Script Blackboxing to Skip Third Party Libraries When Debugging JavaScript in Chrome

Sometimes you'll be debugging some click handler in your code, happily stepping through, only to find yourself suddenly lost in the middle of JQuery’s minified code. From there, it can be a struggle to step back out and resume debugging at the entry point to the library. Wouldn't it be great if we could just skip past…

Published

Mocking Angular’s $http Promise return type using only Mocks

Last week, we had a look at Mocking Angular’s $http Promise return type using the $q library. This gives you a great deal of control over when your mock promises are resolved. But, it comes at the cost of requiring both the $q library and manually calling $rootscope.$apply(). If you want to avoid those (and you don't…

Mocking Angular’s $http Promise return type

The Angular $http service provides an easy way to interact with an API endpoint. If you want to query some data, you can simply do this: var request = $http.get('/api/items'); request.success(function (data) { console.log('I have data', data); }); The request object above is an Angular HTTP promise (ng.IHttpPromise…

Create a Grunt meta-runner in TeamCity

As much as all the cool kids are now using Gulp, I'm still using Grunt for a few few automated tasks. In our current project, we're using it to compress all of our JS in the project, run the Jasmine tests through Karma, and generate test code coverage reports. As well as doing this locally, we need to be able to…

Published

Writing Cleaner AngularJS with TypeScript and ControllerAs

Our team made the move to TypeScript and Angular at the tail end of last year. I'd had a look at Angular a year or so ago but struggled to get my head around the excessive usage of $scope and the nesting of $parent items that needed to be traversed. Since then (with version 1.2.0), Angular now supports Controller As…

Inject CSS From Your RequireJS Module Into The Main App

We’ve been doing some work on a data display app that serves as a framework for a bunch of modules. We picked RequireJS to create the app due to its modular structure and used it with a Node.js backend to build a small app that we can now create child data modules for. Each child module needs to be fully responsible…

Published

So You’re a Professional Web Developer Are you?

Over the past few months, I’ve been helping out with recruitment for one of our offices by putting together a coding test and then marking the results. It’s been eye-opening. Also part soul destroying and tear inducing. At one point I stopped to look for the hidden camera, expecting a ghostly Jeremy Beadle to appear…

Use Karma and Grunt to Run Your Jasmine Tests in Real-Time

As JavaScript applications become more common and more complex, the need for good unit test coverage also increases. Hopefully you’re already writing tests. If not, why not? When I’m doing TDD with C#, I use NCrunch to monitor all tests within the Visual Studio Solution and run them as they change. This saves me…

Post an array of objects to WebAPI using jQuery

This is quite niche but caught me out the other day. Let’s say you have a person entity: public class Person { public int Id { get; set; } public string Name { get; set; } public int Age { get; set; } } and you have a WebAPI method that takes in a group: public class UsersController : ApiController { …

Published

Completely disable cache in Google Chrome

I like debugging JavaScript in Chrome. The console is pretty excellent for stepping through code, logging, checking for bounds events etc. The one issue that I kept running into was that of caching. As I was making changes to my JS file, I found myself having to go through a couple of menu settings every time I wanted…

Published

Use Ant and Closure Compiler to compress every JavaScript file in a project if you have lots of files

In a previous post, I set out how to use an Ant script to run every JavaScript file in a project through the Closure compiler. For the most part, this has been working fine for me. Then I ran it against a project with some 50-odd JavaScript files and it started to throw PermGen OutOfMemoryError errors. So, it needed…

Getting Started With Node.js Part 1: A Quick App

Node.js is a server platform built on Google Chrome’s JavaScript runtime. It has an event-driven, non-blocking I/O model so it’s a fast and efficient as you could want. It’s also probably a good glimpse into the future of server technology. With the server running pure JavaScript, it’s a great plaform for development…

Published

Simple JavaScript Method Chaining

Method chaining is a way to return an object from a method call that allows for further methods to be called. It’s easier to see than to describe. Instead of this: var people = helper.getPeople(); var bob = people.find('bob'); var email = bob.getEmail(); You could do this: var email =…

Published

Use Ant and Closure Compiler to compress every JavaScript file in a project

There’s an updated version of this script in this blog post. At work, we use TeamCity to automatically build and deploy to dev projects as we check in changes. One thing that’s always been a bit of a nuisance is dealing with the compression of JavaScript files that we've written for the projects. Developing locally,…

Starting to write JavaScript that doesn't suck

A couple of people I've spoken to in the past few days have made comments about how much they hate JavaScript and how bad it is as a programming language. I'd agree that this is true for the code that people new to the language can sometimes create. Take this wrapper for the Google Maps API: var map; function…

Published