如何使用App Config中初始化的Angular Translate测试控制器?

时间:2013-06-27 14:29:43

标签: angularjs jasmine gruntjs yeoman karma-runner

我有一个使用Angular Translate(https://github.com/PascalPrecht/angular-translate)的应用。翻译通过浏览器在应用程序中运行良好,但当我尝试测试任何控制器时,我得到错误:意外请求:GET locale / locale-en.json 。我如何对我的控制器进行单元测试,因为translate在启动时会对语言文件进行GET请求?

我正在使用与Karma的yeoman角度发生器。


App.js:

angular.module('myApp', ['ngCookies', 'ui.bootstrap', 'pascalprecht.translate'])
  .config(function ($routeProvider, $locationProvider, $translateProvider) {

    $routeProvider
      .when('/', {
        templateUrl: 'views/main.html',
        controller: 'MainCtrl'
      })
      .otherwise({
        redirectTo: '/'
      });

      $translateProvider.useStaticFilesLoader({
        prefix: 'locale/locale-',
        suffix: '.json'
      });
      $translateProvider.uses('en');
      $translateProvider.useLocalStorage();
  });

控制器测试:

describe('Controller: DocumentationCtrl', function () {

  // load the controller's module
  beforeEach(module('myApp'));

  var DocumentationCtrl,
    scope,
    $httpBackend;

  // Initialize the controller and a mock scope
  beforeEach(inject(function ($controller, $rootScope, $injector) {
    $httpBackend = $injector.get('$httpBackend');
    scope = $rootScope.$new();
    DocumentationCtrl = $controller('DocumentationCtrl', {
      $scope: scope
    });
  }));

  it('should attach a list of awesomeThings to the scope', function () {
    $httpBackend.whenGET('locale/locale-en.json').respond(200, {
      "TITLE": 'My App'
    });
    expect(scope.awesomeThings.length).toBe(3);
  });

});

文档控制器只是标准生成的控制器。

3 个答案:

答案 0 :(得分:5)

您必须在配置阶段指定首选语言,而不是运行阶段。因此$translate.uses('us')变为$translateProvider.preferredLanguage('us')。 同样适用于useLocalStorage()。这些是配置$translate服务的所有方法。

您还应该尽量避免uses()设置默认语言。请改用preferredLanguage()。原因是,$translate.uses()尝试尽快加载i18n文件, 如果有使用其他语言密钥的cookie或类似内容,uses()将加载两个文件,这就是我们引入preferredLanguage()的原因。是的,这应该可以解决问题。

答案 1 :(得分:1)

避免初始化应用程序级模块,将控制器放在myApp.controllers中并测试此模块。

“我们建议您将应用程序分解为多个模块。(...)这种分解的原因是在测试中,通常需要忽略初始化代码,这往往难以测试。”

http://docs.angularjs.org/guide/module

答案 2 :(得分:0)

我认为你的订单错误:angular-translate的设置尝试在调用uses(lang)之后立即加载语言(确实在块之后)。

在anguluar-translate中开发适配器时遇到了类似的问题。尝试查看https://github.com/PascalPrecht/angular-translate-loader-url/blob/16e559030bce819e8ca1b82fed7163286b57bafe/test/unit/translateUrlLoaderSpec.js哪些是url loader插件的测试。

控制器是否应该稍后注射?