DavidFrahm

Basic examples of scope in a controller... Local variable, $scope variable, each with corresponding functions and unit tests.

DavidFrahm

*** Please note: This Gist is not finished and currently the unit test fails ***

SampleListItemsController

Basic example of doing an AJAX call when the controller is loaded.

The use case for this is any dynamic list page, such as displaying all items for sale in an online store.

** The big deal here is showing multiple ways to structure the Controller with the variables and dependency injection. Some people, like myself, learn by contrast (seeing different ways to achieve the same result). **

DavidFrahm

myApp.config(['$httpProvider', function($httpProvider) {

	/*
	 * This just helps IE 8/9 with CORS. See https://github.com/angular/angular.js/issues/934
	 * Use with care - There are side-effects.  See why jQuery won't use it at http://bugs.jquery.com/ticket/8283
	 */
        // $httpProvider.defaults.useXDomain = true;

        /*
         * The 'X-Requested-With' header indicates AJAX, which is not cross-domain/JSONP,

DavidFrahm

/*
 * HTTP GET actions: Resource.action([parameters], [success], [error])
 * non-GET actions: Resource.action([parameters], postData, [success], [error])
 * 
 * From AngularJS doc: http://docs.angularjs.org/api/ngResource.$resource
 */

/*
 * Direct assignment
 * This works, but during the call it sets variable to object input to $resource

DavidFrahm

/*
 * Create a $resource with a PUT (without a GET first)
 */
angular.module('whateverService', ['ngResource'])
    .factory('Whatever', function($resource) {
		return $resource(getApiDomain() + '/api/whatever/', {}, {
			'update': {
				method: 'PUT',
				isArray: false
			}

DavidFrahm

angular.module('TouchSubmit', [])
.directive('touchSubmit', function () {
    return function (scope, element, attr) {
        log('touchSubmit()');
    	// jQuery version:
        // var textFields = $(element).children('input[type=text]');
        // $(element).submit(function() {
	       //  log('touchSubmit() > form was submitted');
        //     textFields.blur();
        // });

DavidFrahm

When you use $resource within a service, you don't need to impose mocking $httpBackend on your controller. If you want tests for the $resource, those should be in the unit tests for the service.

The controller should only test things directly under its control, which means testing the service directly.

The examples below show how to mock a $resource service factory, in the simplest way I could come up with.

TODO:

• These are real-world examples and it might be helpfule to visitors if I removed all the extra junk that isn't directly related to testing $resource.
• Should this be updated to be a better example of utilizing promises?

DavidFrahm

/*
 * If we assume that the philosophy of a provider is only configuration then it makes more sense in most
 *     cases to test that "it" is configured. As the "it" in this case is the resulting service, using
 *     module to do the configuration and then inject to test that the configuration worked seems to make sense.
 * The trick to understanding these tests is to realize that the function passed to module() does not get called until inject() does it's thing. So assigning to a closure variable in the module initialization function ensures that the Provider is defined before control passes to the injected function. Then you're free to interact with the Provider's configuration interface. The technique is a little bit broken in that the Provider has already provided it's Service. But, if you can tolerate that limitation it works.
 * 
 * Most of this I learned from https://github.com/angular/angular.js/issues/2274
 *
 * There are multiple describe() suites and it() tests, just to help us trace what's going 

DavidFrahm

MyApp.factory('ServerUrls', function ($window) {
    function getCurrentPathname() {
        var pathname = $window.location.pathname;
        var hasUsefulPath = (pathname && pathname !== '/');
        if (hasUsefulPath) {
            return pathname;
        }
    }

    function getCurrentHashFragment() {

DavidFrahm

"use strict";

describe("Jasmine", function () {

    describe("custom matchers", function () {
    
        beforeEach(function () {
            this.addMatchers({
                toBeSomethingBeforeEachInSpec: function (expected) {
                    return this.actual.something === "something";