AngularJS and Express using TDD; HipsterDomains

May 18th 16

I wanted to create an Express app but I did not want to mess with my workflow. Luckily there is MEAN Yeoman generator which works nicely called Angular Fullstack.

HipsterDomains

I always struggle to come up with unique and relevant domain names only to be disappointed when it is not available. There are a number of existing domain searches but I feel that they do not quite meet my needs.

HipsterDomains

Using Node’s DNS library we can perform a quick and rough check of a domain’s availability.

I had already created a Node script to do this but I felt that it could be useful for others.

TDD

Front-end

Client side using Karma as the runner with Jasmine, we can use Angular’s $httpBackend to mock our API and test our promises:

beforeEach inject (_availability_,_$httpBackend_,_$q_,_$rootScope_) ->
    $rootScope = _$rootScope_
    $q = _$q_
    deferred = $q.defer()
    $httpBackend = _$httpBackend_
    $httpBackend.expectGET('/api/test').respond deferred.promise
    availability = _availability_
    availability.check('test').then (data) ->
      result = data
    , (reason) ->
      result = reason

  it 'should return true if domain is available', ->
    deferred.resolve true
    $httpBackend.flush()
    $rootScope.$apply()
    expect(result).toBe true

Server-side

At the back-end we can run Mocha using expect.js for similar assertions. Supertest is used to provide a nice API for testing the server:

describe 'GET /api/:id', ->
  it 'should return true if available', (done) ->
    request(app)
      .get('/api/unlikely12213123')
      .set('Accept', 'application/json')
      .expect(200)
      .end (err,res) ->
        return done err if err
        expect(res.body.availability).to.be.ok()
        done()

Source

Bonus: Growl

Incase you are not already using Growl I cant recommend it enough. It really helps to get into the flow of TDD and saves valuable screen space.

Grow

Setup

  • Install Growl

Windows

Mac

  • Install Growly
npm -g install growly
  • Add to Karma.conf.js
reporters: ['progress','growl'],

Cheat your Backend; Quizington

Next