Работа с зависимостями в angularjs Testing

Это для работы (у меня есть разрешение), поэтому я не могу опубликовать точный код.

Поэтому я должен проверить контроллеры большого модуля. Модуль имеет большую конфигурационную функцию с кучей контроллеров для логики разных страниц.

Для реального приложения он загружен bower, что раздражает, так как я тестирую с Karma-Browserify и npm. Таким образом, зависимости беспорядок. Я в основном должен импортировать все, что было загружено из bower.json в package.json.

Это мой karma.conf.js:

module.exports = function(config) {
  config.set({
    basePath: 'resources',
    browserify: {
      debug: true,
      transform: [ 'browserify-shim' ]
    },
    browsers: [ 'PhantomJS' ],
    captureTimeout: 60000,
    client: {
      mocha: {}
    },
    files: [
      'tests/assist/test.js',
      'assets/scripts/libs/logger.min.js'
    ],
    frameworks: [ 'browserify', 'phantomjs-shim', 'mocha', 'chai' ],
    port: 8080,
    preprocessors: {
      'tests/assist/controller.js': [ 'browserify' ]
    },
    reporters: [ 'mocha', 'coverage' ],
    singleRun: true
  });
};

Так что код ниже это мой test.js (удаляет некоторые специфичные для компании названия). Также мне нужно поставить angular.mock. или это не сработает

require('angular');
require('angular-mocks');

//Main module needs these
jQuery = require('jquery');
require('angular-bootstrap');
require('angular-recaptcha');
require('angular-ui-router');
require('ngstorage');
require(**The path to the main module**);
require(**The path to a service it uses**);
require(**The path to a service it uses**);
require(**The path to a service it uses**);

describe('Blah', function () {
  beforeEach(angular.mock.module('myApp'));

  var $controller;

  beforeEach(angular.mock.inject(function(_$controller_) {
    $controller = _$controller_;
  }));

  describe('blahblah', function () {
    it('sets loading to true', function () {
      var $scope = {};
      var controller = $controller('controller', {$scope: $scope});
      assert($scope.showLoading === true);
    });
  });
});

Основной модуль:

(function() {
    'use strict';
})();


// Jquery noconflict
jQuery.noConflict();

var myApp = angular.module('myApp', ['ui.router', 'ngStorage', 'vcRecaptcha', 'ui.bootstrap']);

myApp.config(['$stateProvider', '$urlRouterProvider', '$locationProvider', function($stateProvider, $urlRouterProvider, $locationProvider) {
    ...
}])
.run([blah bunch of dependencies]) {
   ...
}]);

Контроллер (отдельный тьфу):

'use strict';

myApp.controller('controller', ['$scope', '$http', '$localStorage', 'service1', 'service2', 'service3',
    function ($scope, $http, $localStorage, service1, service2, service3) {
   ..
    }
...

Как видите, я в аду зависимости. Я получил пример теста на угловом сайте, основная проблема в том, что зависимости и myApp не видны контроллеру. "ReferenceError: Не удается найти переменную: myApp" в контроллерах / службах

Если у кого-то есть лучший способ пройти тестирование, я весь в ушах.

1 ответ

Решение

Речь идет не об аде зависимости, не о тестировании.

Код, кажется, полагается на myApp глобальная переменная, это строго противоположно тому, для чего предназначены угловые модули.

myApp должна быть локальной переменной, которая определяется динамически в каждой области действия функции

(function () {

var myApp = angular.module('myApp', [...]);
...

})();

(function () {

var myApp = angular.module('myApp');
myApp.controller('controller', ...)
...

})();
Другие вопросы по тегам