0

I have a template with behavior I want to test, but it invokes a controller with code I'd like to avoid, and I'd rather inject a mock for it. How do I do that?

I am using Angular 1.7, Karma, and Jasmine.

Template:

<div ng-controller="MyController">
    <span ng-if="(a && b) || (b && !c) || (!a && d)">
        {{ (b || a) + (d || c) }}
    </span>
</div>

Controller:

app.controller('MyController', function($scope, MyService) {
    $scope.a = (MyService.a || -MyService.d)
    $scope.b = (MyService.b + MyService.c) || MyService.a
    $scope.c = -MyService.c || (MyService.a + MyService.d)
    $scope.d = -(MyService.a + MyService.d) - MyService.b
    someOtherCode.IdontWantTo.exec()
})

describe('MyTemplate', () => {
    let compile, $rootScope

    beforeEach(inject(function($compile, $templateCache, _$rootScope_) {
        compile = $compile($templateCache.get('MyTemplate.html'))
        $rootScope = _$rootScope_
    }))

    it('should behave a certain way', () => {
        const $scope = $rootScope.new()
        const element = compile($scope)
        $scope.a = 0
        $scope.d = 3
        $scope.$digest
        expect(element.text()).toEqual('3')
    })

})
wizulus
  • 5,653
  • 2
  • 23
  • 40

1 Answers1

0

I found I can use $controllerProvider.register to override the controller.

beforeEach(module('App', function($controllerProvider) {
    $controllerProvider.register('MyController', function($scope) {
        $scope.mocked = true
    })
}))
wizulus
  • 5,653
  • 2
  • 23
  • 40