如何使用在 App Config 中初始化的 Angular Translate 测试控制器? [英] How do I test controllers with Angular Translate initialized in App Config?

问题描述

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

I have an app that uses Angular Translate (https://github.com/PascalPrecht/angular-translate). Translate works great in the application via browser but when I try to test any controller I get Error: Unexpected request: GET locale/locale-en.json. How do I unit test my controllers since translate does a GET request for the language file on startup?

我在 Karma 中使用自耕农角度生成器.

I am using the yeoman angular generator with Karma.

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);
  });

});

文档控制器只是一个标准生成的控制器.

The Documentation Controller is just a standard generated controller.

推荐答案

您必须在配置阶段而不是运行阶段指定首选语言.所以 $translate.uses('us') 变成了 $translateProvider.preferredLanguage('us').useLocalStorage() 也是如此.这些都是配置$translate服务的方法.

You have to specify the preferred language within config phase rather then run phase. So $translate.uses('us') becomes $translateProvider.preferredLanguage('us'). Same goes for useLocalStorage(). These are all methods to configure $translate service.

您还应该尽量避免 uses() 设置默认语言.使用 preferredLanguage() 代替.这样做的原因是 $translate.uses() 尝试尽快加载 i18n 文件，如果有使用另一种语言密钥的 cookie 或类似物，uses() 将加载两个文件，这就是我们引入 preferredLanguage() 的原因，是的，这应该可以解决问题.

You should also try to avoid uses() to set a default language. Use preferredLanguage() instead. The reason for this is, that $translate.uses() tries to load a i18n file as soon as possible, if there's a cookie or similar which uses another language key, uses() will load two files, that why we introduced preferredLanguage() And yea, this should solve the problem.

这篇关于如何使用在 App Config 中初始化的 Angular Translate 测试控制器?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！