Testing asynchronously loaded controllers

[miffels]

Hi tnajdek,

how would you test MyCtrl2 from the boilerplate code? I cannot seem to make it work. When I use your boilerplate to test MyCtrl2, the following happens:

.controller('MyCtrl2', ['$scope', '$injector', function($scope, $injector) {
            console.log('Creating controller...');
            require(['controllers/myctrl2'], function(myctrl2) {
                console.log('Injecting scope...');
                $injector.invoke(myctrl2, this, {
                    $scope: $scope
                });
            });
        }]);

will only output

Creating controller...

It seems Karma is having issues with the asynchronous part. How would you fix that?

Cheers, miffels

[miffels]

As usual, I post an issue and find a solutions soon. But it feels kind of hacky:

Include the controller array as a dependency

define([
    'angular',
    'angular.mocks',
    'app',
    'controllers/myctrl2'
], function(angular, mocks, app, ctrl) {
...

Redefine it in beforeEach before mocking the module

      beforeEach(function() {
            angular.module('myApp.controllers')
                .controller('MyCtrl2', ctrl);
            mocks.module('myApp.controllers');
            mocks.module('myApp.services');

and finally inject the dependencies as usual

            // still in beforeEach
            mocks.inject(function($rootScope, $controller) {
                scope = $rootScope.$new();
                MyCtrl2= $controller('MyCtrl2', {
                    $scope: scope
                });
            });

Isn't there a nicer solution to this?

Cheers, miffels

[PerfectedApp]

Thanks for the post Miffels.

+1 for a nicer solution. A bit of a pain to define a dependency for each async controller.