title: Inject Controller and Mock AngularJS Services
body: <p>I've finally managed to complete a very simple end to end test, i.e.</p>
  
  <p>In <strong>scenarios.js:</strong></p>
  
  <pre><code>describe('My app', function () {
      beforeEach(function () {
          browser().navigateTo('/');
      });
  
      describe('On Load', function () {
          it('Textbox should be blank', function () {
              expect(input('textbox').val()).toBe('');
          });
      });
  });
  </code></pre>
  
  <p>And my <strong>runner.html</strong> looks like this:</p>
  
  <pre><code>&lt;head&gt;
      &lt;title&gt;End2end Test Runner&lt;/title&gt;
      &lt;script src="/js/libs/angular-scenario.js" ng-autotest&gt;&lt;/script&gt;
      &lt;script src="/js/libs/angular-mocks.js"&gt;&lt;/script&gt;
      &lt;script src="/js/test/e2e/scenarios.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  </code></pre>
  
  <p>This boots up my site, navigates, and checks an input is blank. Ace.</p>
  
  <p><strong>However</strong> I would like to now add this test which expands on what I have so far:</p>
  
  <pre><code>describe('Click on Add', function () {
      it('will add new item if valid', function () {
          input('newItemName').enter('Test Item');
          element('#add').click();
          expect(input('newItemName').val()).toBe('');
          expect(repeater('#items li').count()).toEqual(1);
      });
  });
  </code></pre>
  
  <p>But before I run this test I want to Mock the storage service my app is dependant on.</p>
  
  <p>Here is my <strong>controller definition</strong>:</p>
  
  <pre><code>myapp.controller('MyController', ['$scope', '$routeParams', '$filter', 'storage',
      function ($scope, $routeParams, $filter, storage) { 
          . . . . 
      }
  ]);
  </code></pre>
  
  <p>And this is causing me problems (I think), because I want to do something like this:</p>
  
  <pre><code>describe('Controller Unit Tests', function(){
      var ctrl;
  
      beforeEach(function(){
          ctrl = new MyController();
      });
  
      it('should ....', function() {
          expect(true).toBe(true);
      });
  });
  </code></pre>
  
  <p>But can't because of the way I am declaring my Controller. And the reason I am declaring my controller that way is for minification purposes...</p>
  
  <p>Does anyone have an advice on how this problem could be solved?!</p>