Mocking dependencies when unit testing AngularJS services with QUnit

Question

I'm trying to unit test an AngularJS service that is dependent on another service, using QUnit as my testing framework. The first test I'm writing is one to verify that my service calls another service under specific circumstances.

Below is a runnable example. I'm mainly looking to get feedback on the contents of the second main closure (which represents a QUnit module). Things I'm particularly interested in:

• Conventions around unit testing AngularJS services with QUnit (e.g. I'm unsure when it's common to prefix variables with a $);
• I'm following this advice (which was for Jasmine though) on mocking a dependent service, but am unsure if I can improve that approach or even need a different one (heck, perhaps I even need / should use a mocking framework?);
• Whether I'm using the injector features of Angular correctly.

Here's a runnable snippet with promised code:

(function() {
    var app = angular.module('demoApp', []);

    app.factory('myService', ['anotherService', function(anotherService) {
        return {
            getTheTruth: function() { return anotherService.someFunction(); }
        };
    }]);
})();
    
(function() {
    // Looking to get feedback on this closure...

    'use strict';
  
    var $injector, anotherService;
    
    QUnit.module('myServiceTests', {
        beforeEach: function() {
            anotherService = {};
            angular.module('demoApp').factory('anotherService', function() {
                return anotherService;
            });            
            $injector = angular.injector(['ng', 'demoApp']);
        }
    });
    
    QUnit.test('Calling getTheTruth relays to anotherService', function(assert) {
        var service = $injector.get('myService');
        anotherService.someFunction = function() {
            assert.ok(true);
        };
        assert.expect(1);
        service.getTheTruth();
    });
    
    // More tests here
})();

<link href="https://cdnjs.cloudflare.com/ajax/libs/qunit/1.16.0/qunit.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/qunit/1.16.0/qunit.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.3/angular.js"></script>
<div id="qunit"></div>

Answer 1

e.g. I'm unsure when it's common to prefix variables with a $

A quick Google and I found a StackOverflow thread about this,

The accepted answer had this to say:

It's a common reference to a jQuery wrapped object. It makes reading the code easier to know which variables are jQuery wrapped.

I would say that you don't need to use $ prefix in your code at all, at least what you have posted.

---

If you were using $scope that would be different as noted by this answer

$scope variables bind to the view where as var does not and is local to the function it was declared in!

---

also noted in the comments

The $ prefix is used as a naming convention identifying native AngularJS services

▼▼▼

Do not use $ to prepend your own object properties and service identifiers. Consider this style of naming reserved by AngularJS and jQuery.

From Google's AngularJS Style Guide