title: angular karma jasmine unit test for a controller
body: <p>I am adding a userController module to my SPA project with Jasmine on Karma.  I got an error saying "Error: [$injector:modulerr] Failed to instantiate module myApp.controllers due to: Error: [$injector:nomod] Module 'myApp.controllers' is not available!". The app works fine. It just the unit test doesn't see the controller module for some reason.  Thanks for your help.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>/// &lt;reference path="~/scripts/_references.js" /&gt;
  /// &lt;reference path="~/scripts/controllers/userController.js" /&gt;
  
  'use strict';
  
  describe('Controllers: userCtrl', function() {
        var scope, ctrl;
  
        beforeEach(function() {
          module('myApp.controllers');
        });
  
        beforeEach(inject(function($rootScope, $controller) {
          scope = $rootScope.$new();
          ctrl = $controller('userCtrl', {
            $scope: scope
          });
        }));
  
        it("Should be false", function() {
          expect(false).toBeFalsy();
        });
      }</code></pre>
  </div>
  </div>
  </p>
  
  <p>The mainController.js contains only two lines with ['myApp.factories'] as dependency in the module declaration like this:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>'use strict';
  
  angular.module('myApp.controllers', ['myApp.factories']);</code></pre>
  </div>
  </div>
  </p>
  
  <p>The actual controllers are in their own .js files, and have angular.module('myApp.controllers') without [ ] in the declaration. The userController.js is like this:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>'use strict';
  
  angular.module('myApp.controllers')
    .controller('userCtrl', ['$scope', '$location', '$window', 'version',
      function ($scope, $location, $window, version)
      {
        $scope.$root.title = 'AngularJS SPA | User';
        $scope.appVersion = version;
        $scope.title = 'User';
        $scope.content = "my contents goes here";
      }]);</code></pre>
  </div>
  </div>
  </p>
  
  <p>In karma.conf.js, I have the following in the files: property.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>files: [
            'bower_components/angular/angular.js',
            'bower_components/angular-ui-router/release/angular-ui-router.js',
            'bower_components/angular-mocks/angular-mocks.js',
            'bower_components/angular-resource/angular-resource.js',
            'bower_components/jquery/dist/jquery.js',
            'myApp/scripts/controllers/*.js',
            'myApp/scripts/tests/*.spec.js',
            'myApp/scripts/tests/**/*.spec.js'
          ],</code></pre>
  </div>
  </div>
  </p>