如何在我的Karma / Mocha测试套件中测试Angular 1.5控制器？

Question

I'm trying to instantiate my controller in my Mocha test (using Karma as a runner) in order to test some of the controller methods. I'm following something similar to this Angular ES6 Webpack setup .

Here's what I'm trying:

// controller.js

// also, the component that uses this controller
// declares some bindings, like "someData: '<'"

export default class SomeController {
  // notice the injection
  constructor($timeout) {

    // uses ng-annotate
    'ngInject';

  }
}

.

// test.spec.js (same dir as controller)

import SomeController from './controller.js'

describe('MyComponent', () => {
  let $rootScope;
  let $componentController;
  let $timeout;
  let makeController;

  beforeEach(window.module('app'));

  beforeEach(inject((_$componentController_, _$timeout_) => {
    $componentController = _$componentController_;
    $timeout = _$timeout_;
    makeController = () => {
      // I've tried the 2 options below
      // return new Controller($timeout)
      // return $componentController('myComponent', { $timeout }, { someData: [] });
    };
  }));

  describe('Controller', () => {
    it('does something', () => {

      // FAILS HERE

      $ctrl = makeController();

    });
  });
});

So, when I do new Controller() , it expects $timeout to be passed in as an argument to the constructor (it's supposed to be a dependency injection), and I can't figure out how to pass in someData binding.

If I instead try the $componentController (as recommended by Angular 1.5 component docs ), I get this strange error:

compileProvider.preAssignBindingsEnabled is not a function

So, I looked up this method $compileProvider.preAssignBindingsEnabled and tried to set it to both true and false in my module config, but it still throws saying it's not a function. So I've hit a dead end.

Any ideas of how I can instantiate my controller to use it for testing?

Answer 1

Which version of angular are you using ? Went into the same problem and it turned out that I had angular 1.5.7 and angular-mocks 1.5.10. Put angular-mocks to 1.5.7 (same version of angular) fixed the problem. preAssignBindingsEnabled has been added on 1.5.10 eg: https://github.com/angular/angular.js/blob/master/CHANGELOG.md

Answer 2

You're going to have to downgrade to angular 1.5.5. Anything higher than that will give you the "TypeError: $compileProvider.preAssignBindingsEnabled is not a function" error.

Also make sure you that you're angular-mocks is the same version(1.5.5).